使用vue-cli开发跨域问题解决

在本地开发时,使用http://localhost:8080 访问第三方接口时,会产生跨域。这个时候就需要设置代理的方式跨域来访问第三方接口。
使用vue-cli开发时,启动项目后,就是在http下的开发环境,这个时候可以直接设置代理。

打开vue-cli的目录结构,找到config文件夹下的index.js,其中有个dev配置项中的proxyTable,设置如下:

 proxyTable: {
      //设置规则,以proxy开头的
      "proxy":{
        //目标地址
        target:"http://m.kugou.com",
        //设置为false 是http请求,设置为true是https请求
        "secure":false,
        //设置true 代表跨域访问
        "changeOrigin":true,
        //路径改写规则,如果为空,代表直接替换
        "pathRewrite":{
          "^proxy":""
        }
      }
    }

具体的信息都已经标注好了,设置代理以后就可以直接跨域访问第三方接口。

大家一定一定要注意!!!配置好以后需要重新npm run dev启动 才会生效!!!!
大家一定一定要注意!!!配置好以后需要重新npm run dev启动 才会生效!!!!
大家一定一定要注意!!!配置好以后需要重新npm run dev启动 才会生效!!!!

感觉很好用,希望可以对大家有帮助

你可能感兴趣的:(使用vue-cli开发跨域问题解决)