使用Flask+flask_dance对接Github OAuth时遇redirect_uri_mismatch及404错误求助

Let’s break down what’s going on here—you’re hitting two linked issues: the redirect_uri_mismatch error from Github, and the 404 when you land back on your app. Let’s tackle them step by step.

First: The Root Cause of the Mismatch #

Even if your Github callback URL looks correct, these mismatches almost always come down to tiny, easy-to-miss differences between what Github expects and what your Flask-Dance setup is sending. Plus, that 404 tells me your app doesn’t have a route handling the callback URL Github is hitting.

Step-by-Step Troubleshooting & Fixes #

1. Verify Your Github Callback URL vs. Flask-Dance’s Actual Redirect URI

First, double-check the callback URL you registered in your Github App settings against what Flask-Dance is actually sending. The error message says Github got a redirect URI that doesn’t match—so let’s align them:

• Protocol: Local development uses http, not https (unless you’re using a tool like ngrok). Make sure Github’s callback URL uses http://localhost:5000 exactly.
• Port: Don’t forget the :5000—if you omit it, Github will default to port 80, which won’t match your local Flask server.
• Path: Your address bar shows /login/authorized, but Flask-Dance’s default Github callback path is /github/authorized. If you’re using a custom path (like /login/authorized), you need to explicitly configure this in both places.

2. Fix Your Flask-Dance Blueprint Configuration

The 404 error means your app doesn’t have a route for /login/authorized. That’s probably because your Flask-Dance blueprint isn’t registered correctly to handle that path. Here’s a corrected example:

from flask import Flask
from flask_dance.contrib.github import make_github_blueprint, github

app = Flask(__name__)
app.secret_key = "your-super-secret-key-here"  # Don't hardcode this in production!

# Configure the Github blueprint with your client ID/secret, and explicit redirect URI
github_bp = make_github_blueprint(
    client_id="YOUR_GITHUB_CLIENT_ID",
    client_secret="YOUR_GITHUB_CLIENT_SECRET",
    redirect_uri="http://localhost:5000/login/authorized",  # Matches Github's callback URL
)

# Register the blueprint with a url_prefix so the callback route is /login/authorized
app.register_blueprint(github_bp, url_prefix="/login")

@app.route("/")
def home():
    if github.authorized:
        user_data = github.get("/user").json()
        return f"Welcome back, {user_data['login']}!"
    return '<a href="/login/github">Login with Github</a>'

if __name__ == "__main__":
    app.run(debug=True)

3. Confirm Your App Has the Correct Route

Run flask routes in your terminal to list all registered routes. You should see something like:

Endpoint                  Methods  Rule
------------------------  -------  -----------------------
github.login              GET      /login/github
github.authorized         GET      /login/authorized
home                      GET      /

If /login/authorized isn’t listed, your blueprint wasn’t registered correctly—double-check the url_prefix and redirect_uri settings.

4. Check for Hidden Configuration Gotchas

• SERVER_NAME: If you set app.config["SERVER_NAME"] in your Flask app, it might override the domain/port Flask-Dance uses to generate the redirect URI. Remove this setting for local development.
• Trailing Slashes: Make sure your Github callback URL doesn’t end with a / (e.g., don’t use http://localhost:5000/login/authorized/). Flask-Dance won’t add a trailing slash, so this will cause a mismatch.
• Proxy Tools: If you’re using ngrok or another proxy for testing, your Github callback URL must use the proxy’s public URL (not localhost).

Final Quick Check #

After updating your code, go back to your Github App settings and confirm the callback URL is exactly http://localhost:5000/login/authorized—no extra characters, no missing ports, correct protocol.

This should resolve both the redirect mismatch and the 404 error, since your app will now have a valid route to handle Github’s callback, and the URIs will align perfectly.

内容的提问来源于stack exchange，提问作者vivkv