跨域问题:是指当你的请求路径中协议、域名、端口号任意一个不同时会产生的问题。
比如你的请求路径为:http://iwenwiki.com/api/FingerUnion/list.php
协议:挂在路径最前面的http即为协议(也可能是https)
域名:iwenwiki.com即为域名(一般在协议之后,api或数据之前)
端口号:默认端口号是8080(一般不变)
跨域问题页面的配置
<template>
<div>
<h3 @click="c">跨域问题解决方案</h3>
</div>
</template>
<script>
import axios from 'axios'
export default {
methods: {
c() {
axios.get("/api/FingerUnion/list.php")
.then(res => {
console.log(res.data)
})
}
}
}
</script>
vue.config.js的配置
module.exports = {
devServer: {
proxy: { //配置跨域
'/api': {
target: 'http://iwenwiki.com', //这里应该填写你们真实的后台接口
ws: true,
changOrigin: true, //允许跨域
pathRewrite: {
'^/api/FingerUnion/list.php': '' //请求的时候使用这个api就可以
}
}
}
}
}