首页 > Web开发 > 详细

Ajax

时间:2019-06-07 11:00:29      阅读:77      评论:0      收藏:0      [点我收藏+]

什么是Ajax:一种不用刷新整个页面便可与服务器通讯的技术

知识点 

1. XMLHttpRequest

var xhr = new XMLHttpRequest()
xhr.open(‘GET‘,‘/api‘,false)
xhr.onreadystatechange = function(){
  if(xhr.readyState == 4){//响应内容解析完成,客户端可以调用
    if(xhr.status == 200){
      console.log(xhr.requestText)
    }
  }
}
xhr.send(null)

2. 状态码

3. 跨域

什么是跨域 

  • 浏览器有同源策略,不允许ajax访问其它域接口
  • 跨域条件:协议、域名、端口,有一个不同即为跨域

可以跨域的标签

  • <img src=xxx>
  • <link href=xxx>
  • <script src=xxx>

跨域的几种方式 

1. JSONP

实现原理

  • 加载 http://myname.y.com/embrace.html
  • 不一定服务器真正有一个embrace.html文件
  • 服务器可以根据请求,动态生成一个文件,返回

同理,你要跨域访问某网站的接口 

  • 该网站给你一个地址http://someone.xx.com/api.js
  • 返回内容格式如 callback({id:1,name:‘xx‘})内容可动态生成
<script>
window.callback = function(data){
  //这是我们得到的跨域信息
  console.log(data)
}
<script src="http://someone.xx.com/api.js">
//以上将返回 callback({...}),然后被浏览器调用

2. 服务器端设置 http header

 

Ajax

原文:https://www.cnblogs.com/embrace-ly/p/10800542.html

(0)
(0)
   
举报
评论 一句话评论(0
关于我们 - 联系我们 - 留言反馈 - 联系我们:wmxa8@hotmail.com
© 2014 bubuko.com 版权所有
打开技术之扣,分享程序人生!