跨域实现方式

Posted

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了跨域实现方式相关的知识,希望对你有一定的参考价值。

同源:同协议、端口、域名(三者必须全部相同)

同源策略:浏览器不允许当前页面向非同源站点发送请求(防止用户信息被恶意站点获取的基本措施)

跨域请求:当前站点向某些非同源站点进行请求

 

跨域请求方式:

一、服务器端允许跨域

服务器端设置响应头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服务器创建一个代理,访问不同域的资源

以上是关于跨域实现方式的主要内容,如果未能解决你的问题,请参考以下文章

跨域请求之jsonp的实现方式

jsonp实现跨域请求

跨域访问方法介绍--使用片段识别符传值

ASP.NET中JSONP的两种实现以及其他跨域解决方案的简单实现

SpringBoot(十三)CORS方式实现跨域

常用的几个JQuery代码片段