可能是由于CORS策略引起的。在Web服务器上添加CORS策略以允许来自OKTA的请求,并确保在将Angular代码部署到Web服务器之前,将OKTA配置正确注入到应用程序中。
示例代码:
const express = require('express'); const cors = require('cors'); const app = express(); app.use(cors());
import { OktaAuthService } from '@okta/okta-angular';
export class AppComponent { isAuthenticated: boolean;
constructor(public oktaAuth: OktaAuthService) { this.oktaAuth.isAuthenticated().subscribe(isAuthenticated => { this.isAuthenticated = isAuthenticated; }); } }
注意:确保将OKTA配置添加到app.module.ts文件中:
import { BrowserModule } from '@angular/platform-browser'; import { NgModule } from '@angular/core'; import { HttpClientModule } from '@angular/common/http'; import { AppComponent } from './app.component'; import { OktaAuthModule } from '@okta/okta-angular';
@NgModule({ declarations: [ AppComponent ], imports: [ BrowserModule, HttpClientModule, OktaAuthModule.initAuth({ issuer: 'https://{yourOktaDomain}.com/oauth2/default', clientId: '{clientId}', redirectUri: 'http://localhost:4200/implicit/callback', pkce: true }) ], providers: [], bootstrap: [AppComponent] }) export class AppModule { }
这些步骤应该解决问题并确保Angular与OKTA集成在将Angular代码部署到Web服务器时能够正常工作。
下一篇:Angular与PHP后端