怎么更好掌握Web前端技术？JS的跨域是怎么回事？

怎么更好掌握Web前端技术？JS的跨域是怎么回事？JavaScript跨域是指通过JS在不同的域之间进行数据传输或通信，比如用ajax向一个不同的域请求数据，或者通过JS获取页面中不同域的框架中(iframe)的数据。只要协议、域名、端口有任何一个不同，都被当作是不同的域。下面来看看吧。

在此之前，我们首先要了解为什么需要跨域。跨域，指的是浏览器不能执行其他网站的脚本。它是由浏览器的同源策略造成的，是浏览器对JavaScript施加的安全限制。简单来说，跨域的作用就是让你能访问不是一个域的文件。
　　

如果大家对于学习前端有任何问题，学习方法，学习路线，如何学习有效率的问题，
可以随时来咨询我，或者缺少系统学习资料的，我做这行年头比较久，
自认为还是比较有经验的，可以帮助大家提出建设性建议，851231348这是我的web前端交流qun，
有任何问题可以随时来咨询我。

要解决跨域问题，我们可以使用以下几种方法：

一、通过jsonp跨域(实际上是动态创建script标签)

jsonp(json with Padding)是资料格式json的一种“使用模式”，可以让网页从别的网域要资料。jsonp也叫填充式json，是应用json的一种新方法，只不过是被包含在函数调用中的json。jsonp由两部分组成：回调函数和数据。回调函数是当响应到来时应该在页面中调用的函数，而数据就是传入回调函数中的json数据。

二、通过document.domain+ iframe (只有在主域相同的时候才能使用该方法)

两个不同域的a.html和b.html

解决办法：在两个页面都插入document.domain，这样就能访问iframe里window对象的各种属性。

三、使用window.name来进行跨域

原理：在一个窗口(window)的生命周期内,窗口载入的所有的页面都是共享一个window.name的，每个页面对window.name都有读写的权限

四、使用HTML5的window.postMessage方法来跨域传送数据

五、利用CORS

CORS是自定义HTTP头部，使浏览器和服务器对比，从而决定请求和响应是否应该进行。

IE8使用XDR对象实现CORS，和XHR类似用法

现代浏览器使用普通的XMLHttpRequest对象请求就行。

当然，实现JavaScript跨域的方法还有图片Ping、利用flash等。跨域是前端最重要的面试题之一，掌握它你就比别人多了一个优势，如果你想学好Web前端开发，建议参加专业的学习方式。

怎么更好掌握Web前端技术？JS的跨域是怎么回事？相关推荐

Web前端技术历经的洗礼和蜕变
随着互联网产业的爆炸式增长,与之伴生的Web前端技术也在历经洗礼和蜕变.尤其是近几年随着移动终端的发展,越来越多的人开始投身或转行至新领域,这更为当今的IT产业注入了新的活力.尽管Web前端技术诞生至 ...
美团点评金融平台Web前端技术体系
背景随着美团点评金融业务的高速发展,前端研发数量从 2015 年的 1 个人,扩张到了现在横跨北上两地 8 个事业部的将近 150 人.业务新,团队新,前端领域框架技术又层出不穷,各个业务的研发团队 ...
最受欢迎web前端技术总结
Web前端技术发展非常快,主流技术的进步.想想刚毕业那会用asp技术.目前,该网站已经非常少见主流应用. 后来的后来J2EE框架.然后SpringMVC声望,然而,最近的各种js框架广泛传播,Html ...
经验分享：如何系统学习 Web 前端技术？
本文作者:曾亮.晟暄科技 CEO ,HTML5 & Node.js 技术讲师. Javascript前后端全栈开发人员 DDD/CQRS 设计师对 Node.js 和 HTML5 有多年开发 ...
Web前端技术 Web学习资料 Web学习路线 Web入门宝典（不断更新中）
(此文档于2019年3月停止再更新,后续更新移步至:https://github.com/liuyuqin1991/polaris) 学习路线第一章技术(核心单独列章节) 1.Node Node. ...
转载《美团点评金融平台Web前端技术体系》
复制代码作者:禹霖原文地址: tech.meituan.com/2018/03/16/- 背景随着美团点评金融业务的高速发展,前端研发数量从 2015 年的 1 个人,扩张到了现在横跨北上两地 ...
web前端技术(一) 之从小白到大牛
web前端技术(一) 第一章 web前端基础目录 web前端技术(一) 前言一.前端技术的基础是什么二.前端基础学习 1.HTML 1.1HTML文件的创建 1.2HTML文档的结构 1.3HT ...
web前端技术的学习(一)
web前端技术的学习( 一 ) 一.HTML +CSS系列之导学 1.1拨云见日 1.2 朔本求源 1.3 风生水起 1.4 巧夺天工二.什么是HTML.CSS? 2.1 是做网站的编程语言. 2. ...
现代前端技术解析：Web前端技术基础
最近几年,越来越多的人投入到前端大军中:时至至今,前端工程师的数量仍然不能满足企业的发展需求:与此同时,互联网应用场景的复杂化提高了对前端工程师能力的要求,一部分初期前端工程师并不能胜任企业的工作 ...

怎么更好掌握Web前端技术？JS的跨域是怎么回事？

怎么更好掌握Web前端技术？JS的跨域是怎么回事？相关推荐

最新文章

热门文章