Adding a new endpoint fails in Excel Add-In in Chrome

[rluta]

I'm trying to use the Office Helpers to authenticate against a private OAuth2 endpoint with implicit flow in a React based Add-In for Excel.

When I run the following code in the add-in within the Office.initialize callback and my add-in is side loaded in Excel 365 :

const authenticator = new Authenticator();
authenticator.endpoints.add('MyID', {
    ...config options...
});

I always get the following error from chrome in the debug console:

Uncaught DOMException: Failed to read the 'localStorage' property from 'Window': Access is denied for this document.
    at EndpointStorage.Storage.switchStorage (eval at ../node_modules/@microsoft/office-js-helpers/dist/helpers/storage.js (https://localhost:3100/app.d84d4783b7237d4a074c.js:871:1), <anonymous>:121:61)
    at EndpointStorage.Storage [as constructor] (eval at ../node_modules/@microsoft/office-js-helpers/dist/helpers/storage.js (https://localhost:3100/app.d84d4783b7237d4a074c.js:871:1), <anonymous>:104:15)
    at new EndpointStorage (eval at ../node_modules/@microsoft/office-js-helpers/dist/authentication/endpoint.manager.js (https://localhost:3100/app.d84d4783b7237d4a074c.js:815:1), <anonymous>:38:23)
    at new Authenticator (eval at ../node_modules/@microsoft/office-js-helpers/dist/authentication/authenticator.js (https://localhost:3100/app.d84d4783b7237d4a074c.js:807:1), <anonymous>:87:30)
    at Object.eval (eval at ./main.tsx (https://localhost:3100/app.d84d4783b7237d4a074c.js:6972:1), <anonymous>:18:21)
    at Object.eval (eval at ./main.tsx (https://localhost:3100/app.d84d4783b7237d4a074c.js:6972:1), <anonymous>:50:27)
    at eval (eval at ./main.tsx (https://localhost:3100/app.d84d4783b7237d4a074c.js:6972:1), <anonymous>:51:30)
    at Object../main.tsx (https://localhost:3100/app.d84d4783b7237d4a074c.js:6972:1)
    at __webpack_require__ (https://localhost:3100/app.d84d4783b7237d4a074c.js:693:30)
    at fn (https://localhost:3100/app.d84d4783b7237d4a074c.js:112:20)

Is there a way to prevent the EndpointManager from using the localStorage ?

I tried both version 0.7.4 and 0.8.0-beta.4 without success.

[WrathOfZombies]

Unfortunately the entire token logic is based off of localStorage. At best we can switch out to sessionStorage but that's about it. That said, localStoage I think its very integral to Office.js as well. Is there a reason why it is disabled?

[WrathOfZombies]

@rluta ping..

[rluta]

localStorage is disabled by Chrome whenever someone disables third-party cookies in the preferences which is a fairly common non-default setting.

[TimJohns]

We're running into this same issue, along with some related behavior we don't like with the default configuration on other browsers, in addition to specific Chrome issue @rluta raised. Wondering if there is a workaround or we're missing something (i.e. for deployed add-ins, does Microsoft proxy the implementation so it's served from a Microsoft domain, etc.)?

[WrathOfZombies]

I am looking into an approach where you can use in-memory cache to store the values instead of relying on localStorage. Will keep this thread updated.

[WrathOfZombies]

@TimJohns, @rluta. Finally added an inmemory storage option. To use it you'll need to do the following:

const authenticator = new OfficeHelpers.Authenticator();
const authenticator.endpoints = new OfficeHelpers.Endpoints(StorageType.InMemoryStorage);
const authenticator.tokens = new OfficeHelpers.Tokens(StorageType.InMemoryStorage);

That should throw 2 warnings in your console signifying that we are using in-memory storage. Let me know if you have issues.