在Django中如何获取带#的URL中的access_token查询参数？

问题根源 #

URL中的#（锚点/片段标识符）部分不会被浏览器发送到服务器，后端Django无法直接读取这部分内容，这就是request.GET和request.META里找不到access_token的核心原因。

解决方案 #

1. 前端解析锚点后传递给后端 #

只有浏览器能获取到锚点内容，必须借助JavaScript解析后再传递给Django后端，以下是两种常用实现方式：

方式一：跳转到带查询参数的后端路由

在/redirect/对应的模板中添加代码：

document.addEventListener('DOMContentLoaded', function() {
    // 去掉#号，解析锚点中的参数
    const hashParams = new URLSearchParams(window.location.hash.slice(1));
    const accessToken = hashParams.get('access_token');
    
    if (accessToken) {
        // 跳转到后端处理路由，将token作为查询参数传递
        window.location.href = `/handle-token?access_token=${accessToken}`;
    }
});

之后在Django的handle-token视图中，即可通过request.GET.get('access_token')正常获取参数。

方式二：通过AJAX请求传递token（无页面跳转）

如果不需要页面跳转，可以用POST请求将token发送给后端：

document.addEventListener('DOMContentLoaded', function() {
    const hashParams = new URLSearchParams(window.location.hash.slice(1));
    const accessToken = hashParams.get('access_token');
    
    if (accessToken) {
        fetch('/save-token/', {
            method: 'POST',
            headers: {
                'Content-Type': 'application/json',
                'X-CSRFToken': document.querySelector('[name=csrfmiddlewaretoken]').value
            },
            body: JSON.stringify({ access_token: accessToken })
        })
        .then(response => response.json())
        .then(data => {
            // 处理后端返回结果
            console.log('Token processed:', data);
        });
    }
});

对应的Django视图可以通过解析请求体获取token：

from django.http import JsonResponse
import json

def save_token(request):
    if request.method == 'POST':
        data = json.loads(request.body)
        access_token = data.get('access_token')
        # 此处添加token的业务处理逻辑
        return JsonResponse({'status': 'success', 'token': access_token})
    return JsonResponse({'status': 'error'}, status=400)

2. 调整重定向源配置 #

如果是第三方服务（如OAuth2服务）触发的重定向，检查该服务是否支持将token放在URL的查询参数（?后）而非锚点中。例如OAuth2授权码模式通常会将token返回在响应体或查询参数中，而隐式授权模式默认使用锚点，这种情况下只能采用前端处理方案。

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