Auth0 с Angular и Oidc-клиентом
Я создал новое приложение Angular, и я работаю над входом в систему с помощью Auth0, но я столкнулся с проблемой с oidc-client, получив эту ошибку:
main.ts:12 TypeError: clientSettings.userStore is not a function
at new OidcService (ng-oidc-client.js:599)
В моем auth.module у меня такая конфигурация:
NgOidcClientModule.forRoot({
// prettier-ignore
oidc_config: {
authority: environment.sts.authority,
client_id: environment.sts.clientId,
redirect_uri: `${environment.appRoot}oidc-login-redirect-callback.html`,
scope: 'openid profile',
response_type: 'id_token token',
post_logout_redirect_uri: `${environment.appRoot}/oidc-logout-redirect-callback.html`,
silent_redirect_uri: `${environment.appRoot}/oidc-silent-renew-redirect-callback.html`,
accessTokenExpiringNotificationTime: 10,
automaticSilentRenew: true,
metadata: {
authorization_endpoint: `${environment.sts.authority}authorize audience=${environment.sts.audience}`,
userinfo_endpoint: `${environment.sts.authority}userinfo`,
issuer: environment.sts.authority,
jwks_uri: `${environment.sts.authority}.well-known/jwks.json`,
// tslint:disable-next-line: max-line-length
end_session_endpoint: `${environment.sts.authority}v2/logout?returnTo=${environment.appRootEncoded + 'oidc-logout-redirect-callback.html'}&client_id=${environment.sts.clientId}`
},
userStore: new WebStorageStateStore({ store: window.localStorage })
}
})
и вот мой файл окружения:
export const environment = {
production: false,
appRoot: 'http://localhost:4200',
appRootEncoded: 'http://localhost:4200',
apiUrl: 'http://localhost:4201',
sts: {
authority: 'https://dev-serj.eu.auth0.com/',
clientId: 'R7fxgHNkPEj2VX1H7q4Fp0j2XnSqaudJ',
audience: 'dev-serj-api'
}
};
Я более чем уверен, что есть проблема с userStore, но я не могу найти решение, чтобы ее исправить.
Моя версия oidc:
"ng-oidc-client": "^1.0.7",
"oidc-client": "^1.10.1",
2 ответа
Это похоже на конфликт версий между ng-oidc-client
а также oidc-client
.
ng-oidc-client
ожидает, что вы предоставите функцию, которая возвращает WebStorageStateStore
. Однако формаConfig
приходит прямо из oidc-client
, где это должно быть WebStorageStateStore
а не функция.
До недавнего времени, userStore
поле было объявлено как any
в oidc-client
, что позволило этот трюк. В 1.10 oidc-client был реструктурирован, и новая типизацияuserStore: WebStorageStateStore
.
Быстрое решение - предоставить функцию - как и ожидает ng-oidc-client. И добавьте утверждение типа для подавления ошибок компиляции.
userStore: (() => new WebStorageStateStore({ store: window.localStorage })) as any
И, возможно, отправьте отчет об ошибке для ng-oidc-client
.:)
Конфигурация по умолчанию:
userStore: new WebStorageStateStore({
store: sessionStorage
}),
Итак, вы можете сделать это:
userStore: new WebStorageStateStore({
store: window.localStorage
}),