Vue.js 和 aws 的放大

Question

我正在尝试使用 amplify 连接我的 vue.js 和 cognito，但我不断收到错误：

这是我的 aws-exports.js：

const awsconfig = {
  Auth: {
    region: 'us-east-1',
    userPoolId: 'us-east-1_mld8IjN9e',
    userPoolWebClientId: '229bq6q1fbjtp0r43hhoq5qoe7',
    authenticationFlowType: 'USER_PASSWORD_AUTH'
  }
};
export default awsconfig;

这是我的 main.js:

import { createApp } from 'vue'
import App from './App.vue'
import 'bootstrap/dist/css/bootstrap.min.css';
import {Amplify} from 'aws-amplify';
import awsconfig from './aws-exports';

console.log('AWS Config:', awsconfig);

Amplify.configure(awsconfig);
createApp(App).mount('#app')
console.log(Amplify);

这是我不断收到的错误：

ERROR
Cannot read properties of undefined (reading 'loginWith')
TypeError: Cannot read properties of undefined (reading 'loginWith')
    at AmplifyClass.notifyOAuthListener (webpack-internal:///./node_modules/@aws-amplify/core/dist/esm/singleton/Amplify.mjs:89:44)
    at AmplifyClass.configure (webpack-internal:///./node_modules/@aws-amplify/core/dist/esm/singleton/Amplify.mjs:68:10)
    at Object.configure (webpack-internal:///./node_modules/aws-amplify/dist/esm/initSingleton.mjs:52:62)
    at eval (webpack-internal:///./src/main.js:14:57)
    at ./src/main.js (http://localhost:8080/js/app.js:74:1)
    at __webpack_require__ (http://localhost:8080/js/app.js:435:32)
    at http://localhost:8080/js/app.js:1547:109
    at __webpack_require__.O (http://localhost:8080/js/app.js:477:23)
    at http://localhost:8080/js/app.js:1548:53
    at http://localhost:8080/js/app.js:1550:12

谁知道这个问题的解决办法

Answer 1

您的

awsconfig

中的

aws-exports.js

显示您正在使用

authenticationFlowType: 'USER_PASSWORD_AUTH'

。这不应触发您当前面临的读取

loginWith

错误，因为它仅存在于使用

federatedSignIn

的

oAuth

中。您可以按照以下步骤创建新的

User Pool

。请注意我如何检查

email

和

password

。

滚动至底部导航至应用程序客户端设置。

通过将

ALLOW_USER_PASSWORD_AUTH

添加到身份验证流程来编辑应用程序客户端设置

保存更改

如果您不想创建新的用户池，请按照以下步骤从之前的 AWS Cognito 控制台禁用 oAuth。

• 选择您的用户池
• 转到应用程序客户端设置
• 取消选中所有 OAuth 2.0 授权类型
• 删除所有允许的 OAuth 范围
• 清除所有回调 URL 和注销 URL
• 保存更改

还在您的应用程序客户端设置中，确保执行以下操作：

• 仅启用

  USER_PASSWORD_AUTH

   下的 

  Enabled Identity Providers
• 禁用任何社交身份提供商
• 保存更改

此外，请将您的

aws-config

更新为：

Amplify.configure({
  Auth: {
         region: 'us-east-1',
         userPoolId: 'us-east-1_mld8IjN9e',
         userPoolWebClientId: '229bq6q1fbjtp0r43hhoq5qoe7',
         authenticationFlowType: 'USER_PASSWORD_AUTH',
         oauth: {
                  domain: 'none',
                  scope: [],
                  redirectSignIn: 'none',
                  redirectSignOut: 'none',
                  responseType: 'none',
                },
          federationDisabled: true
  }
});

我相信这可以解决您的问题