【Javascript】搞定JS面试——跨域问题

1. 什么是跨域？
2. 为何不能跨域？
3. 跨域的解决方案都有哪些（解决方法/适用场景/get仍是post）?

  1、什么是跨域?

      只要协议、域名、端口有任何一个不一样，就是跨域。

 

       

2、为何不能跨域？

      浏览器有一个同源策略，用来保护用户的安全。

     若是没有这个策略的话，a网站就能够操做b网站的页面，这样将会致使b网站的页面发生混乱，甚至信息被获取，包括服务器端发来的session。  

     具体详情请查看：  http://www.cnblogs.com/alvinwei1024/p/4626054.html 

3、跨域的解决方案

     一、JSONP          

解决方法	0）浏览器是能够引入不一样域下的JS文件，利用这个特性，来实现跨域。 1）直接在a.com页面，添加一个script标签，src属性为b网站的页面url， 而且传入一个callback参数。 <script> function dosomething(jsonData){ } </script> <script src="http://www.b.com/handlerData.php? callback=dosomething"></script> 2）b网站的handlerData.php，实际作的操做就是：生成一段可执行的 JS代码，调用你传入的dosomething函数。 详细介绍：http://www.cnblogs.com/2050/p/3191744.html
应用场景	经常使用的解决方案
请求方式	get ：它本质上是下载一个资源文件。

     

     二、document.domain

应用场景	必须知足两个条件 1）页面中嵌入firame框架。   2）当前页面和iframe中的页面，主域、协议、端口必须彻底一致。
解决方法	好比页面地址是http://a.baidu.com/，嵌入的iframe是 http://b.baidu.com/ 分别设置页面和iframe的document.domain为： baidu.com，就能够解决问题。

 

     

     三、使用H5中的window.postMessage

 

解决方法	window.postMessage(message,targetOrigin)  方法是html5新引进的特性，可使用它来向其它 的window对象发送消息，不管这个window对象是属于同源或不一样源，目前IE8+、FireFox、Chrome、 Opera等浏览器都已经支持window.postMessage方法。
应用场景	1）页面和其打开的新窗口的数据传递 2）.多窗口之间消息传递 3）.页面与嵌套的iframe消息传递  详细介绍：http://www.cnblogs.com/dolphinX/p/3464056.html

     

     四、CORS方案

解决方法	CORS定义一种跨域访问的机制，可让AJAX实现跨域访问。CORS 容许一个域上的网络应用 向另外一个域提交跨域 AJAX 请求。实现此功能很是简单，只需由服务器发送一个响应标头便可。 header("Access-Control-Allow-Origin", "*"); ---“*”号表示容许任何域向咱们的服务端提交请求
应用场景	跨域post提交数据
请求方式	post
参考连接	详细介绍请查看： http://www.cnblogs.com/Darren_code/p/cors.html http://www.ruanyifeng.com/blog/2016/04/cors.html