在 iframe Angular-oauth2-oidc 中使用会话存储时，会给出 DOMException 的错误：无法读取'sessionStorage'

Question

我使用的是angular-oauth2-oidc我的应用程序在iFrame中使用，所以当第三方cookie被阻止时，它会给出以下错误:

core.js:6241 ERROR DOMException: Failed to read the 'sessionStorage' property from 'Window': Access is denied for this document.
at Object.createDefaultStorage [as useFactory] (http://localhost:4200/vendor.js:81943:5)
at Object.factory (http://localhost:4200/vendor.js:30286:28)
at R3Injector.hydrate (http://localhost:4200/vendor.js:30153:63)
at R3Injector.get (http://localhost:4200/vendor.js:29903:33)
at injectInjectorOnly (http://localhost:4200/vendor.js:15722:33)
at Module.ɵɵinject (http://localhost:4200/vendor.js:15732:57)
at **Object.OAuthService_Factory [as factory]**

当我从代码中删除会话存储时，我得到了相同的错误消息。我的问题是angular-oauth-oidc包以某种方式使用会话存储?除了允许第三方cookie之外，我如何才能克服这种情况?因为我不能依赖使用该解决方案的人来允许第三方cookie。

Answer 1

是的，浏览器中的限制会做到这一点。如果sessionStorage对您的应用程序不可用，库将无法在默认存储机制中保存任何令牌。

您需要创建一个自定义OAuthStorage，并创建一个内存中实现或其他一些与父框架协调的实现，以确保库中的数据被持久化。

自定义存储可以像这样:

export class CustomOAuthStorage {
private _data: object = { };
getItem(key: string) { return this._data[key]; }
setItem(key: string, value: string) { this._data[key] = value; }
removeItem(key: string) { delete this._data[key]; }
}

然后通过Angular的DI系统provide。