Vue 如何解决跨域请求数据
首先vue如何请求数据呢？解决跨域问题友情链接：365淘券吧首先vue如何请求数据呢？
vue 请求数据我采用了 axios第一步： 打开cmd 进入到vue的项目目录 然后执行下面的命令安装axios
npm install axios
第二步： 配置axios 首先打开项目的main.js 导入axios，添加以下代码
import axios from 'axios'Vue.prototype.$axios = axios;
如果不跨域此时的请求接口代码如下：
const that = this;this.$axios.get("/dic/list")//假如此时的vue项目的端口是8081，//此时访问地址是http://localhost:8081/dic/list ,目前的请求数据没有跨域.then(function(response) {console.log(response.data);that.tableData = response.data;}).catch(function(error) {console.info(error);});
解决跨域问题
第一步：打开config的index.js ，找到proxyTable ，设置一下代码
proxyTable: {'/api':{target:'http://localhost:8888/school/', //跨域接口的端口是8888changeOrigin:true,//允许跨域pathRewrite:{'^/api':''}}},
第二步：打开main.js 继续设置 添加下面的代码
axios.defaults.baseURL = '/api'
第三步：重启项目 重新运行 （必须重启！！！）
npm run dev
第四步：请求代码和上面的一样
const that = this;this.$axios.get("/dic/list")此时的vue项目的端口是8081//此时访问地址是http://localhost:8081/api/dic/list //但实际请求的是http://localhost:8888/school/dic/list.then(function(response) {console.log(response.data);that.tableData = response.data;//赋值}).catch(function(error) {console.info(error);});
以上就是解决vue跨域请求数据的问题。
友情链接：365淘券吧
友情链接: 365淘券吧
