《JavaScript设计模式》——11.2 一切只因跨域

11.2 一切只因跨域

“哦,为什么会出现,什么是跨域?”小白问。

“由于JavaScript对安全访问因素的考虑,不允许跨域调用其他页面,这里的域你可以想象成域名,不同域名下的页面是不能直接调用的。这样百度域名下的页面是不允许直接调用淘宝页面。这也是一种JavaScript中因同源策略所定义的限制,不过仅此一点限制还不够,JavaScript还对同一域名不同的端口号、同一域名不同协议、域名和域名对应的IP、主域与子域、子域与子域等做了限制,都不能直接调用。

“这么多限制,原来我刚才遇到的情况正是主域与子域之间的跨域造成的呀。那么纵使这样,在主域下,我的相册页面还能与子域中的图片上传模块所在的服务器之间进行通信么?”小白问。

“这就需要一些技巧了,你看,相册页面与图片上传模块所在的服务器之间你可抽象成两个对象,那么现在的问题是,他们之间被一条河隔开了,就像天河两端的牛郎织女,只能远远观望而不能相聚一见。他们的情感感动万物,所以才有那么多需求为他们搭桥。同样你想让跨域两端的对象之间实现通信,你就需要找个代理对象来实现他们之间的通信。”

“我明白了,虽然他们之间分开了,但是我们可以找一个代理对象来实现相互之间的通信,不过对于这类代理对象又有哪些呢?”小白问。

时间: 2024-09-15 14:56:13

《JavaScript设计模式》——11.2 一切只因跨域的相关文章

JavaScript使用HTML5的window.postMessage实现跨域通信例子

 这篇文章主要介绍了JavaScript使用HTML5的window.postMessage实现跨域通信例子,需要的朋友可以参考下 JavaScript由于同源策略的限制,跨域通信一直是棘手的问题.当然解决方案也有很多:  1.document.domain+iframe的设置,应用于主域相同而子域不同:  2.利用iframe和location.hash,数据直接暴露在了url中,数据容量和类型都有限  3.Flash LocalConnection, 对象可在一个 SWF 文件中或多个 SW

JavaScript学习总结(二)——延迟对象、跨域、模板引擎、弹出层、AJAX示例

一.AJAX示例 AJAX全称为"Asynchronous JavaScript And XML"(异步JavaScript和XML) 是指一种创建交互式网页应用的开发技术.改善用户体验,实现无刷新效果. 1.1.优点 不需要插件支持 优秀的用户体验 提高Web程序的性能 减轻服务器和带宽的负担 1.2.缺点 浏览器对XMLHttpRequest对象的支持度不足,几乎所有浏览器现在都支持 破坏浏览器"前进"."后退"按钮的正常功能,可以通过简单的

JavaScript使用HTML5的window.postMessage实现跨域通信例子_javascript技巧

JavaScript由于同源策略的限制,跨域通信一直是棘手的问题.当然解决方案也有很多: 1.document.domain+iframe的设置,应用于主域相同而子域不同: 2.利用iframe和location.hash,数据直接暴露在了url中,数据容量和类型都有限 3.Flash LocalConnection, 对象可在一个 SWF 文件中或多个 SWF 文件间进行通信, 只要 在同一客户端就行,跨应用程序, 可以跨域. window.name 保存数据以及跨域 iframe 静态代理动

Javascript中iframe常用技巧整理(自适应/跨域)

iframe 很多网站都在用,虽然方便开发与维护(可能同时有几个页面调用同一个 iframe ),不过却存在安全问题.嵌入 iframe 的页面,父页面与子页面均可以很轻松的在同域或跨子域的情况下进行读写操作:在完全不同域的情况下,也可以通过更改 hash 的方式进行通信.下面我在九个不同(版本的)浏览器中对此进行数据传输与更改的兼容性测试. 同域或跨子域读写操作 iframe 里的内容 父页面读写操作子页面:  代码如下 复制代码 <iframe id="test-iframe"

JavaScript两种跨域技术全面介绍_javascript技巧

这一策略对于JavaScript代码能够访问的页面内容做了很重要的限制,即JavaScript只能访问与包含它的文档在同一域下的内容. JavaScript这个安全策略在进行多iframe或多窗口编程.以及Ajax编程时显得尤为重要.根据这个策略,在baidu.com下的页面中包含的JavaScript代码,不能访问在google.com域名下的页面内容:甚至不同的子域名之间的页面也不能通过JavaScript代码互相访问.对于Ajax的影响在于,通过XMLHttpRequest实现的Ajax请

JavaScript跨域方法汇总_javascript技巧

做Web开发经常需要面对跨域问题,跨域问题的根源是浏览器安全中的同源策略,比如说,对于http://www.a.com/1.html来说: 1.http://www.a.com/2.html是同源的: 2.https://www.a.com/2.html是不同源的,原因是协议不同: 3.http://www.a.com:8080/2.html是不同源的,原因是端口不同: 4.http://sub.a.com/2.html是不同源的,原因是主机不同. 在浏览器中,<script>.<img

js跨域请求的5中解决方式

这篇文章主要介绍了js跨域请求的5中解决方式的相关资料,需要的朋友可以参考下     跨域请求数据解决方案主要有如下解决方法: ? 1 2 3 4 5 JSONP方式 表单POST方式 服务器代理 Html5的XDomainRequest Flash request 分开说明: 一.JSONP: 直观的理解: 就是在客户端动态注册一个函数 function a(data),然后将函数名传到服务器,服务器返回一个a({/*json*/})到客户端运行,这样就调用客户端的 function a(da

Ajax跨域请求 JSON JSONP

同源策略和跨域-总结 目录: 1.同源策略 2.跨域 3.几种跨域技术   1.同源策略 什么叫同源? URL由协议.域名.端口和路径组成,如果两个URL的协议.域名和端口相同,则表示他们同源.相反,只要协议,域名,端口有任何一个的不同,就被当作是跨域. e.g. 对于http://store.company.com/dir/page.html进行同源检测: URL 结果 原因 http://store.company.com/dir2/other.html 成功 仅路径不同 http://st

js跨域问题 常见的集中解决方案

一.什么是跨域? 要理解跨域问题,就先理解好概念.跨域问题是由于JavaScript语言安全限制中的同源策略造成的. 简单来说,同源策略是指一段脚本只能读取来自同一来源的窗口和文档的属性,这里的同一来源指的是主机名.协议和端口号的组合. URL 说明 是否允许通信 http://www.a.com/a.js http://www.a.com/b.js 同一域名下 允许 http://www.a.com/lab/a.js http://www.a.com/script/b.js 同一域名下不同文件