vue-cli设置跨域代理 + 开发/生成环境简单请求接口设置

1、设置dev.proxyTable实现开发环境的跨域代理：

　　在config文件夹下index.js文件内：

 1 module.exports = {
 2   dev: {
 3     proxyTable: {
 4       '/api': { /* 在组件内使用"/api"来代替源地址 */
 5         target: 'http://xxx.xx.xxx.xx:xxxxxx', /* 设置接口请求源 */
 6         changeOrigin: true, /* 设为true，表示进行代理 */
 7         pathRewrite: { /* 理解为用‘/api’代替target里面的地址，调用接口时直接用api代替 */
 8           '^/api': '/' /* 举例调用'http://xxxx/xxxx/user/add'，可以在方法内直接写‘/api/xxxx/user/add’即可 */
 9         }
10       }
11     }
12 }

2、开发/生成环境请求接口设置：

　　在config文件夹下修改dev.env.js、prod.env.js两个js文件：

1 // dev.env.js
2 
3 module.exports = merge(prodEnv, {
4   NODE_ENV: '"development"',
5   API_HOST: '"/api"' /* 开发环境的部署，有在axios封装内调用 */
6 })

 

1 // prod.env.js
2 
3 module.exports = {
4   NODE_ENV: '"production"',
5   API_HOST: '"http://xxx.xx.xxx.xx:xxxxx"' /* 生产环境需要的请求源 */
6 }

 

转载于:https://www.cnblogs.com/learnWeb-zhao/p/10607711.html