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

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

vue加跨域代理静态文件404_vue-cli 设置跨域代理线上地址报404
vue-cli 设置跨域代理,本地正常访问,线上地址报404.这是什么原因? vue-cli中跨域代理设置: module.exports = { dev: { // Paths assetsSubD ...
KONG （API网关）用CORS处理跨域，针对：非简单请求
研究了挺久的,从不知道什么是跨域到最终解决问题. 简单说,会产生跨域的异常主要是当前页面域名与页面内直接请求的域名不是同一个域,浏览器就是拦截这种它认为不安全的操作首先必须明确一点:跨域有两种(1. ...
vue cli 解决跨域线上 nginx 反向代理配置
前后分离 axios 接 api 跨域问题如图: 解决办法: 1. npm start 本地开发环境解决: 在webpack配置文件 /config/index.js 里找到 proxyTable 开 ...
vue加跨域代理静态文件404_解决vue本地环境跨域请求正常，版本打包后跨域代理不起作用，请求不到数据的方法——针对vue2.0...
问题:在本地使用了proxyTable代理可以正常跨域请求后台数据,打包上传后就无法获得后台的json文件.查看了相关资料可以用nginx进行解决.还可以使用命名环境变量,请求的时候进行判断,话不多说 ...
iview-cli 设置跨域代理服务器
1.打开 webpack.dev.config.js 2.//设置跨域代理 devServer: { historyApiFallback: true, hot: true, inline: true ...
vue如何配置服务器端跨域_vue开发环境配置跨域，一步到位
本文要实现的是:使用vue-cli搭建的项目在开发时配置跨域,上线后不做任何任何修改,接口也可以访问阅读时间需要三分钟 production:产品生产环境 development:开发开发环境 ...
vue脚手架解决跨域问题-------配置反向代理
vue脚手架解决跨域问题-------配置反向代理参考文章: (1)vue脚手架解决跨域问题-------配置反向代理 (2)https://www.cnblogs.com/zbx-boke/p/9 ...
vue-cli2.x统一配置接口请求地址和开发环境的跨域代理
1.修改config/dev.env.js(开发环境的baseURL地址统一配置) 2.修改config/prod.env.js(线上环境的baseURL地址统一配置) 3.修改config/inde ...
服务器为C#开发，aspx设置跨域请求
aspx设置跨域请求最近想用hbuilder把项目转成app,要请求之前的服务器,所以遇到个跨域问题,查了很多资料终于搞定了... 在服务器aspx页面头文件里加: <meta http-eq ...

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

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

最新文章

热门文章