Google OAuth2 redirect_uri_mismatch when exchanging the code for token on the server

Question

Even though this is covered quite a bit I am still struggling to configure my site to properly authenticate with Google Oauth for some time. I get the "redirect_uri_mismatch" error when I try to exchange the code for the auth token at the server. I would like to understand this fundamentally. The frontend succeeds to get the offline code with this request:

https://accounts.google.com/o/oauth2/iframerpc?action=issueToken&response_type=token%20id_token&login_hint=AXXXXXXXX&client_id=XXX.apps.googleusercontent.com&origin=http%3A%2F%2Flocalhost%3A8000&scope=openid%20profile%20email&ss_domain=http%3A%2F%2Flocalhost%3A8000

The code is then deviled to backend. The backend makes this request and fails:

send: b'POST /o/oauth2/token HTTP/1.1\r\nHost: accounts.google.com\r\nUser-Agent: python-requests/2.22.0\r\nAccept-Encoding: gzip, deflate\r\nAccept: application/json\r\nConnection: keep-alive\r\nContent-Type: application/x-www-form-urlencoded\r\nContent-Length: 294\r\n\r\n'
send: b'grant_type=authorization_code&code=XXXX&client_id=XXXX.apps.googleusercontent.com&client_secret=XXXX&redirect_uri=http%3A%2F%2Flocalhost%3A8000%2F'
reply: 'HTTP/1.1 400 Bad Request\r\n'
header: Content-Type: application/json; charset=utf-8
header: Vary: Origin
header: Vary: X-Origin
header: Vary: Referer
header: Content-Encoding: gzip
header: Date: Wed, 22 Jan 2020 10:06:01 GMT
header: Server: ESF
header: Cache-Control: private
header: X-XSS-Protection: 0
header: X-Frame-Options: SAMEORIGIN
header: X-Content-Type-Options: nosniff
header: Alt-Svc: quic=":443"; ma=2592000; v="46,43",h3-Q050=":443"; ma=2592000,h3-Q049=":443"; ma=2592000,h3-Q048=":443"; ma=2592000,h3-Q046=":443"; ma=2592000,h3-Q043=":443"; ma=2592000
header: Transfer-Encoding: chunked
Authentication process canceled; ; {'error': 'redirect_uri_mismatch', 'error_description': 'Bad Request'}
WARNING Bad Request: /api/v1/login/social/knox_user/google-oauth2/
WARNING "POST /api/v1/login/social/knox_user/google-oauth2/ HTTP/1.1" 400 0

I have added "http://localhost:8000/" to "Authorized redirect URIs" in google console. Also the Authorized JavaScript origins is correct: "http://localhost:8000".

My stack is "react-google-login": "^5.0.7" for the front end. I quite like the iframe pop up login flow. That works fine to get a offline auth code.

On the server side I use rest-social-auth==3.0.0, social-auth-app-django==3.1.0 and social-auth-core==3.2.0 with this setup:

SOCIAL_AUTH_GOOGLE_OAUTH2_KEY = 'XXX.apps.googleusercontent.com'
SOCIAL_AUTH_GOOGLE_OAUTH2_SECRET = 'XXX'
SOCIAL_AUTH_LOGIN_REDIRECT_URL = 'http://localhost:8000/'
SOCIAL_AUTH_LOGIN_ERROR_URL = 'http://localhost:8000/'
SOCIAL_AUTH_GOOGLE_OAUTH2_SCOPE = ['email', 'profile', 'openid']

AUTHENTICATION_BACKENDS = [
    'social_core.backends.google.GoogleOAuth2',
    'django.contrib.auth.backends.ModelBackend',
]

...
urlpatterns = [
    path('api/v1/login/', include('rest_social_auth.urls_knox')),

Any help will be greatly appreciated.

What happens if you rename the origin parameter to redirect_uri? — Ahmad
Will try to simulate this somehow. The request is done through gapi so I need to hack it or simulate it in postman. Will post here as soon as I get some results. — Vess Perfanov

Gary Archer Gary Archer · Accepted Answer · 2020-01-22T19:46:49

You are using response_type='token id_token' which is the (outdated) implicit flow. I don't see how you will receive a code value. Try using response_type='code'.

If you are building a Single Page App then the STANDARD messages are steps 4 and 7 from my blog post.

I have not used Google for a little while so always possible their solution differs a little.

Google OAuth2 redirect_uri_mismatch when exchanging the code for token on the server

1 Answers