Django / React跨来源请求被阻止错误托管的Google App Engine django-cors-标头不起作用

Question

应用程序后端(django)和前端(react)托管在同一个应用程序的google cloud上。我已经安装了django-cors-headers并在settings.py中引用了它：

INSTALLED_APPS = (
    ...
    'corsheaders',
    ...
)

MIDDLEWARE = [
    'django.middleware.security.SecurityMiddleware',
    'django.contrib.sessions.middleware.SessionMiddleware',
    'corsheaders.middleware.CorsMiddleware',
    'django.middleware.common.CommonMiddleware',
    ...
]

CORS_ORIGIN_ALLOW_ALL = True

CORS_ORIGIN_REGEX_WHITELIST = (
    'http://localhost:3000',
    'https?\://myapp\.appspot\.com\/?',
    'https?\://frontend-dot-myapp\.appspot\.com\/?',
)

据我所知，CORS_ORIGIN_ALLOW_ALL应该已经解决了这个问题，但它没有，我只是在那里尝试了一下。对于我来说，CORS_ORIGIN_WHITELIST不能很好地工作，这就是为什么CORS_ORIGIN_REGEX_WHITELIST。

我没有更改此设置中的任何内容，但现在出现交叉原点错误。自从上次代码更改后，我安装了django-silk来分析应用程序。移除它似乎不能解决问题，所以我不确定它是否相关。

非常感谢您的帮助！

在requirements.txt中：django-cors-headers==3.2.1

编辑

经过多次尝试和错误，我发现在urls.py中添加最后两行代码会导致这个问题：

urlpatterns = [
    path('admin/', admin.site.urls),
    path('api/', views.api_root),
    path('_ah/warmup/', views.service_status),
    path('_ah/start/', views.service_status),
    ...

然而，我不明白为什么会导致CORS错误，也不知道如何解决它。

Answer 1

我在项目解决方案中也遇到了同样的问题

1. 将corsheaders.middleware.CorsMiddleware放在顶部

MIDDLEWARE =‘corsheaders.midleware.CorsMiddleware’，'django.middleware.security.SecurityMiddleware'，'django.contrib.sessions.middleware.SessionMiddleware'，‘django.midleware.common.CommonMiddleware’，‘django.midleware.csrf.CsrfViewMiddleware’，

1. ALLOWED_HOSTS = '*'

在settings.py的底部添加

CORS_ORIGIN_ALLOW_ALL =真正的

Answer 2

这个想法可能值得一试。尝试将'corsheaders.middleware.CorsMiddleware'行移动到MIDDLEWARE部分的顶部。

这是在pypi django-cors-headers documentation中推荐的，他们说"CorsMiddleware应该放在尽可能高的位置，特别是在任何可以生成响应的中间件之前，如果不是这样，它将无法将CORS头添加到这些响应中。“

Answer 3

勾选这里的‘Content- type’：“应用程序/json”，如果你输入Contenttype或者ContentType将会给出一个CORS header blocked的错误