Django Rest Framework PUT请求无法获取HTTP_AUTHORIZATION问题

问题现象 #

使用Django Rest Framework搭建后端，前端React通过Axios发送JWT Token做身份验证时，GET、POST请求能正常传递Token，但PUT请求里Token无法被后端接收，Django验证函数中request.META不存在HTTP_AUTHORIZATION字段。

相关配置 #

CORS已允许PUT方法：

CORS_ALLOW_METHODS = (
    "DELETE",
    "GET",
    "POST",
    "PUT",
)

前端Axios调用代码（原错误代码） #

已确认Token有效，并非undefined：

try {
    console.log("Ejecutando caso Exitoso");
    const response = await axios.put("http://localhost:8000/empresas/empresa-persona/" + param[1], {
        headers: {
            Authorization: `Bearer ${localStorage.getItem("token")}`,
            'Content-Type': 'application/json',
        },
    });
    console.log(response);
} catch (error) {
    console.log(error);
}

后端Django验证函数 #

该函数在GET、POST请求中正常工作，但PUT请求取不到HTTP_AUTHORIZATION：

def user_call_validation(request, perm):
    # Control de Acceso
    print(request.META)
    user = validate_user_token(token=request.META["HTTP_AUTHORIZATION"])
    
    # print(User.objects.get(id=user["id"]).get_all_permissions())
    if User.objects.get(id=user["id"]).has_perm(perm) != True:
        raise Exception("Acceso denegado!")

问题原因及解决方案 #

核心问题：Axios PUT方法参数顺序错误 #

Axios的put方法签名为axios.put(url[, data[, config]])，第二个参数是请求体数据，第三个参数才是包含headers的配置对象。原代码把headers放在了第二个参数（data位置），导致headers未被正确设置，Token无法传递到后端。

修改后的Axios代码 #

如果PUT请求不需要发送请求体数据，第二个参数传空对象或null，将headers移至第三个参数：

try {
    console.log("Ejecutando caso Exitoso");
    const response = await axios.put(
        "http://localhost:8000/empresas/empresa-persona/" + param[1],
        {}, // 空请求体，可根据实际需求调整
        {
            headers: {
                Authorization: `Bearer ${localStorage.getItem("token")}`,
                'Content-Type': 'application/json',
            },
        }
    );
    console.log(response);
} catch (error) {
    console.log(error);
}

验证修改 #

修改后重新发送PUT请求，后端request.META中即可正常获取HTTP_AUTHORIZATION字段，验证函数可正常执行。

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