• vue 跨域 和django跨域


    1,首先vue跨域我知道两种 ,一种在config文件下,index.js里面配置跨域:

    module.exports = {
    dev: {

    // Paths
    assetsSubDirectory: 'static',
    assetsPublicPath: '/',
    proxyTable: {
    '/api':{//使用"/api"来代替"http://f.apiplus.c"
    target:'http://127.0.0.1:8000/',//源地址
    changeOrigin:true,//改地址
    pathRewrite:{
    '^/api':''//路由重写
    }
    }
    },
    vue 代码:
    mounted() {
    this.axios({
    url:'/api/sadmin/show/', #后端接口
    data:{},
    method:'get'
    }).then((res)=>{
    console.log(res)
    if (res.data.code==200){
    this.alist = res.data.message
    },

    2,另一种是在写vue代码时候:直接指定路由:
    methods: {
    login(){
    let formdata = new FormData();
    formdata.append('accout',this.accout);
    formdata.append('password',this.password);
    this.axios({
    url:'http://127.0.0.1:8000/api/doctorLogin/', #指定后端端口号
    method:'post',
    data:formdata

    }).then((res)=>{
            console.log(res)
    }
    如果选择第二种 那么就要在django里面进行配置跨域;
    INSTALLED_APPS = [
    'django.contrib.admin',
    'django.contrib.auth',
    'django.contrib.contenttypes',
    'django.contrib.sessions',
    'django.contrib.messages',
    'django.contrib.staticfiles',
    'rest_framework',
    'corsheaders', # 跨域时注册这一行
    'weblist'
    ]

    还有中间件
    MIDDLEWARE = [
    'django.middleware.security.SecurityMiddleware',
    'django.contrib.sessions.middleware.SessionMiddleware',
    'corsheaders.middleware.CorsMiddleware', #配置这一行
    'django.middleware.common.CommonMiddleware',
    # 'django.middleware.csrf.CsrfViewMiddleware',
    'django.contrib.auth.middleware.AuthenticationMiddleware',
    'django.contrib.messages.middleware.MessageMiddleware',
    'django.middleware.clickjacking.XFrameOptionsMiddleware',
    ]
    CORS_ORIGIN_ALLOW_ALL = True  #允许所有域名进行访问
    还有不要忘记在主路由下 加上api
    urlpatterns = [
    path('admin/', admin.site.urls),
    path('api/',include('weblist.urls')), #跨域接口 api
    ]

    这样就可以啦 !!
     
  • 相关阅读:
    Feign Ribbon Hystrix 关系剖析
    Activiti 分布式方案实现探讨
    Flink任务架构分析
    Activiti 数据库表梳理
    负载均衡方案优缺点探讨
    公文流转系统
    css美化界面
    动手动脑(二)
    csslayui树练习
    css点名
  • 原文地址:https://www.cnblogs.com/pp8080/p/11931473.html
Copyright © 2020-2023  润新知