两个url的域名、端口和协议全部都是相同的,那它们就是同源。
如果不同源一个url去另一个url就是跨域
如果不跨域的话,ajax访问不到
从a域名向b域名发一个get请求。这个请求能发出去,服务器也能得到请求,并且也会响应。但js拿不到它的response ,原因就是浏览器为了安全起见给限制了
那么如果我们要跨越这个浏览器的限制呢?
如果你是要兼容ie就选用jsonp,不需要兼容就cors
jsonp就是请求一个js文件。这个js文件会执行一个回调,这个回调里面就有我们的布局 。所以就可以以callback当成参数传给后台。那么后台会把这个函数再次返回给我们执行
如果有其他网站要调用我们的jsonp,我们可以判断其他网站请求头的referer
cors解决方案
可以在中间件设置响应头response.setHeader('Access-Control-Allow-Origin','*')
jsonp解决方案
- 原理:动态创建script标签,通过script标签的src请求没有跨域限制来获取资源
- 核心原理:如果script标签的src属性的请求,服务器返回的是一个函数调用。则浏览器会执行这个函数
这是浏览器script标签的一个的漏洞(历史遗留问题) jsonp仅支持get请求(因为能用url传参)
JSONP与CORS区别
-
CORS:
- 服务器返回响应头,前端无需任何处理
- 简单快捷,支持所有请求方式
-
JSONP
-
浏览器:自定义响应回调函数,使用script标签的src请求
- 利用浏览器的src属性没有跨域这一限制特点
-
服务器:接收callback参数,返回函数调用
-
处理复杂,并且只支持get请求
- 原因:get请求参数直接在url后面拼接,而post请求参数是放在请求体中
-