Angular项目启动报错AuthUserPoolException求助

核心原因 #

启动时的错误是因为Angular应用先完成了初始化启动，Amplify的配置却在这之后才执行。当AppComponent或其他依赖Amplify Auth的组件在bootstrap阶段初始化时，Amplify还未完成配置，因此抛出该错误；而后续配置完成后，功能就能正常运行。

解决方案 #

将Amplify.configure的代码移到bootstrapApplication之前执行，确保应用启动前Amplify已经完成配置：

import { bootstrapApplication } from '@angular/platform-browser';
import { appConfig } from './app/app.config';
import { AppComponent } from './app/app.component';
import cdkOutput from '../../../ForumWebCDK/output.json';
import { Amplify } from 'aws-amplify';

// 先完成Amplify配置
Amplify.configure({
  Auth: {
    Cognito: {
      userPoolId: cdkOutput.CognitoStack.PoolId,
      userPoolClientId: cdkOutput.CognitoStack.ClientId,
      signUpVerificationMethod: 'code',
    }
  }
}); 

// 再启动Angular应用
bootstrapApplication(AppComponent, appConfig)
  .catch((err) => console.error("ERROR:" , err));

const currentConfig = Amplify.getConfig();

额外检查点 #

• 确认cdkOutput的文件路径是否正确，可在配置前打印cdkOutput.CognitoStack，验证PoolId和ClientId是否能正常读取
• 用户池添加用户名字段不会导致该配置错误，无需为此调整Auth配置逻辑

内容的提问来源于stack exchange，提问作者zachpfaltzgraff