使用 angular-oauth2-oidc 的 OAuth2 和 SSO 不会检索访问令牌

Question

这是我的问题

我正在尝试使用 angular-oauth2-oidc 实现 SSO 和 OAuth2 流程。我可以使用 POSTMAN 和 ThunderClient（VS 代码）获得正确的响应（access_token），但不能使用 Angular

这是我的配置：

 authCodeFlowConfig: AuthConfig = {
    issuer: 'https://URL.com/',
    loginUrl: 'https://URL.com/authorize-client',
    clientId: environment.API.CLIENT_ID,
    responseType: 'code',
    scope: environment.API.SCOPE,
    tokenEndpoint: 'https://URL.com/request-access',
    dummyClientSecret: environment.API.CLIENT_SECRET,
    redirectUri: window.location.origin,
    showDebugInformation: true,
  }

...

  constructor(
    private httpClient: HttpClient,
    private oauthService: OAuthService
  ) {
    this.getAuthorizeClientCode()
  }

...


getAuthorizeClientCode() {
    this.oauthService.configure(this.authCodeFlowConfig);
    this.oauthService.tokenValidationHandler = new JwksValidationHandler()
    this.oauthService.tryLogin({
      onTokenReceived: context => {
        console.log(context)
      }
    })
      .then(() => {
        if (this.oauthService.hasValidAccessToken()) {
          this.oauthService.silentRefresh()
        } else {
          this.oauthService.initCodeFlow();
        }
      })
      .catch(err => console.log(err))
  }

发生了什么： 流程一直运行到一个点。我登录并获取代码并调用端点 'request_access'，但就是这样，令牌端点向我抛出错误：

当我检查网络选项卡时，信息就在那里：

我到处搜索，我真的不知道我错过了什么，因为流程在 POSTMAN 中有效，但它不会在 Angular。

Answer 1

您需要在后端启用 cors，您可以在 chrome 上安装这些工具以禁用它以进行测试

https://chrome.google.com/webstore/detail/moesif-origin-cors-change/digfbfaphojjndkpccljibejjbppifbchttps://

使用 angular-oauth2-oidc 的 OAuth2 和 SSO 不会检索访问令牌

OAuth2 and SSO with angular-oauth2-oidc won't retrieve access token

javascript

angular

oauth-2.0

single-sign-on

access-token