跨域实现方式
同源:同协议、端口、域名(三者必须全部相同)
同源策略:浏览器不允许当前页面向非同源站点发送请求(防止用户信息被恶意站点获取的基本措施)
跨域请求:当前站点向某些非同源站点进行请求
跨域请求方式:
一、服务器端允许跨域
服务器端设置响应头Access-Control-Allow-Origin: *
可以直接进行请求
二、JSONP(只支持GET请求)
iframe、img、style、script等元素的src属性拥有可以直接向不同域请求资源的特性
jsonp正是利用script标签从此进行跨域请求
1 <script> 2 function hello(res){ 3 console.log(res) 4 } 5 </script> 6 <script src=" https://cnodejs.org/api/v1/topic/5433d5e4e737cbe96dcef312?callback=hello"></script>
// 当前链接不支持JSONP,所以会报错
实现机制:
1.首先,服务器得支持JSON格式,返回的数据是一个由回调函数包裹的数据 hello(data)
2.当前站点需要实现hello方法,在资源请求完成前声明方法
三、CORS
需要浏览器和服务器同时支持,需要服务器提供CORS接口,浏览器根据AJAX请求自动添加一些附加的头信息,有时会多出一次附加请求(预检preflight)
四、代理跨域
通过同域名下的web服务器创建一个代理,访问不同域的资源