什么是跨域?
JavaScript出于安全方面的考虑,不允许跨域调用其他页面的对象。
跨域简单来说就是受JavaScript同源策略的限制,A网站域名下的js无法操作B网站域名下的对象。
什么是同源策略及其限制内容?
同源策略是一种约定,它是浏览器最核心也最基本的安全功能,如果缺少了同源策略,浏览器很容易受到XSS、CSRF等攻击。所谓同源是指"协议+域名+端口"三者相同,即便两个不同的域名指向同一个ip地址,也非同源。
一个域名的组成是:
http://www.abc.com:8080/scripts/jquery.js
协议//子域名.主域名:端口号/请求资源地址
同源策略限制的内容有:
- Cookie、LocalStorage、IndexedDB 等存储性内容
- DOM 节点
- AJAX 请求发送后,结果被浏览器拦截了
但是有三个标签允许跨域加载资源:
<img src=XXX>
<link href=XXX>
<script src=XXX>
跨域的几种解决方式
-
jsonp
1)jsonp原理
利用<script>
标签没有跨域限制的漏洞,网页可以得到从其他来源动态产生的 JSON 数据。JSONP请求一定需要对方的服务器做支持才可以。 -
cors
-
postMessage
-
websocket
-
node中间件代理
-
Nginx反向代理