当前的 Web 浏览器设计不能轻松而安全地从多个源获取内容并将其显示到页面上。了解开发人员如何充分利用可用的工具来完成该任务,以及使用这些工具给所得应用程序带来的安全和可伸缩性方面的压力。另外,学习提出的几种用于补救此情形的浏览器改进,以及如何参与相关讨论,使 Web 开发超越这一障碍,使互操作性达到的一个新水平
外部帮助
早期的解决方案是 Microsoft 的 Remote Scripting,它使用一个 Java applet 与服务器端组件交换 XML 格式的消息。此方法很快就因为供应商的争论以及 Java Virtual Machine (JVM) 和安全模型的差异而变得不实用。
Microsoft 稍后构建了 XMLHttpRequest (XHR) 对象,其设计者的预想是只能通过 Microsoft Outlook® Web Access (OWA) 来使用该对象。该对象最初只能由 Windows Internet Explorer 用户使用,直到多年后 Mozilla 和 Safari 采用它时,才得到广泛使用。它最初是一个外部的 Microsoft ActiveX 对象,而当前的实现则是浏览器内的本地对象。虽然其名称为 XHR,但是 XHR 对象却可以传输任意格式的数据而非仅限于有效的 XML 格式数据。
很多开发人员使用 Macromedia Flash 的 XML 通信特性来构建可嵌入的组件与服务器进行通信。XMLSocket 和 flex.net.socket 对象提供了类似 XHR 的功能,但附带了额外的通信控制和 XML 解析功能。
内部工作
由于外部传输机制相关的问题和依赖性,互联网开发团体协作发现并开发了几个浏览器本地的远程调用方法。
使用一个隐藏的 iframe 元素来加载外部内容:然后通过 DOM 访问 iframe,提取加载文档中的内容。您可指定 URL querystring 中的任何参数或动态创建一个表单,此表单以 iframe 为目标提交到服务。此方法与很大范围内的当前的和旧式浏览器兼容。
使用 img 元素发送内容请求:服务器使用 URL 的 querystring 中的参数执行其任务,然后在 cookie 中返回编码后的内容。此方法仅限于可轻松通信数量的数据使用,因为 querystring 和 cookie 都有大小限制。
在当前页面的 DOM 中动态创建脚本元素:加载后,立即执行服务器所提供的代码。服务器使用 URL querystring 中的参数。
突破界限
大多数可用于异步检索内容的技术都继承了 JavaScript 安全模型的安全性,它使脚本只与源于该脚本所属页面所在的同一服务器的元素进行交互。这就是所有浏览器都实现了的同源策略(Same Origin Policy)。
要让 Web 页面从第三方检索内容,必须避开同源策略。常用的不受同源策略限制的例外是<script> 标记技术,由此向页面的 DOM 追加 <script> 元素,致使其加载并运行元素的 src 属性所指定的 URL 处发现的代码。
使用 <script> 标记运行来自多个站点的脚本以所有相关站点间的高水平信任为前提,因为所有此类脚本都在相同的执行和安全上下文中运行,因此可能获得其他站点的信息和 cookie 的访问权。
……
