vue中的跨域代理
来源:互联网 发布:剑灵洪门崛起进阶数据 编辑:程序博客网 时间:2024/06/01 17:45
在config文件夹中的index.js设置pxoxyTable
dev: { env: require('./dev.env'), port: process.env.PORT || 8088, autoOpenBrowser: false, assetsSubDirectory: 'static', assetsPublicPath: '/', proxyTable: { '/list': { target: 'https://jsonplaceholder.typicode.com/',//设置你调用的接口域名和端口号 别忘了加http changeOrigin: true, pathRewrite: { '^/list': '/' // 这里理解成用‘/api’代替target里面的地址,后面组件中我们掉接口时直接用api代替 比如我要调用'http://40.00.100.100:3002/user/add',直接写‘/api/user/add’即可 } } }, // CSS Sourcemaps off by default because relative paths are "buggy" // with this option, according to the CSS-Loader README // (https://github.com/webpack/css-loader#sourcemaps) // In our experience, they generally work as expected, // just be aware of this issue when enabling this option. cssSourceMap: false }
在组件的js引用
const self = this; self.$axios.post('/list/posts').then((response) => { console.log(response.data); });
注意请求的地址是localhost:8080/list/posts/, 代理的是https://jsonplaceholder.typicode.com/list/posts
对于请求不到数据,如果代理设置正确,就是地址写错啦,如何验证是代理写错啦,还是请求地址写错了,用本地的ip替代要请求后台的ip地址
eg:http://localhost:8088/list/posts
代替https://jsonplaceholder.typicode.com/posts/看是否有数据
注意是/list/posts,而不是/posts
阅读全文
0 0
- vue中的跨域代理
- vue proxyTable 接口跨域请求调试(代理)
- vue-cli项目本地代理实现跨域请求
- Vue.js代理设置解决跨域问题
- 通过vue dev和nginx反向代理实现跨域
- vue cli+axios踩坑记录+拦截器使用,代理跨域proxy(更新)
- Vue 2.x 如何利用proxyTable实现跨域请求(反向代理)
- vue cli+axios踩坑记录+拦截器使用,代理跨域proxy(更新)
- vue.js使用代理和使用Nginx来解决跨域问题
- 使用vue-cli+axios配置代理进行跨域访问数据
- vue反向代理配置
- vue 代理连接配置
- vue nginx反向代理配置
- vue-cli 接口代理配置
- VUE:跨域设置
- Vue跨域问题
- vue跨域请求
- Vue跨域请求
- 模板:公式
- linux 工作常用命令
- Java基础——volatile关键字解析
- 常用注解
- 宏函数
- vue中的跨域代理
- 库文件
- 1125. Chain the Ropes (25) 贪心
- JAVA如何使用Dom4j解析xml的DEMO案例
- jy-大佬作业(3)
- 三个水杯 搜索
- 习题7.1
- Spark中的checkpoint作用与用法
- [HDU