Pasar datos a un cuadro de diálogo mediante parámetros de consulta o almacenamiento local

Si el complemento se ejecuta en una plataforma o host que no admite el conjunto de requisitos dialogApi 1.2, no puede usar el messageChild método para enviar datos desde una página host a un cuadro de diálogo. En su lugar, use uno de los siguientes enfoques.

  • Almacenamiento local : escriba datos window.localStorage en en la página host antes de abrir el cuadro de diálogo. Ambas ventanas pueden acceder al mismo almacenamiento local si comparten el mismo dominio, incluido el número de puerto.
  • Parámetros de consulta : anexe pares clave-valor a la dirección URL que se pasa a displayDialogAsync. El cuadro de diálogo lee los valores cuando se abre.

Para obtener el enfoque recomendado mediante messageChild, vea Pasar información al cuadro de diálogo.

Elección de un enfoque

Consideración Almacenamiento local Parámetros de consulta
Tamaño de los datos Adecuado para cargas útiles más grandes. Mejor para valores pequeños.
Disponibilidad de datos Disponible en cualquier momento después de que se abra el cuadro de diálogo. Disponible en la dirección URL cuando se carga el cuadro de diálogo.

Sugerencia: Guarde los valores en variables para leerlos mientras el cuadro de diálogo permanece abierto.
Persistencia en la navegación Persiste hasta que se borra explícitamente. Se pierde si el cuadro de diálogo se redirige.

Usar almacenamiento local

Llame al setItem método del window.localStorage objeto en la página host antes de la displayDialogAsync llamada, como se muestra en el ejemplo siguiente.

localStorage.setItem("clientID", "15963ac5-314f-4d9b-b5a1-ccb2f1aea248");

El código del cuadro de diálogo lee el elemento cuando es necesario, como se muestra en el ejemplo siguiente.

const clientID = localStorage.getItem("clientID");
// You can also use property syntax:
// const clientID = localStorage.clientID;

Nota:

Los cambios en la seguridad del explorador afectarán a la estrategia de control de tokens.

Usar parámetros de consulta

Anexe pares clave-valor a la dirección URL que pasa a displayDialogAsync. Este enfoque funciona mejor para los valores pequeños que el cuadro de diálogo necesita solo cuando se abre por primera vez.

Office.context.ui.displayDialogAsync('https://myAddinDomain/myDialog.html?clientID=15963ac5-314f-4d9b-b5a1-ccb2f1aea248');

Para ver un ejemplo que utiliza esta técnica, vea Insertar gráficos de Excel con Microsoft Graph en un complemento de PowerPoint.

El código en el cuadro de diálogo puede analizar la URL y leer el valor del parámetro.

Importante

Office agrega automáticamente un parámetro de consulta llamado _host_info a la dirección URL que se pasa a displayDialogAsync. Anexa este parámetro después de los parámetros de consulta personalizados, si los hay. No se anexa _host_info a las direcciones URL posteriores a las que navega el cuadro de diálogo. Microsoft podría cambiar el contenido de este valor o quitarlo por completo en el futuro, por lo que el código no debería leerlo. Office agrega el mismo valor al almacenamiento de sesión del cuadro de diálogo (la propiedad Window.sessionStorage ). De nuevo, el código no debe leer ni escribir en este valor.

Solución de problemas comunes

  • Si el almacenamiento local aparece vacío en el cuadro de diálogo, compruebe que la página de host y el cuadro de diálogo usan exactamente el mismo origen.
  • Si falta un valor de parámetro de consulta, confirme que está presente en la dirección URL inicial pasada a displayDialogAsync.
  • Si se necesitan datos después de redirecciones en el flujo de diálogo, use el estado de servidor o almacenamiento local en lugar de basarse solo en parámetros de consulta.

Vea también

  • Last updated on