在Angular 6中为托管UI配置Amplify时，返回错误请求

Question

仔细阅读Amplify的文档，以在Angular 6中配置AWS Cognito托管的UI。 登录后收到400错误的请求。

以下是信息：

1. 在 main.ts 中配置了AWS Amplify。

ActionsTableView.TableFooterView = new UIView() { Frame = new CGRect(0, 0, ActionsTableView.Frame.Size.Width, 1) };

1. 在 app-component.ts 中：

Amplify.configure({
  Auth: {
    region: 'us-east-1',
    userPoolId: 'us-east-1_XXXX',
    userPoolWebClientId: 'CLIENT_ID',
    oauth: {
      domain: 'IDP.auth.us-east-1.amazoncognito.com',
      scope: ['openid'],
      redirectSignIn:  'http://localhost:4200/',
      redirectSignOut: 'http://localhost:4200/',
      responseType: 'code', 
      options: {
        AdvancedSecurityDataCollectionFlag: true
      }
    }
  }
});

1. Chrome控制台日志。

1. 网络标签。

Answer 1

最后找到了解决方案。

1. 我们需要创建用户池而不生成client_secret。

1. 更新后的package.json

    "aws-amplify": "1.1.28",
    "@aws-amplify/ui": "1.0.19",

1. 禁用分析：

Amplify.configure({
  Auth: {
    region: 'us-east-1',
    userPoolId: 'us-east-1_XXXX',
    userPoolWebClientId: 'client_id',
    oauth: {
      domain: 'idp.auth.us-east-1.amazoncognito.com',
      scope: ['openid'],
      redirectSignIn:  'http://localhost:4200/',
      redirectSignOut: 'http://localhost:4200/',
      responseType: 'code',
      options: {
        AdvancedSecurityDataCollectionFlag: true
      }
    }
  },
  Analytics:{
    disabled:true
  }
});

输出：