1.跨域问题是什么?
浏览器的同源策略是浏览器上为安全考虑的重要的安全策略。
从一个域上加载的脚本不允许访问另外一个域的文档属性。
如果没有同源限制,恶意网站的页面就能嵌入其它网站的页面,并窃取到关键信息。比如嵌入某网站登录页面,在用户登录的时候拿到账号密码。
跨域请求在一些浏览器上还是会被发起,但是会被浏览器拦截。Chrome下跨域请求不被发起。
2.同源是什么?
同源:URL由协议、域名、端口、路径组成,如果协议、域名、端口相同,就是同源。
3.哪些标签没有同源限制?
<script> <img> <iframe> <link>
都可以加载跨域资源,不受同源限制。
这些标签不受同源限制的原理是什么?script加载资源的原理是什么?(待补充)
script并无跨域限制, 这是因为script标签引入的文件不能够被客户端的 js 获取到, 不会影响到原页面的安全, 因此script标签引入的文件没必要遵循浏览器的同源策略。
4.解决方法
a.使用
<script> <img> <iframe> <link>
等标签加载资源
b.通过jsonp跨域
1.用法
JSONP形式的访问是基于script标签。可以通过第三方服务器生成的动态js代码来回调本地js方法,方法中的参数由第三方服务器在后台获取,并以JSON形式填充到js方法中。
使用js可以生成如下html:
<script type="text/javascript" src="https://www.targetDomain.com/jsonp?callback=callbackName"></script>
2.原理
服务器端会返回js代码,这段代码会自动执行,并负责调用回调函数callbackName。
3.特点
兼容性好,在请求结束后通过callback方式回传结果。
使用get方式进行资源请求。
它只支持跨域HTTP请求这种情况,不能解决不同域的两个页面之间如何进行JavaScript调用的问题。
c.通过修改document.domain来跨子域
d.使用window.name来进行跨域
e.使用HTML5中新引进的window.postMessage方法来跨域传送数据
f.使用代理服务器,使用代理方式跨域更加直接,因为同源限制是浏览器实现的。如果请求不是从浏览器发起的,就不存在跨域问题了。
g.CORS全称是"跨域资源共享"(Cross-origin resource sharing),CORS需要浏览器和服务器同时支持。目前,所有浏览器都支持该功能
(每种方法如何实现,待补充)
http://louiszhai.github.io/2016/01/11/cross-domain/#flash-URLLoder