Compartir por

Abordar las limitaciones de la directiva del mismo origen en los complementos de Office

El explorador o control de vista web aplica la directiva del mismo origen, lo que impide que un script cargado desde un dominio obtenga o manipule las propiedades de una página web de otro dominio. Esta directiva significa que, de forma predeterminada, el dominio de una dirección URL solicitada debe ser el mismo que el dominio de la página web actual. Por ejemplo, esta directiva impide que una página web de un dominio realice llamadas de servicio web XmlHttpRequest a un dominio distinto del que se hospeda.

Dado que los complementos de Office se hospedan en un control de vista web, la directiva del mismo origen también se aplica a los scripts que se ejecutan en sus páginas web.

La directiva de mismo origen puede ser un impedimento innecesario en muchas situaciones, como cuando una aplicación web hospeda contenido y API en varios subdominios. Puede usar algunas técnicas comunes para superar de forma segura la aplicación de directivas del mismo origen. En este artículo solo se proporciona la introducción más breve a algunos de ellos. Use los vínculos proporcionados para empezar a investigar estas técnicas.

Implementar un código del lado del servidor con un esquema de autorización basado en tokens

Una manera de abordar las limitaciones de la directiva del mismo origen es proporcionar código del lado servidor que use flujos de OAuth 2.0 para permitir que un dominio obtenga acceso autorizado a los recursos hospedados en otro.

Uso compartido de recursos entre orígenes (CORS)

Para más información sobre el uso compartido de recursos entre orígenes, consulte los muchos recursos disponibles en la web, como el uso compartido de recursos entre orígenes (CORS).

Nota:

Si el complemento usa la activación basada en eventos o informes de correo no deseado integrados en Outlook, también debe configurar un URI conocido para habilitar CORS o SSO. Para obtener más información, consulte Uso del inicio de sesión único (SSO) o el uso compartido de recursos entre orígenes (CORS) en el complemento de Office de informes de correo no deseado o basado en eventos.

Compilación de su propio proxy mediante iframe y postMessage (mensajería entre ventanas)

Para obtener un ejemplo de cómo crear su propio proxy mediante iframe y postMessage, vea Mensajería entre ventanas.

Usar JSONP para acceso anónimo

Otra manera de superar las limitaciones de la directiva del mismo origen es usar JSONP para proporcionar un proxy para el servicio web. Para ello, incluya una etiqueta de script con un atributo src que apunte a algún script hospedado en cualquier dominio. Puede crear mediante programación las etiquetas de script, crear dinámicamente la dirección URL para apuntar al atributo src y, después, pasar parámetros a la dirección URL a través de parámetros de consulta URI. Los proveedores de servicios web crean y hospedan código JavaScript en direcciones URL específicas y devuelven scripts diferentes dependiendo de los parámetros de consulta URI. Después, estos scripts se ejecutan donde se insertan y funcionan del modo previsto.

En el ejemplo siguiente de JSONP se usa una técnica que funciona en cualquier complemento de Office.

// 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);
}

Nota:

JSONP es una técnica heredada que tiene un mayor riesgo de seguridad que las alternativas modernas. Use JSONP solo si debe mantener integraciones anteriores que aún no se pueden migrar. Para un nuevo desarrollo, prefiere CORS o un proxy del lado servidor.

Vea también

  • Last updated on