跨域、JSONP、CORS

228 阅读1分钟
  1. 什么是同源
  • 浏览器的同源策略,域名,协议,端口必须全部相同才可以访问 跨域。如当JS在源A中,只能获取源A的数据,不能获取源B的数据,即不允许跨域

  • 协议、域名、端口三者之间任意一个与当前页面url不同即为跨域

https://baidu.com 和 https://www.baidu.com不同源

  1. jsonp跨域

为了解决部分浏览器不支持cors这一问题,需要使用jsonp方式进行跨域。它是利用script的src属性可以跨域访问其他网站的js这一特性,直接请求不同源网页的js,需要后端配合。

在请求发起方定义一个callback函数,并在被请求网站调用该函数,将数据以参数形式传入

函数的名字是一个随机数,在callback中以src形式传参,被请求方接受这个参数,并以此给callback命名,返回这个函数并执行。

从而实现跨域,但是jsonp的缺点在于,由于借助的是script标签,所以只能使用get方式请求,不支持post,并且不能像ajax那样获取到状态和响应信息等

  1. cors跨域

发送请求时,被请求网站的后端获取到请求,给被请求页面加上Access-Control-Allow-Origin

response.setHeader('Access-Control-Allow-Origin','来访页面的协议+域名+端口')

IE6、7、8、9都不支持