django rest jwt vue 跨域问题

简介:

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页分别打开百度和谷歌页面时,百度发起一个脚本执行,此时浏览器会检查该脚本属于哪个页面。即检查是否同源。只有和百度同源的脚本才会被执行。若非同源,在请求数据时,浏览器会在控制台报一个异常。提示拒绝访问。

解决方法:

  1. 安装django-cors-headers
    pip install django-cors-headers
  1. 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_ 

原文链接

相关文章
|
1月前
|
JavaScript 前端开发 API
vue获取图片的blob传给django后端
vue获取图片的blob传给django后端
35 4
|
1月前
|
JavaScript 前端开发 Python
django接收前端vue传输的formData图片数据
django接收前端vue传输的formData图片数据
43 4
|
19天前
|
JavaScript NoSQL Java
CC-ADMIN后台简介一个基于 Spring Boot 2.1.3 、SpringBootMybatis plus、JWT、Shiro、Redis、Vue quasar 的前后端分离的后台管理系统
CC-ADMIN后台简介一个基于 Spring Boot 2.1.3 、SpringBootMybatis plus、JWT、Shiro、Redis、Vue quasar 的前后端分离的后台管理系统
32 0
|
3月前
|
JSON API 数据安全/隐私保护
哇塞!Django REST framework 太逆天啦!构建 API 服务从未如此轻松,你还不来试试?
【8月更文挑战第31天】Django REST framework(DRF)是基于Django框架的高效Web API开发工具,提供序列化、视图集、路由等功能,简化API构建流程。使用DRF可轻松实现数据的序列化与反序列化,并支持权限管理和认证机制以保障API安全。安装DRF只需通过`pip install djangorestframework`命令。要创建基本项目,先安装Django并创建新应用,定义模型、序列化器及视图集,最后配置路由。测试API时,可通过Postman发送HTTP请求验证功能。无论项目大小,DRF均能提供强大支持。
42 0
|
3月前
|
JSON API 数据安全/隐私保护
Django 后端架构开发:JWT 项目实践与Drf版本控制
Django 后端架构开发:JWT 项目实践与Drf版本控制
72 0
|
3月前
|
中间件 API 网络架构
Django后端架构开发:从匿名用户API节流到REST自定义认证
Django后端架构开发:从匿名用户API节流到REST自定义认证
43 0
|
4月前
|
存储 JavaScript 前端开发
Django + Vue 实现图片上传功能的全流程配置与详细操作指南
 在现代Web应用中,图片上传是一个常见且重要的功能。Django作为强大的Python Web框架,结合Vue.js这样的现代前端框架,能够高效地实现这一功能。本文将详细介绍如何在Django项目中配置图片上传的后端处理,并在Vue前端实现图片的选择、预览和上传功能。
|
5月前
|
存储 JSON API
在django3应用中使用现代的JWT鉴权
【6月更文挑战第8天】本文介绍流行的鉴权方式,JSON Web Tokens (JWT) 是一种验证JSON数据所有者的机制,它是一个编码的、安全的字符串,包含可信任的数据且能加密签名。无状态的令牌认证允许客户端存储令牌并将其在每次请求。
63 8
在django3应用中使用现代的JWT鉴权
|
5月前
|
存储 JSON 数据库
Django REST framework关联序列化器详解:掌握复杂关系的序列化与反序列化艺术
Django REST framework关联序列化器详解:掌握复杂关系的序列化与反序列化艺术
下一篇
无影云桌面