vue本地和生产跨域请求，跨域请求Uncaught SyntaxError: Unexpected token错误

最新推荐文章于 2024-07-08 15:08:31 发布

Bruce_Json

最新推荐文章于 2024-07-08 15:08:31 发布

阅读量487

点赞数

分类专栏： vue

本文链接：https://blog.csdn.net/Milan__Kundera/article/details/107046778

版权

vue 专栏收录该内容

5 篇文章 0 订阅

订阅专栏

跨域请求路由配置

    proxyTable: {
      '/baiduApi': {  //前缀匹配
        target: 'http://api.map.baidu.com', //接口域名
        changeOrigin: true,  //是否跨域
        secure: false,  //https需要设置为true
        pathRewrite: {
          '^/baiduApi': '/',  //将url中baiduApi替换为/
        }
      }
    },

本地环境重启项目就能访问，在生产环境需要配置nginx中server，否则会出现404错误

^~ /baiduApi/表示匹配前缀是baiduApi的请求

proxy_pass的结尾有/，则会把/baiduApi/*后面的路径直接拼接到后面，即移除baiduApi

    location ^~ /baiduApi/ {
        proxy_pass https://api.map.baidu.com/;
    }

请求出现Uncaught SyntaxError: Unexpected token错误，设置dataType为jsonp即可解决

    $.ajax({
      url:'/baiduApi/geocoder/v2/?output=json&ak=ak&address=xx',
      type:'get',
      dataType:'jsonp',
      success:function(data){
        console.log('success:'+data)
      },
      error:function(error){
        console.log(error)
      }
    })