django + vue.js 解决跨域问题

Posted jsp0

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了django + vue.js 解决跨域问题相关的知识,希望对你有一定的参考价值。

浏览器跨域报错:"No: Access-Control-Allow-Origin":

 解决方案1:

     在view视图函数中 给封装好的list_查看这个方法这个函数给父类

clss Oldboy (ModelViewset):
        queryst =Course.objects.all()
        serializer_Class =CoureSerializer

def  list(self,request,*args,**kwargs)
       response = super().list(request,*args,**kwargs)# 
    respones["No: Access-Control-Allow-Origin"] ="*" #{在 ="*"这里可以写为本地地址:http://localhost:端口}
                                  如果输入本地地址报错 还需要改为="*"
    return respones

 

 问题这样写的话 如果后台每次的方法中都需要这个操作传过值,那以后 都得一个一个往进添加 这个跨域报错这样会出现代码冗余:

 

所以有了解决作用域2:

        把每次前端向 后端请求的url地址 跨域报错都放到中间件重,项目再起来的时候 直接把跨域报错通过中间件掠过,

      操作中间件的模块在setings中拿到 from django.utils.deprecation import MiddlewareMixin

      操作代码:

          

from django.utils.deprecation import MiddlewareMixin
class corsMiddleware(MiddlewareMixin) 继承 MiddlewareMixin
  def process_reponse(self,request,reponse):
         respones["Access-Control-Allow-Origin"] ="*"    
        return response

写完中间件后 在seetings中 中间件MIDDLEWARE最后一行加入  增加中间件这个类的目录名称和类名:
‘app01.middlwares.cors.corsMiddleware

 

 

中间件 普通的—跨域 之 中间件—复杂跨域: 

  OPTTONS 是针对ajax 发送methon的中data接受时herard请求头时候那不搭配Content-type字符串类型 所以转为json数据格式后

   后请求头herdl 不支持 非json 格式所以需 需要content——Type 进行序列号

 

  

 

 

 

      

    

 









以上是关于django + vue.js 解决跨域问题的主要内容,如果未能解决你的问题,请参考以下文章

Vue.js学习—— 分别从前后端Nginx解决SpringBoot+vue.js项目中的跨域问题

vue.js vue-jsonp解决跨域问题

vue.js使用http-proxy-middleware解决跨域请求问题

VUE-CLI 4的跨域解决方案

如何解决Vue.js里面noVNC的截图问题——论可以跨域的webSocket

Springboot vue.js html 跨域 前后分离 shiro权限 集成代码生成器