如何解决vue跨域本地
本次分享适合刚开始做项目的小伙伴们,在项目开发的的过程中我们会进行数据对接(对接接口),我们会遇到跨域的问题,下面我来分享一下我是怎么解决的,希望对你有所帮助。
废话不多说,直接上操作:
安装axios
(处理数据请求)
npm i axios -S
在 main.js 中添加如下代码:
import axios from 'axios' // 挂在到全局 Vue.prototype.$axios=axios;
在package.json
的同级新建一个vue.config.js
文件,添加如下代码:
// vue.config.js module.exports = { devServer: { proxy: { '/api': { target: 'http://192.168.0.109:3000', // 后台请求地址 ws: true, changeOrigin: true, pathRewrite: { '^/api': '' //通过 pathRewrite 重写地址,将前缀/api 转为/ } } } } }
我们在 vue 模板中如何使用呢?
// 在 mounted 中添加如下代码: this.$axios.post("/pai/mybj").then(res=>{ console.log(res); })
这样我们就可以输出请求到后台的数据啦。
声明:本站所有文章,如无特殊说明或标注,均为本站原创发布。任何个人或组织,在未征得本站同意时,禁止复制、盗用、采集、发布本站内容到任何网站、书籍等各类媒体平台。如若本站内容侵犯了原著者的合法权益,可联系我们进行处理。
码云笔记 » 如何解决vue跨域本地
码云笔记 » 如何解决vue跨域本地