跨域详解

什么是同源

同源策略(Same Origin Policy)是一种约定,这是浏览器的最基本也是最核心的安全策略,同源要求域名(IP)、协议、端口号完全一致。非同源的客户端在未经授权的情况下不能读写对方的资源,在请求时浏览器会在控制台中报错

非同源会受到以下限制:

cookie不能读取

DOM无法获得 AJAX请求无法发送

什么是跨域

跨域指跨域名访问,主要有以下三种:

域名不同:www.jd.comwww.baidu.com

域名相同,端口不同:www.baidu.com:80www.baidu.com:443

二级域名不同:wap.baidu.com与www.baidu.com

跨域策略是浏览器针对AJAX的一种限制

JSONP跨域

JSONP指的是JSON with Padding

这是一种非正式的传输协议,该协议允许用户传递一个callback参数给服务端,然后服务端返回数据时会将这个callback参数作为函数名来包裹住JSONP数据,这样客户端就可以使用自己的函数来处理返回的数据。

由于同源策略的限制,XmlHttpRequest只允许请求同源资源,而<script>标签的src属性是不受同源策略的影响的,这样一来这种跨域请求的方式就和AJAX ,XmlHttpRequest协议无关了,我们可以通过使用HTML的script标签来进行跨域请求,并在响应中返回要执行的script代码,其中可以直接使用JSON传递JavaScript对象。

优点:

1、不受同源策略限制

2、兼容性好,适用于低版本IE浏览器

限制:

1、需要目标支持

2、只能发起GET请求

CORS跨域

CORS(Corss-origin resource sharing)中文为:跨域资源共享

CORS需要浏览器和服务器同时支持才可以实现跨域请求(IE不能低于IE10),设置CORS只需要在服务器端配置好请求的header字段即可。

如果服务器允许跨域,只要在返回的响应头中携带以下信息即可:

Access-Control-Allow-Origin:可接受的域(一个具体的域名或者是*表示任意域名)

这样当浏览器请求时,请求头中的Origin会说明请求的来源,当该来源在允许的来源名单中则会成功返回。

CORS支持GET、HEAD、POST请求

前端

JS的继承是怎么回事?

2021-3-2 15:56:04

前端

初解Promise

2021-3-6 17:57:47

0 条回复 A文章作者 M管理员
    暂无讨论,说说你的看法吧
个人中心
今日签到
有新私信 私信列表
搜索