Passar dados para uma caixa de diálogo usando o armazenamento local ou parâmetros de consulta

Se o suplemento for executado em uma plataforma ou host que não dê suporte ao conjunto de requisitos DialogApi 1.2, você não poderá usar o messageChild método para enviar dados de uma página de host para uma caixa de diálogo. Em vez disso, use uma das seguintes abordagens.

  • Armazenamento local - Grave dados window.localStorage na página host antes de abrir a caixa de diálogo. Ambas as janelas poderão acessar o mesmo armazenamento local se compartilharem o mesmo domínio, incluindo o número da porta.
  • Parâmetros de consulta - Acrescente pares de chave-valor ao URL que você passa para .displayDialogAsync A caixa de diálogo lê os valores quando é aberta.

Para obter a abordagem recomendada usando messageChild, consulte Passar informações para a caixa de diálogo.

Escolher uma abordagem

Considerações Armazenamento local Parâmetros de consulta
Tamanho dos dados Adequado para cargas úteis maiores. Ideal para valores pequenos.
Disponibilidade de dados Disponível a qualquer momento após a abertura da caixa de diálogo. Disponível na URL quando a caixa de diálogo é carregada.

Dica: Salve os valores nas variáveis para lê-los enquanto a caixa de diálogo permanece aberta.
Persistência na navegação Persiste até que seja explicitamente desmarcado. Perdida se a caixa de diálogo for redirecionada.

Usar o armazenamento local

Chame o setItem método do window.localStorage objeto na página host antes da displayDialogAsync chamada, conforme mostrado no exemplo a seguir.

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

O código na caixa de diálogo lê o item quando necessário, conforme mostrado no exemplo a seguir.

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

Observação

As alterações na segurança do navegador afetarão sua estratégia de manipulação de tokens.

Usar os parâmetros de consulta

Acrescente pares de chave-valor à URL que você passa para .displayDialogAsync Essa abordagem funciona melhor para valores pequenos que a caixa de diálogo só precisa quando é aberta pela primeira vez.

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

Para ver um exemplo que usa essa técnica, consulte Inserir gráficos do Excel usando o Microsoft Graph em um Suplemento do PowerPoint.

O código na caixa de diálogo pode analisar a URL e ler o valor do parâmetro.

Importante

O Office adiciona automaticamente um parâmetro de consulta chamado _host_info para a URL passada para displayDialogAsync. Ele acrescenta esse parâmetro após os parâmetros de consulta personalizados, se houver. Ele não é anexado _host_info a nenhuma URL subsequente para a qual a caixa de diálogo navega. A Microsoft pode alterar o conteúdo desse valor ou removê-lo totalmente no futuro, para que seu código não o leia. O Office adiciona o mesmo valor ao armazenamento de sessões da caixa de diálogo (a propriedade Window.sessionStorage ). Novamente, seu código não deve ler nem gravar nesse valor.

Solução de problemas comuns

  • Se o armazenamento local aparecer vazio na caixa de diálogo, verifique se a página do host e a caixa de diálogo usam exatamente a mesma origem.
  • Se um valor de parâmetro de consulta estiver ausente, confirme se ele está presente na URL inicial passada para displayDialogAsync.
  • Se os dados forem necessários após os redirecionamentos no fluxo de diálogo, use o armazenamento local ou o estado do servidor em vez de depender apenas dos parâmetros de consulta.

Confira também