解决 Office 加载项中的同源策略限制

浏览器或 Web 视图控件强制执行的同源策略可防止从一个域加载的脚本从另一个域获取或操作网页的属性。 即,默认情况下,请求 URL 的域必须与当前网页的域相同。 例如,此策略将阻止一个域中的网页对非托管该网页的域执行 XmlHttpRequest Web 服务调用。

由于 Office 加载项托管在 Web 视图控件中,因此同源策略也适用于在其网页中运行的脚本。

同一来源的策略可能在许多情况下是不必要的障碍,例如当 web 应用程序跨多个子域托管内容和 API 时。 有一些常见技术可以安全解决同一来源策略执行的问题。 本文仅提供有关部分内容的最简洁的介绍。 请使用提供的链接开始对这些技术进行研究。

针对匿名访问使用 JSONP

解决同一来源策略限制的一个方法是使用 JSONP 为 web 服务提供代理。 可以通过包括指向任何域上托管的某些脚本的 script 标签(带有 src 属性)实现此过程。 可以使用编程的方法创建 script 标签,动态创建 src 属性所指向的 URL,然后通过 URI 查询参数将参数传递给 URL。 Web 服务提供程序在特定的 URL 位置创建和托管 JavaScript 代码,并根据 URI 查询参数返回不同的脚本。 这些脚本然后在插入位置执行并按照预期的方式工作。

下面是使用可在任何 Office 外接程序中工作的技术的 JSONP 示例。

// Dynamically create an HTML SCRIPT element that obtains the details for the specified video.
function loadVideoDetails(videoIndex) {
    // Dynamically create a new HTML SCRIPT element in the webpage.
    const script = document.createElement("script");
    // Specify the URL to retrieve the indicated video from a feed of a current list of videos,
    // as the value of the src attribute of the SCRIPT element. 
    script.setAttribute("src", "https://gdata.youtube.com/feeds/api/videos/" + 
        videos[videoIndex].Id + "?alt=json-in-script&callback=videoDetailsLoaded");
    // Insert the SCRIPT element at the end of the HEAD section.
    document.getElementsByTagName('head')[0].appendChild(script);
}

使用基于令牌的授权架构实施服务器端代码

解决同一来源策略限制的另一个方法是提供使用 OAuth 2.0 流的服务器端代码,让一个域获取对另一个域上托管的资源的授权访问。

使用跨源资源共享 (CORS)

若要了解有关跨源资源共享的详细信息,请参阅 Web 上可用的许多资源,例如 跨源资源共享 (CORS)

注意

有关如何在实现基于事件的激活或集成垃圾邮件报告的 Outlook 外接程序中使用 CORS (预览版) ,请参阅在 基于事件的或垃圾邮件报告 Outlook 外接程序中使用单一登录 (SSO) 或跨源资源共享 (CORS)

使用 IFRAME 和 POST MESSAGE 生成您自己的代理(跨 Window 消息传递)。

有关如何使用 IFRAME 和 POST MESSAGE 生成自己代理的示例,请参阅跨窗口消息传送

另请参阅