Black Lives Matter. Please consider donating to Black Girls Code today.
Dash HoloViews is now available! Check out the docs.

Getting an invalid_client error when using Google OAuth for authentication

I’ve been trying to use dash-google-auth (https://github.com/lucaschapin/dash-google-auth) in my Dash application but I’m getting an invalid client error. I did all of the steps from the README.md file and replaced the variables for client ID and client secret with real values like this:

app.server.config["GOOGLE_OAUTH_CLIENT_ID"] = os.environ.get("put-my-client-id-here")
        app.server.config["GOOGLE_OAUTH_CLIENT_SECRET"] = os.environ.get("put-my-client-secret-here")

However, when I ran python app.py and opened “localhost:5000” in my browser I got the following error:

401. That’s an error.

Error: invalid_client

The OAuth client was not found.

Request Details
response_type=code
client_id=None
redirect_uri=http://localhost:5000/login/google/authorized
scope=profile email
state=1kPQ9gCwR3EkGbXV5LdnPLu1TgQEpn
access_type=offline
approval_prompt=force
That’s all we know.

I put the following into the “Authorized redirect URIs” field: http://localhost:5000/login/google/authorized

And here is the app code:

import dash
import dash_core_components as dcc
import dash_html_components as html
from flask import Flask, redirect, url_for
from flask_dance.contrib.google import make_google_blueprint, google

from auth.google_oauth import GoogleOAuth

server = Flask(__name__)

app = dash.Dash(__name__, server=server, url_base_pathname='/', auth='auth')
authorized_emails = ["my-email-here"]
auth = GoogleOAuth(app, authorized_emails)

@server.route("/")
def MyDashApp():
    return app.index()

app.layout = html.Div(children=[
    html.H1(children="Hello Dash"),

    html.Div(children='''
    Dash: A web application framework for Python
    '''),

    dcc.Graph(
        id='example-graph',
        figure={
            'data': [
                {'x': [1, 2, 3], 'y': [4, 1, 2], 'type': 'bar', 'name': 'SF'},
                {'x': [1, 2, 3], 'y': [2, 4, 6], 'type': 'bar', 'name': 'Montreal'},
            ],
            'layout': {
                'title': 'Dash Data Visualization'
            }
        }
    )
])

if __name__ == '__main__':
    app.run_server(host='localhost', port=5000)

Has anyone used this Google OAuth solution to authenticate and view a Dash app? Any idea why I might be getting this error? Any help would be greatly appreciated. Thanks.

1 Like