Business
Jobs
  • About Us
  • Solutions
    • Job Postings
      Post your job and receive qualified candidates in 48h.
    • Candidate Assessments
      500+ technical and psychological tests, plus anti-fraud.
    • Headhunting
      Tailor-made executive search from start to finish.
    • Payroll + EOR
      Payroll dispersal and EOR across 15+ LATAM countries.
  • Pricing
  • Jobs

0

137
Views
Google OAuth2 + react-google-login: "redirect_uri_mismatch" when trying to retrieve a refresh token

how are you doing?

I'm using react-google-login to make the login flow in the frontend.

This is my login button setup:

<GoogleLogin
    accessType="offline"
    clientId={google.client_id}
    cookiePolicy="single_host_origin"
    onSuccess={handleLogin}
    onFailure={handleLoginFail}
    prompt="consent"
    responseType="code"
    scope="email profile https://www.googleapis.com/auth/userinfo.profile https://www.googleapis.com/auth/userinfo.email https://www.googleapis.com/auth/calendar.events.readonly openid"
    render={(_props) => (
        <Button className="google-login-btn" onClick={_props.onClick}>
            {props.buttonText} <GoogleIcon className="google-icon" height="20px" width="20px" />
        </Button>
    )}>
</GoogleLogin>

This is working fine and I'm successfully receiving an authorization_code from Google. The problem is when I try to grab a refresh token for the user.

This is the code I'm using to retrieve the refresh token:

const { client_id, client_secret, redirect_uri } = require('../config').google;

export async function GetRefreshToken(code) {
    try {
        const data = new URLSearchParams({
            code,
            client_id,
            client_secret,
            grant_type: 'authorization_code',
            redirect_uri
        });

        const headers = {
            'Content-Type': 'application/x-www-form-urlencoded'
        };

        const response = await axios.post('https://oauth2.googleapis.com/token', data, { headers });
        const parsedResponse = JSON.parse(response.data);

        if (parsedResponse.refresh_token) return parsedResponse;
        else return null;
    } catch (err) {
        console.error(err);
        throw err;
    }
}

And this is the error I'm receiving:

{
  "error": "redirect_uri_mismatch",
  "error_description": "Bad Request"
}

My redirect_uri is set as http://localhost:3000/, and I have confirmed that it is configured correctly in my Google project.

What am I missing here?

about 4 years ago · Juan Pablo Isaza
1 answers
Answer question

0

Okay, I finally found a workaround.

Setting the redirect_uri as postmessage did the trick.

Why? I'm still wondering... But it works!

about 4 years ago · Juan Pablo Isaza Report
Answer question
Find remote jobs

Discover the new way to find a job!

Top jobs
Top job categories
Business
Post vacancy Pricing Sales
Legal
Terms and conditions Privacy policy
© 2026 PeakU Inc. All Rights Reserved.
Andres GPT
Show me some job opportunities
There's an error!