Office Dialog API messageParent does not work in Edge for Word

Question

If I don't copy the _host_Info I am getting “warning office.js is loaded outside of office client” in dialog popup on IE and Edge.

I am using middleman service authentication flow. It is working fine on Firefox,Chrome and Word Desktop client, even without the _host_Info.

When I am copying the _host_Info the dialog close automatically on the last redirect back to the addin.

Steps:

Trigger Office.context.ui.displayDialogAsync, addin location with query redirectb64 which contain url to mvc external login with redirect uri back to addin.
Addin open again check if redirectb64 exist and decode it back to a url
from window location we will copy the hostinfo to the redirct url
redirected to mvc application which challenge the login provider and then back to the mvc application for sign-in and after redirect back to the addin with access token and the other query parameters.

From the dialog event handler I get the Dialog closed error.

Code:

/* Render application after Office initializes */
Office.initialize = async () => {

    let redirectUrl:string = window.atob(UrlHelper.getUrlParameter("redirectb64"));
    if(redirectUrl !== "") {
        console.log("DialogUrl",window.location);
        console.log("Redirectb64 (atob)",redirectUrl);

        //Must copy over this to the redirectUri;
        let hostInfo:string = encodeURIComponent("&_host_Info=" + UrlHelper.getUrlParameter("_host_Info"));
        redirectUrl = StringHelper.insert(redirectUrl.indexOf("&state="),redirectUrl,hostInfo);
        console.log("Redirectb64 (atob) with hostInfo",redirectUrl);
        window.location.href = redirectUrl;
        return;
    }

    var response:AxiosResponse = await axios.get("assets/appconfig.json");
    console.log("config loaded.", response.data);
    AuthHelper.SetAccessToken();

    //console.log("AuthHelper.SetAccessToken", typeof AuthHelper.SetAccessToken);

    const myLanguage: string = Office.context.displayLanguage;
    render(App,myLanguage, true, response.data);
};

It seems like dialog api lost track of the dialog after login.microsoft.com callback to the mvc application. Why?

Yu Zhou Yu Zhou · Accepted Answer · 2019-10-15T08:50:29

For the "office.js is loaded outside" warning, you could refer to this thread. Office.js will only work inside an Office application, such as in a task pane. To run an add-in that you are developing, you need to sideload it into an Office application.

Besides, you should be careful when using middleman service APIs. Often the service has a single API method that makes the initial call and creates the context object. An object like this cannot be completely stringified, so it cannot be passed from the Office dialog to the parent page. For more information, you could refer to the part: Middleman services of the article.

It is recommended to use the Office Dialog APIs to open a login page. For the use of the Dialog APIs in an authentication flow, you could refer to this article.

Office Dialog API messageParent does not work in Edge for Word

1 Answers