search

aws-amplify / amplify-js

A declarative JavaScript library for application development using cloud services.
https://docs.amplify.aws/lib/q/platform/js
Apache License 2.0
9.44k stars 2.13k forks source link

OAuth - Error handling auth response. Error: invalid_grant #9270

Closed SaileshKumar closed 2 years ago

SaileshKumar commented 2 years ago

Before opening, please confirm:

JavaScript Framework

React

Amplify APIs

Authentication

Amplify Categories

auth

Environment information

``` # Put output below this line System: OS: macOS 11.3.1 CPU: (12) x64 Intel(R) Core(TM) i7-9750H CPU @ 2.60GHz Memory: 10.59 GB / 32.00 GB Shell: 5.8 - /bin/zsh Binaries: Node: 14.18.1 - /usr/local/bin/node Yarn: 1.22.17 - /usr/local/bin/yarn npm: 6.14.15 - /usr/local/bin/npm Browsers: Chrome: 95.0.4638.69 Safari: 14.1 npmPackages: @aws-amplify/auth: ^4.3.16 => 4.3.16 (3.4.29) @aws-amplify/ui-react: ^1.0.6 => 1.0.6 @daily-co/daily-js: ^0.18.0 => 0.18.0 @date-io/date-fns: ^1.3.13 => 1.3.13 @material-ui/core: ^4.11.4 => 4.11.4 @material-ui/icons: ^4.11.2 => 4.11.2 @material-ui/pickers: ^3.3.10 => 3.3.10 @material-ui/styles: ^4.11.4 => 4.11.4 @reduxjs/toolkit: ^1.5.1 => 1.5.1 @testing-library/jest-dom: ^5.11.4 => 5.11.10 @testing-library/react: ^11.1.0 => 11.2.6 @testing-library/user-event: ^12.1.10 => 12.8.3 HelloWorld: 0.0.1 antd: ^4.16.13 => 4.16.13 aws-amplify: ^3.3.26 => 3.3.26 aws-appsync: ^4.1.2 => 4.1.4 cypress: ^8.3.1 => 8.3.1 date-fns: ^2.23.0 => 2.23.0 es6-promise: ^4.2.8 => 4.2.8 flow-bin: ^0.148.0 => 0.148.0 graphql-tag: ^2.12.5 => 2.12.6 hermes-inspector-msggen: 1.0.0 mixpanel-browser: ^2.41.0 => 2.41.0 moment: ^2.29.1 => 2.29.1 moment-timezone: ^0.5.33 => 0.5.33 react: ^17.0.2 => 17.0.2 react-dom: ^17.0.2 => 17.0.2 react-easy-crop: ^3.5.2 => 3.5.2 react-google-button: ^0.7.2 => 0.7.2 react-google-calendar-api: ^1.4.0 => 1.4.0 react-native: ^0.64.0 => 0.64.0 react-player: ^2.9.0 => 2.9.0 react-redux: ^7.2.4 => 7.2.4 react-router-dom: ^5.2.0 => 5.2.0 react-scripts: 4.0.3 => 4.0.3 react-select: ^5.2.1 => 5.2.1 react-social-icons: ^5.5.0 => 5.5.1 request: ^2.88.2 => 2.88.2 stream-chat: ^4.2.0 => 4.2.0 stream-chat-react: ^6.7.2 => 6.7.2 styled-components: ^5.3.1 => 5.3.1 styled-components/macro: undefined () styled-components/native: undefined () styled-components/primitives: undefined () url-loader: ^4.1.1 => 4.1.1 web-vitals: ^1.0.1 => 1.1.1 npmGlobalPackages: @aws-amplify/cli: 7.3.1 n: 8.0.0 npm: 6.14.15 ```

Describe the bug

Unable to use Google Login

Expected behavior

Once login finishes - user returns to app logged in with no errors

Reproduction steps

  1. Set up Amplify React App with Google Sign In
  2. Log in via Google (federatedSignIn method)

Code Snippet

// Put your code below this line.
 const user = Auth.federatedSignIn({
        provider: "Google",
      });

Log output

``` // Put your logs below this line ``` 32:24.856 OAuth - Error handling auth response. Error: invalid_grant

aws-exports.js

/* eslint-disable */
// WARNING: DO NOT EDIT. This file is automatically generated by AWS Amplify. It will be overwritten.

