javascript跨域訪问探索之旅

需求：

        近期工作负责一个互联网应用A（我公司应用）与还有一个互联网应用B进行通讯。通讯的方式是这种：还有一个互联网应用某些表单信息须要从我公司的互联网应用获取。首先用户訪问互联网应用B。接着在表单编辑页面点击button创建新窗体显示互联网应用A内容。用户在应用A窗体选取好内容后点击button，应用A的窗体关闭。应用A选取好的内容填充到应用B特定的表单元素上。

       这个问题最简化描写叙述就是，浏览器有两个不同站点（域）的页面，页面B须要获取页面A的信息。

问题解决过程：

      刚開始我也不知道这个是跨域问题，尽管同事一開始就告诉我说这是javascript跨域问题，可是要自己解决这个问题，那么至少须要了解背景知识，所以我忽略同事提供的线索。无论是不是跨域的问题，这个问题告诉我的是浏览器的两个展示不同站点的窗体要进行通信，那么首先要确定的是能否两个站点的窗体能否够通信,鉴于眼下掌握的资料有限。我做了一个大胆的决定——基于自己浅薄的知识储备进行如果，如果两个站点的窗体的javascript（或其它client脚本技术）能够进行通信，那么试想已经打开且成功登陆的支付宝等应用页面后，用户不小心訪问了还有一个危急站点。这个危急站点的javascript找到支付宝网页就获取到敏感信息，那么这样浏览器每次仅仅打开一个才是安全的，由于谁也不知道打开的下一个网页是否有javascript获取自己的敏感信息，而打开的新站点页面也操心浏览器存在的其它站点是否有Javascript获取自己的敏感信息，这种互联网环境人人自危。如果浏览器的两个站点页面不能通信，那么我这个任务就不能完毕了。

       正正是进行了如果。我怀着忐忑不安的心情開始了浏览器内不同站点窗体通信的探索之旅。

既然是浏览器是载体。那么我首先从浏览器入手，浏览器最初是为了解析超文本语言而产生的。而超文本就是html，所以我就了解html技术。了解html技术我常上的站点是www.w3school.com。了解html技术，同一时候今天的html与Javascript技术是密不可分的。我也同一时候了解javascript技术。了解html与javascript过程中。主要了解内置对象和html dom，由于这两个站点终于到浏览器的是html字符流，而浏览器将html字符流构建html dom树，浏览器的一个窗体的载体就是window对象，我查看了介绍发现opener属性十分显眼，由于opener这个属性能够引用到新创建的窗体对象window，而window对象拥有全局变量、javascript定义。那么不就整整符合自己的需求吗？同一时候也表示一点点操心，是不是说。我从一个站点打开了支付宝而且登录。那么打开支付宝站点的页面就能够获取支付宝站点页面的信息了？如果真的是这样。互联网世界的危急无处不出，可是測试后发现，opener获取到的window对象是有限制的，不能获取document对象等。于是逐个查看浏览器对象，直到document对象的domain属性，这个属性能够返回当前文档的域名。在一个不起眼的提示与凝视找到了人生的希望——提示：domain 属性能够解决因同源安全策略带来的不同文档的属性共享问题。点击这里。了解同源安全策略的具体信息。

       总结链接网页的内容是JavaScript 的同源策略。查看了整个文档。我的注意力停留在跨域脚本API訪问那一部分。window.postMessage是一个应用于安全地使用跨源通信的方法。跨源通信的模型是这种。源A窗体对象获取源B窗体对象。使用源B窗体对象调用postMessage方法将数据传送到源B，源B窗体对象须要加入addEventListener进行事件监听，其实两个源还是隔离的，同一时候发送的消息由监听者决定怎样处理。

至此。我的问题已经攻克了。

总结：

   1）做事方式上：遇到问题不能直接就百度、google、bing等，尤其是国内的搜索引擎，垃圾结果一大堆，首先是圈定问题域所在。然后再去查找相关技术知识，提高效率，这些技术知识是对解决方法进行推断的前提。不然你找来的解决的方法可能隐藏着巨bug，同一时候随便百度都能找到的解决的方法的说明仅仅要找一个会百度的人都能够取代你。那么自己的价值体如今什么地方呢？

   2）基础是技术突破关键点，基础扎实能够推理出基于上层实现的技术，举一反三。