django rest jwt vue 跨域问题
跨域报错信息: Failed to load http://127.0.0.1:8200/api/jwt-auth/: No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://localhost:9528' is therefore not allowed access.
跨域:
简单来说就是 A 网站的 javascript 代码试图访问 B 网站,包括提交内容和获取内容。这显然是不安全的。为此,浏览器的鼻祖:网景(Netscape)公司提出了优秀的解决方案:著名的浏览器同源策略。现在所有支持JavaScript的浏览器都会使用这个策略。
同源:
域名、协议、端口均相同的网站即为同源。
流程:
当一个浏览器的两个Tab页分别打开百度和谷歌页面时,百度发起一个脚本执行,此时浏览器会检查该脚本属于哪个页面。即检查是否同源。只有和百度同源的脚本才会被执行。若非同源,在请求数据时,浏览器会在控制台报一个异常。提示拒绝访问。
解决方法:
- 安装django-cors-headers
pip install django-cors-headers
- settings.py配置
INSTALLED_APPS = [ ... "corsheaders", ... ] MIDDLEWARE_CLASSES = ( ... "corsheaders.middleware.CorsMiddleware", "django.middleware.common.CommonMiddleware", # 注意顺序 ... ) # 跨域增加忽略 CORS_ALLOW_CREDENTIALS = True CORS_ORIGIN_ALLOW_ALL = True CORS_ORIGIN_WHITELIST = ( "*" ) CORS_ALLOW_METHODS = ( "DELETE", "GET", "OPTIONS", "PATCH", "POST", "PUT", "VIEW", ) CORS_ALLOW_HEADERS = ( "XMLHttpRequest", "X_FILENAME", "accept-encoding", "authorization", "content-type", "dnt", "origin", "user-agent", "x-csrftoken", "x-requested-with", )
本文来自云栖社区合作伙伴“开源中国”
本文作者:_Change_