反应本机 Axios Django - Csrf 失败引用检查失败没有引用

Question

我正在使用 axios 从 React front-end 调用 Django back-end api。

对于那个 api 即登录 api，我在逻辑上使用 Django Knox 包。

React.js - 我正在调用 axios.request(method, url, data)，api 调用正常。当我去 Developer tools>Network 时，我可以看到 Referer header 在请求 header 中设置为 React.js 网站，没有其他 csrf-related header。在响应 headers 中，我可以看到两个 set-cookie headers，csrftoken 和 sessionid.

React Native - 我调用 api 的方式相同，但 api returns 错误 csrf failed referer checking failed - no referer 。当我检查 response.config 时，Referer header 与 React.js

不同

Curl - 工作正常

httpie - 工作正常

我怎样才能摆脱这个错误。

注意 1 - 我的 Django back-end 是基于 api 令牌逻辑而不是 csrf 以任何方式。

注 2 - React.js 和 Django 托管在不同的域中。我在处于调试模式的 React Native 中遇到错误。

更新 1 - 在 Django settings.py 中禁用 CSRF 中间件后，现在我只得到一个 setCookie header（不再获得 csrftoken）但是同样的错误仍然存在。

Answer 1

Django Rest api 需要一个 Referer header。

在 React.js 的情况下，它是自动设置的（可能由浏览器设置）并且其值为当前网站。

但在 React Native 的情况下，它没有设置。所以我们必须手动设置它。

由此link，我在axios中设置了Refererheader。见下面的代码

export const axiosAPICall = (method,url,data,headers) => {
    let request = {
        method: method,
        url: url,
    };
    if (data) {
        request['data'] = data;
    }
    if (headers) {
        request['headers'] = headers;
    }
    // Referer is auto-set in react.js as same website value.
    // for react-native we have to set it manually to target api:port
    request['headers'] = {
        ...request['headers'],
        Referer: url
    }
    return axios.request(request)
        .then(res => res.data)
        .catch(error => {throw error});
};

在 Django settings.py 中，我评论了 CSRF middleware
在 Django settings.py 中，我只添加了 TokenAuthentication class 来删除 SessionAuthentication.

REST_FRAMEWORK = {
    'DEFAULT_AUTHENTICATION_CLASSES': [
        'rest_framework.authentication.TokenAuthentication',
    ]
}

注意 - 请在正确了解您的要求后执行步骤 2 和 3，风险自负。我删除了 CSRF 中间件，因为我的 API 完全依赖令牌进行身份验证。我根本不需要 CSRF。

反应本机 Axios Django - Csrf 失败引用检查失败没有引用

React native Axios Django - Csrf failed referer checking failed no referer

django

django-csrf

reactjs

react-native

axios