Vue 跨域配置的解决办法
5星
- 浏览量: 0
- 大小:None
- 文件类型：None
简介：
本文详细介绍了如何在Vue项目中解决跨域问题的各种方法和技巧，帮助开发者顺利实现前后端分离开发。
在使用 Vue 开发过程中经常会遇到跨域问题，在 Vue CLI 中有一个设置跨域请求的文件可以进行配置。
当出现无法跨域访问的情况时，可以在项目下的 `config` 文件夹中的 `index.js` 文件中修改 `dev: {}` 部分。具体如下：
```javascript
dev: {
env: require(./dev.env),
port: 8080,
autoOpenBrowser: false,
assetsSubDirectory: static,
assetsPublicPath: /,
proxyTable: {
/api: {
target: http://api.douban.com/v2, // 将target设置为我们需要访问的域名
changeOrigin: true,
pathRewrite: { ^/api: }
}
},
cssSourceMap: false
}
```
然后在 `main.js` 中添加全局属性：
```javascript
Vue.prototype.HOST = /api
```
至此，就可以在整个项目中使用这个域名了。例如：
```javascript
var url = this.HOST + /movie/in_theaters;
this.$http.get(url).then(res => {
this.movieList = res.data.subjects;
},res => {
console.info(调用失败);
});
```
全部评论 (0)
