如何链接 Django 和 React URL 以执行操作？答案

【问题标题】：How to link Django and React URLs to perform actions?如何链接 Django 和 React URL 以执行操作？
【发布时间】：2020-12-08 07:41:45
【问题描述】：

在 Django 中，我的登录 URL 设置为“api/auth/login”。当给定用户名和密码时，它将登录该用户。运行“python manage.py runserver”，它将将该 URL 放在“http://127.0.0.1:8000/api/auth/login”

但是，我的 React 项目在运行 'yarn start' 时位于 'http://localhost:3000/' 并为其提供扩展名 'api/auth/login'，它尝试的 url 是 'http:// localhost:3000/api/auth/login'。

这不起作用，但如果我将 URL 扩展名替换为“http://127.0.0.1:8000/api/auth/login”，登录将按预期工作。

如何让这些 URL 与我的 React 应用程序一起使用？或者这不是必须要解决的问题吗？我确实计划在某个地方托管这个项目，但还不确定 URL 将如何工作..

【问题讨论】：

标签： django reactjs django-rest-framework react-redux

【解决方案1】：

一种选择是在package.json 中设置proxy。

第二个选项是设置axois baseURL:

// add in your code before main component definition
// for example in App.js
import axios from "axios";
axios.defaults.baseURL = "http://127.0.0.1:8000";

我更喜欢第二种方法。为了进行生产构建，它可以很容易地被环境变量覆盖。

import axios from "axios";
axios.defaults.baseURL = REACT_APP_SERVER_URL

记得在 Django 服务器中设置 CORS 标头（我正在处理 tutorial 并提供如何执行此操作的示例）。

【讨论】：

【解决方案2】：

您将 React 应用程序托管在另一个端口上，这就是为什么当您提出请求而不提及主机时，它会附加到您当前的主机，即 127.0.0.1:3000。我建议你写“代理”：'127。 0.0.1:8000' 在你的 package.json 中（参考https://create-react-app.dev/docs/proxying-api-requests-in-development/）并重新启动你的反应服务器或使用 django 服务器的完整 url 即 127.0.0.1:8000/

【讨论】：