angular - 用户认证后 Okta 登录页面进入无限循环
问题描述
像这样
我的 Angular 应用集成了 Okta 访问和用户管理 API。应用程序后端托管在 AWS Beanstaik 中,前端 Angular 应用程序托管在 S3 中。
我通过 chrome 开发工具检查了网络响应,我得到了这个
{"expiresAt":"2021-09-03T02:59:39.000Z","status":"SUCCESS","sessionToken":"20111F_ApSDB7zPMeay5y2V4nG8yUlU0i4ICgHyAOMYvc5Miq743wse","_embedded":{"user":{"id":"00ubopju1CRuT02ji5d6","passwordChanged":"2021-03-13T22:58:33.000Z","profile":{"login":"Rafi12534@Gmail.com","firstName":"Mohammed","lastName":"Samsuddin","locale":"en","timeZone":"America/Los_Angeles"}}},"_links":{"cancel":{"href":"https://dev-97379822.okta.com/api/v1/authn/cancel","hints":{"allow":["POST"]}}}}
登录组件代码:
import { Component, OnInit } from '@angular/core';
import { OktaAuthService } from '@okta/okta-angular';
import * as OktaSignIn from '@okta/okta-signin-widget';
import myAppConfig from '../../config/my-app-config';
@Component({
selector: 'app-login',
templateUrl: './login.component.html',
styleUrls: ['./login.component.css']
})
export class LoginComponent implements OnInit {
oktaSignin: any;
constructor(private oktaAuthService: OktaAuthService) {
this.oktaSignin = new OktaSignIn({
logo: 'assets/images/logo_for_favicon.png',
features: {
registration: true
},
baseUrl: myAppConfig.oidc.issuer.split('/oauth2')[0], // return everything in url before '/oauth2'
clientId: myAppConfig.oidc.clientId,
redirectUri: myAppConfig.oidc.redirectUri,
authParams: {
pkce: true, // Proof Key for Code Exchange.
// Proof Key for Code Exchange (PKCE, pronounced pixie)
// extension describes a technique for public clients to mitigate
// the threat of having the authorization code intercepted.
issuer: myAppConfig.oidc.issuer,
scopes: myAppConfig.oidc.scopes
}
});
}
ngOnInit(): void {
this.oktaSignin.remove(); // remove previous element that rendered there
this.oktaSignin.renderEl({
el: '#okta-sign-in-widget'}, // render element with given id
// this name should be same as div tag id in login.component.html
(response) => {
if (response.status === "SUCCESS") {
this.oktaAuthService.signInWithRedirect();
}
},
(error) => {
throw error;
}
);
}
}
身份验证后,okta 尝试再次进行身份验证,这可能会将其置于无限循环中。
解决方案
推荐阅读
- python - ^ 不表示 python 中的行首
- reactjs - react-native-gifted-chat 多次显示相同的消息
- c++ - 如何将 const char* str 解压到模板中
? - c++11 - C++:如何在不定义参数化构造函数的情况下正确初始化基类成员变量?
- java - 带有类型参数的方法和泛型方法类型参数声明之间的理论区别是什么
- javascript - 如何根据网站中的反应路由删除不需要的 CSS?
- applescript - 使用 AppleScript 移动整个文件夹
- python - 如何将 2D 列表 python 转换为一个列表并连接它们
- ios - Fabric 回答 SDK 在 [Fabric with:@[ [Answers class] ]] 上崩溃;
- java - 边界半径 css 不适用于飞碟