const awsmobile = {
    "aws_project_region": "us-east-2",
    "aws_cognito_identity_pool_id": "us-east-2:182e12cc-153f-47a2-b727-06157343fce0",
    "aws_cognito_region": "us-east-2",
    "aws_user_pools_id": "us-east-2_A4TtUyyWy",
    "aws_user_pools_web_client_id": "45ni1kh51m1i94bt9ri9g5kpht",
    "oauth": {
        "domain": "lighthall4fdd6b2e-4fdd6b2e-dev.auth.us-east-2.amazoncognito.com",
        "scope": [
            "phone",
            "email",
            "openid",
            "profile",
            "aws.cognito.signin.user.admin"
        ],
        "redirectSignIn": "http://localhost:3000/,https://www.lighthall.co/",
        "redirectSignOut": "http://localhost:3000/,https://www.lighthall.co/",
        "responseType": "code"
    },
    "federationTarget": "COGNITO_USER_AND_IDENTITY_POOLS",
    "aws_cognito_username_attributes": [
        "EMAIL"
    ],
    "aws_cognito_social_providers": [
        "GOOGLE"
    ],
    "aws_cognito_signup_attributes": [
        "EMAIL",
        "FAMILY_NAME",
        "GIVEN_NAME",
        "PICTURE"
    ],
    "aws_cognito_mfa_configuration": "OFF",
    "aws_cognito_mfa_types": [
        "SMS"
    ],
    "aws_cognito_password_protection_settings": {
        "passwordPolicyMinLength": 8,
        "passwordPolicyCharacters": []
    },
    "aws_cognito_verification_mechanisms": [
        "EMAIL"
    ],
    "aws_appsync_graphqlEndpoint": "https://65utmuikuzc2nlia7xvgeph4zy.appsync-api.us-east-2.amazonaws.com/graphql",
    "aws_appsync_region": "us-east-2",
    "aws_appsync_authenticationType": "AMAZON_COGNITO_USER_POOLS",
    "aws_appsync_apiKey": "da2-uqeawvsvxjfqzhrehsnnmbvfou",
    "aws_user_files_s3_bucket": "lighthall2c611176821246569e6c532fb58505a3123155-dev",
    "aws_user_files_s3_bucket_region": "us-east-2",
    "aws_cognito_login_mechanisms": [
        "EMAIL"
    ]
};

export default awsmobile;

Manual configuration

No response

Additional configuration

No response

Mobile Device

No response

Mobile Operating System

No response

Mobile Browser

No response

Mobile Browser Version

No response

Additional information and screenshots

Seems to have happened after I upgraded Amplify, but unsure. I was affected by this issue FWIW: https://github.com/aws-amplify/amplify-cli/issues/8266

chrisbonifacio commented 2 years ago

Hi @SaileshKumar 👋 thanks for raising this issue. Did you only update the @aws-amplify/auth package? It looks like that's in v4 but aws-amplify is still in v3. Could you upgrade all your amplify packages to make sure they're compatible?

This page might help: https://docs.amplify.aws/lib/troubleshooting/upgrading/q/platform/js/

Otherwise, I noticed that you have two redirect signin and signout URLs. Are you making sure in your application that only one of them is being used in the oauth flow requests? You'll notice that they are in a single string, separated by a comma.

here's an example of getting just one URL from the docs: https://docs.amplify.aws/lib/auth/social/q/platform/js/#configure-auth-category

import awsConfig from './aws-exports';

const isLocalhost = Boolean(
  window.location.hostname === "localhost" ||
    // [::1] is the IPv6 localhost address.
    window.location.hostname === "[::1]" ||
    // 127.0.0.1/8 is considered localhost for IPv4.
    window.location.hostname.match(
      /^127(?:\.(?:25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?)){3}$/
    )
);

// Assuming you have two redirect URIs, and the first is for localhost and second is for production
const [
  localRedirectSignIn,
  productionRedirectSignIn,
] = awsConfig.oauth.redirectSignIn.split(",");

const [
  localRedirectSignOut,
  productionRedirectSignOut,
] = awsConfig.oauth.redirectSignOut.split(",");

const updatedAwsConfig = {
  ...awsConfig,
  oauth: {
    ...awsConfig.oauth,
    redirectSignIn: isLocalhost ? localRedirectSignIn : productionRedirectSignIn,
    redirectSignOut: isLocalhost ? localRedirectSignOut : productionRedirectSignOut,
  }
}

Amplify.configure(updatedAwsConfig);

Let me know if this helps!

SaileshKumar commented 2 years ago

Ahh you're right. Thank you so much!!

github-actions[bot] commented 1 year ago

This issue has been automatically locked since there hasn't been any recent activity after it was closed. Please open a new issue for related bugs.

Looking for a help forum? We recommend joining the Amplify Community Discord server *-help channels or Discussions for those types of questions.