Vue的反向代理
vue脚手架模式开发,需要请求后端接口数据时,会有跨域的问题,由于vue-cli模式前端包本身已经被映射为了域名的形式,所以我们需要配置反向代理。官方配置说明:配置参考 | Vue CLIvue项目根目录下创建vue.config.js文件,配置反向代理(每次更改配置文件需要重启本地服务)module.exports = {lintOnSave: false,//关闭每次保存都进行检测//开发环境
·
vue脚手架模式开发,需要请求后端接口数据时,会有跨域的问题,由于vue-cli模式前端包本身已经被映射为了域名的形式,所以我们需要配置反向代理。
官方配置说明:配置参考 | Vue CLI
vue项目根目录下创建vue.config.js文件,配置反向代理(每次更改配置文件需要重启本地服务)
module.exports = {
lintOnSave: false,//关闭每次保存都进行检测
//开发环境反向代理配置
devServer: {
proxy: {
'/ajax': {
target: 'https://m.maoyan.com',
changeOrigin: true,
}
}
}
}
请求时将域名https://m.maoyan.com替换为 /ajax.
<script>
import axios from 'axios'
export default {
name: 'Home',
mounted () {
axios.get('/ajax/movieOnInfoList?token=&optimus_uuid=1A82A650175D11EC8F2F450EB31CB83E4509523F695C47009B15CC19CD8FD9F7&optimus_risk_level=71&optimus_code=10')
.then(res => {
console.log(res)
}).catch(res => {
})
}
}
</script>
完成以上配置,重启服务 npm run start 看效果:
更多推荐
已为社区贡献3条内容
所有评论(0)