CODEWITHSUNDEEP
angularauthenticationconfigurationamazon-cognitoaws-amplify
Georgeroni
Georgeroni

Reputation: 3

Angular 16 & Amplify Auth (Cognito) - Incorrectly Configured Error

Having an issue with Amplify, when configuring Amplify and Auth and passing in the parameters mentioned on this page: https://docs.amplify.aws/lib/auth/getting-started/q/platform/js/#install-amplify-libraries

Everything is correctly configured, I can sign up, confirm code and sign in fine however when it comes to calling Auth.currentAuthenticatedUser() then it fires out an error saying that Amplify hasn't been configured correctly.

Here's my config:

{
    region: 'eu-west-1',
    userPoolWebClientId: 'XXXXXXXXXXXXXXXXXXX',
    userPoolId: 'eu-west-1_XXXXXX',
    oauth: {
      domain: 'https://XXXXXX.auth.eu-west-1.amazoncognito.com',
      scope: ['openid', 'email', 'profile'],
      redirectSignIn: 'http://localhost:4200/',
      redirectSignOut: 'http://localhost:4200/login',
      responseType: 'code',
}

I'm passing this through to the configure functions:

Amplify.configure({
  Auth: env.cognito // The config above,
});

Auth.configure({
  Auth: env.cognito // The config above,
});

As mentioned, can sign up, confirm code, log in and receive the access token and my backend server is receiving the access token just fine. Just when I want to get the current authenticated user through Auth then it doesn't want to play ball.

Here's my package.json:

{
  "name": "@[redacted]/source",
  "version": "0.0.0",
  "license": "MIT",
  "scripts": {},
  "private": true,
  "dependencies": {
    "@angular/animations": "~16.2.0",
    "@angular/common": "~16.2.0",
    "@angular/compiler": "~16.2.0",
    "@angular/core": "~16.2.0",
    "@angular/forms": "~16.2.0",
    "@angular/platform-browser": "~16.2.0",
    "@angular/platform-browser-dynamic": "~16.2.0",
    "@angular/router": "~16.2.0",
    "@datorama/akita": "^8.0.1",
    "@nx/angular": "16.7.1",
    "aws-amplify": "^5.3.8",
    "rxjs": "~7.8.0",
    "tslib": "^2.3.0",
    "zone.js": "~0.13.0"
  },
  "devDependencies": {
    "@angular-devkit/build-angular": "~16.2.0",
    "@angular-devkit/core": "~16.2.0",
    "@angular-devkit/schematics": "~16.2.0",
    "@angular-eslint/eslint-plugin": "~16.0.0",
    "@angular-eslint/eslint-plugin-template": "~16.0.0",
    "@angular-eslint/template-parser": "~16.0.0",
    "@angular/cli": "~16.2.0",
    "@angular/compiler-cli": "~16.2.0",
    "@angular/language-service": "~16.2.0",
    "@nx/cypress": "16.7.1",
    "@nx/eslint-plugin": "16.7.1",
    "@nx/jest": "16.7.1",
    "@nx/js": "16.7.1",
    "@nx/linter": "16.7.1",
    "@nx/web": "16.7.1",
    "@nx/workspace": "16.7.1",
    "@schematics/angular": "~16.2.0",
    "@types/jest": "^29.4.0",
    "@types/node": "16.11.7",
    "@typescript-eslint/eslint-plugin": "^5.60.1",
    "@typescript-eslint/parser": "^5.60.1",
    "autoprefixer": "^10.4.0",
    "cypress": "^12.16.0",
    "eslint": "~8.46.0",
    "eslint-config-prettier": "8.1.0",
    "eslint-plugin-cypress": "^2.13.4",
    "jest": "^29.4.1",
    "jest-environment-jsdom": "^29.4.1",
    "jest-preset-angular": "~13.1.0",
    "nx": "16.7.1",
    "nx-cloud": "latest",
    "postcss": "^8.4.5",
    "prettier": "^2.6.2",
    "tailwindcss": "^3.3.3",
    "ts-jest": "^29.1.0",
    "ts-node": "10.9.1",
    "typescript": "~5.1.3"
  }
}

Let me know what could be going wrong here, as I have configured this before but with Angular 14 and it worked fine, just work requirements mean that I have to use Angular 16.

Thanks.

Upvotes: 0

Views: 453

Answers (1)

Oriol Lopez
Oriol Lopez

Reputation: 369

Create a service and add the configuration into the constructor. So that every time you call the service, your AWS config will be built.

Upvotes: 0

Related Questions