2.2.9版本:配置了proxy,vue项目正常请求到数据,taro报CORB跨域错误



  • Taro项目 版本2.2.9 H5
    1593411956705.jpg
    H5配置:

    h5: {
    
        publicPath: '/',
        staticDirectory: 'static',
        outputDir: 'works',
        esnextModules: ['taro-ui'],
    
        devServer: {
          port: 8094,      // 端口号
          host: 'localhost',
          https: false,    // https:{type:Boolean}
          open: false,     //配置自动启动浏览器
          proxy:{
            '/desktop':{
               target:'http://dev.xxx.com',//地址隐藏
              changOrigin: true,
            },
            '/open':{
               target:'http://dev.xxx.com',//地址隐藏
              changOrigin: true,
            },
      
            '/user':{
              target:'http://dev.xxx.com',//地址隐藏
              changOrigin: true,
            }
          }
        }
    

    VUE相同后端地址效果:
    1593412152501.jpg
    vue配置:

    devServer: {
        port: 8054,      // 端口号
        host: '0.0.0.0',
        https: false,    // https:{type:Boolean}
        open: false,     //配置自动启动浏览器
        proxy:{
          '/desktop':{
             target:'http://dev.xxx.com',//地址隐藏
          },
          '/open':{
             target:'http://dev.xxx.com',//地址隐藏
          },
    
          '/user':{
             target:'http://dev.xxx.com',//地址隐藏
          }
        }
      }
    


  • 你在请求的时候,加上mode:'cors'



  • @糖小宝
    谢谢你,但是我试着加上了还是不行

    componentWillMount() {
            this.getMX()
        }
        //自定义方法
        getMX = async () => {
            let data = await Taro.request({ url: '/open/getMX',method:'GET',mode:'cors' });
            console.log('-----2', data) 
        }
    


  • b652cf60-57d5-4551-bade-4202f6c8d8a9-image.png



  • @jd_EiKppMDWGDZZ 前几天我也遇到这种问题,现在我没有用proxy代理,而是直接写请求接口,加上'core'就解决了,我刚贴图,是我请求的代码



  • @糖小宝
    先谢谢你帮我解决问题,我试了试,也许我写法有问题,设置跨域的话反而报跨域错误:
    Provisional headers are shown

    let data = await Taro.request({ 
                url: 'http://dev.xxx.com/open/getMX',
                method:'GET',
                header:{'content-type':'application/json;charset=utf-8'},
                mode:'cors' });
    

    改成mode:'no-cors',其他配置不变
    接口状态200 但是什么都没返回

    Request URL: http://dev.xxx.com/open/getMX
    Request Method: GET
    Status Code: 200 OK
    Remote Address: 120.92.62.60:80
    Referrer Policy: no-referrer-when-downgrade
    Connection: keep-alive
    Content-Type: application/json;charset=utf-8
    Date: Mon, 29 Jun 2020 07:57:50 GMT
    P3P: CP=CAO PSA OUR
    Server: nginx/1.4.7
    Transfer-Encoding: chunked
    Accept: */*
    Accept-Encoding: gzip, deflate
    Accept-Language: zh-CN,zh;q=0.9
    Connection: keep-alive
    Host: dev.xxx.com
    Referer: http://localhost:8094/
    User-Agent: Mozilla/5.0 (Linux; Android 5.0; SM-G900P Build/LRX21T) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/83.0.4103.97 Mobile Safari/537.36
    

    5D0DFA67-565B-4BAC-8F1F-E0F301DBE312.png

    h5的配置已改成:

      devServer: {
          port: 8094,      // 端口号
          host: 'localhost',
          https: false,    // https:{type:Boolean}
          open: false,     //配置自动启动浏览器
        },
    


  • @糖小宝
    vue项目同一接口同一后端 成功返回数据的浏览器状态是这样的:

    Request URL: http://172.18.20.6:8054/open/getMX
    Request Method: POST
    Status Code: 200 OK
    Remote Address: 172.18.20.6:8054
    Referrer Policy: no-referrer-when-downgrade
    connection: close
    content-type: application/json;charset=utf-8
    date: Mon, 29 Jun 2020 05:44:28 GMT
    p3p: CP=CAO PSA OUR
    server: nginx/1.4.7
    transfer-encoding: chunked
    X-Powered-By: Express
    Accept: application/json, text/plain, */*
    Accept-Encoding: gzip, deflate
    Accept-Language: zh-CN,zh;q=0.9
    Connection: keep-alive
    Content-Length: 0
    Content-Type: application/x-www-form-urlencoded
    Host: 172.18.20.6:8054
    Origin: http://172.18.20.6:8054
    Referer: http://172.18.20.6:8054/
    User-Agent: Mozilla/5.0 (Linux; Android 5.0; SM-G900P Build/LRX21T) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/83.0.4103.97 Mobile Safari/537.36
    

    vue是配置了proxy的



  • @糖小宝
    在地址栏输入接口地址是正常返回的
    0205e8e3-f44a-4bb8-a136-b98bb691c45b-image.png



  • 改成这样配置可以了,主要是多了 secure:false 设置

    devServer: {
          port: 8094,      // 端口号
          host:'localhost',
          https:false,
          open: false,    //配置自动启动浏览器
          proxy:{
            '/open/':{
              target:"http://dev.qky100.com",
              
              changeOrigin:true,
              secure:false
            },
            '/desktop/':{
              target:"http://dev.qky100.com",
              
              changeOrigin:true,
              secure:false
            },
            '/user/':{
              target:"http://dev.qky100.com",
              
              changeOrigin:true,
              secure:false
            }
          }
        },
    

登录后回复