Django CORS 请求外部重定向不允许答案

【问题标题】：Django CORS request external redirect not allowedDjango CORS 请求外部重定向不允许
【发布时间】：2021-10-10 15:54:56
【问题描述】：

我在从 react 向 django 视图发送 GET 请求时遇到问题，这些视图重定向到 GOOGLE_AUTH_ENDPOINT。，并且这个 url 遇到了回调函数。但是在反应请求之后，它给出了这个错误：访问从源“localhost:3000”获取“google auth url”（从“localhost:8000”重定向）已被 CORS 策略阻止：对预检请求的响应未通过访问控制检查：没有“访问控制-请求的资源上存在 Allow-Origin' 标头。如果不透明的响应满足您的需求，请将请求的模式设置为“no-cors”以获取禁用 CORS 的资源。

查看

class Glogin(APIView):
    params = {
        'client_id': CLIENT_ID,
        'response_type': 'code',
        'scope': 'openid email profile',
        'redirect_uri': CALLBACK_DOMAIN,
        'state': state,
    }
    
    if APPS_DOMAIN:
        params['hd'] = APPS_DOMAIN
    
    def get(self,request):
        request.session['googleauth_csrf'] = state
        request.session['next'] = request.META.get('HTTP_REFERER', None)
        print('Here')
        print(urlencode(self.params))
        return HttpResponseRedirect("%s?%s" % (GOOGLE_AUTH_ENDPOINT, urlencode(self.params)))
        #data = {'link':GOOGLE_AUTH_ENDPOINT, 'params':self.params}
        #return Response(data)

ReactJs

  static GLogIn() {
    return fetch("http://127.0.0.1:8000/glogin/", {
      //method: "POST",
      method: "GET",
      headers: {
        "Content-Type": "application/json",
      },
      //body: JSON.stringify(body),
    }).then((response) => response.json());
  }

网址

urlpatterns = [
    path('', include(router.urls)),
    path('auth/', obtain_auth_token),
    path('login/',views.LogInViewSet.as_view()),
    path('logout/',views.LogOutViewSet.as_view()),
    path('articles/',views.ArticlesView.as_view()),
    path('articles/<int:pk>/',views.ArticlesView.as_view()),
    path('glogin/',views.Glogin.as_view()),
    path('callback/',views.Callback.as_view(), name='googleauth_callback'),

    #path('articales/',views.ArticlesViewSet.as_view())
]

settings.py

CORS_ORIGIN_WHITELIST = (
    'localhost:3000',
    #'accounts.google.com',
    #'accounts.google.com/o/oauth2/v2'
    
)


CORS_ALLOW_HEADERS = [
    'accept',
    'accept-encoding',
    'authorization',
    'content-type',
    'dnt',
    'origin',
    'user-agent',
    'x-csrftoken',
    'x-requested-with',
]

【问题讨论】：

快速破解将使用第三方浏览器插件来免除 CORS。如果您使用的是 Chrome 浏览器，请考虑从 Chrome 商店安装任何好的 CORS 插件。让我知道这是否适合您。
我使用 'Moesif Origin & CORS Changer' 这个插件，但是没有用。

标签： reactjs django django-rest-framework google-oauth django-cors-headers

【解决方案1】：

在 /etc/hosts 文件中为 127.0.0.1 放置一个 hosts 条目

127.0.0.1 myfakedomain.local

然后将其添加到 CORS_ORIGIN_WHITELIST

'myfakedomain.local:8000',

然后您可以访问 cors 重定向。 Chrome 会阻止它们，除非它们位于特殊域中。尤其是本地主机。

然后将您的浏览器发送至http://myfakedomain.local:8000

【讨论】：

谢谢你的回答，但我没有明白你的意思，你能给我举个例子吗？
我不确定哪个部分不清楚。在配置中使用 127.0.0.1 的位置，将其更改为 myfakedomain.local