Getting "warning office.js is loaded outside of office client" in dialog popup on IE and Edge

Question

We are building an Outlook addin in which we are trying to do an authentication flow with the following steps:

1. Calls Office.context.ui.displayDialogAsync() to open a dialog with the URL of an OAuth sign in page (The domain of this page is also added to the "AppDomains" tag of our manifest, in addition to that of our addin).
2. The user signs in and triggers the authentication.
3. Once 2. is done, the OAuth flow redirects back to a page under the same domain of the addin.
4. The OAuth redirect page in 3 calls Office.context.ui.messageParent() and posts the OAuth token back to the addin. And following is the HTML content of the redirect page.

<script type="text/javascript" src="<URL to the server we host Office JS>/office.js"></script>
<script type="text/javascript">
    Office.initialize = function () {
      Office.context.ui.messageParent(window.location.hash);
    };
</script>

This has been working well on Outlook 2016 and Chrome. However, it does not work on IE11/Edge sometimes and breaks in step 4. The redirect page cannot perform Office.context.ui.messageParent(). We see when this happens, there is a "warning office.js is loaded outside of office client" in the developer tool and Office.context.ui appears to be null.

We also found out, turning off IE -> Internet options -> Security -> "Enable Protected Mode" solves this problem. For Edge, according to this page, there is no way to turn that mode off. (We do see it works in some instances of IE/Edge even with this mode to be on).

According to this doc, looks like the issue is the "protected mode" does not allow office.js loads in the redirect page which is outside the office client. But, the redirect page is under the same domain of our addin.

We want to get some insight on this and how to solve this issue. Thanks!

Sybarite

What is the domain of the page you're are trying to call using displayDialog and the domain of your add-in? Can you make sure both domains have the same IE security zone – Henryk

Can you also make sure Office.Initialize on the dialog is being called in the redirect page and that Office.context is not null? Also, we see that you are self-hosting the office.js, Is there a specific reason for doing so? We recommend using the one from "appsforoffice.microsoft.com/lib/1/hosted/office.js" – Henryk

Yes, we see this problem comes from IE security zone. Our addin is hosted under "ssl.gstatic.com" and IE sees it as "Internet | Protected Mode: Enhanced". And we are trying to open Google OAuth sigin page with displayDialog. IE see its URL (accounts.google.com/o/oauth2/v2/auth) as "Unknow Zone (Mixed) | Protected Mode: Off". So we tried to switch to using OfficeHelpers.Authenticator to do Google signin (github.com/OfficeDev/office-js-helpers#authentication) and got the same problem. – Sybarite

Is there anyway we can work with IE team to add this URL "accounts.google.com/o/oauth2/v2/auth" to the "Internet" security zone where "ssl.gstatic.com" lives so that we do not have to instruct our users to do this themselves? – Sybarite

I think we get a hold on this. Thanks for all the previous help! – Sybarite