为什么我一直得到axios错误在我的Django React应用上的Heroku?

Question

我开发了一个简单的Django React应用程序并部署到heroku上:

https://friendly-interview-duck.herokuapp.com/

即使后端和前端连接在本地通过axios正常工作，我开始得到臭名昭著的

GET http://127.0.0.1:8000/api/questions/ net::ERR_CONNECTION_REFUSED

在部署的应用程序中出现错误。

显然，我认为这与主机/CORS有关。我一开始有

CORS_ALLOWED_ORIGINS = [
'https://friendly-interview-duck.herokuapp.com', 
'https://127.0.0.1:8000.com', 
'https://localhost.com'
]
ALLOWED_HOSTS = [
'https://friendly-interview-duck.herokuapp.com', 
'https://127.0.0.1:8000.com', 
'https://localhost.com']

在我的setting.py，但得到这个错误，我把它改为:

CORS_ORIGIN_ALLOW_ALL = True
ALLOWED_HOSTS = ['*']

实验。你猜怎么着?我仍然收到连接拒绝错误!我多次清除现金，甚至从另一台计算机上浏览部署的url，但错误仍然存在。

值得注意的是，我知道很多人在他们的网址末尾遗漏了'/'，这导致了这个问题，但我在我的请求网址末尾也有一个'/'，所以这不是问题。

我在这里错过了什么?

https://github.com/gokceozer1/friendly-interview-duck.git

Answer 1

当你的应用程序在本地运行时，你的前端可以通过本地URL (localhost)从后端获取信息，但当你部署后端时，它在互联网上运行在一个完全不同的URL上。

你的React应用程序，就像它现在一样，本质上是试图从用户的localhost获取，在大多数情况下，如果不是所有的情况下，没有任何服务器运行，导致ERR_CONNECTION_REFUSED

你不应该硬编码服务器地址在你的前端应用程序，并使用以/开头的url(例如:/api/posts/create)

在本地开发时，你可以允许React使用代理选项从后端获取。