JavaScript

超轻量级php框架startmvc

vue下跨域设置的相关介绍

更新时间:2020-06-01 13:48:01 作者:startmvc
本文介绍了vue下跨域设置的相关介绍,分享给大家,具体如下:1、在使用vue开发的时候经常

本文介绍了vue下跨域设置的相关介绍,分享给大家,具体如下:

1、在使用vue开发的时候经常要涉及到跨域的问题,其实在vue cli中是有我们设置跨域请求的文件的。

2、当跨域无法请求的时候我们可以修改工程下config文件夹下的index.js中的dev:{}部分。


dev: {

 env: require('./dev.env'),
 port: 8080,
 autoOpenBrowser: false,
 assetsSubDirectory: 'static',
 assetsPublicPath: '/',
 proxyTable: {
 '/api': {
 target: 'http://api.douban.com/v2',
 changeOrigin: true,
 pathRewrite: {
 '^/api': ''
 }
 }
 },
 // CSS Sourcemaps off by default because relative paths are "buggy"
 // with this option, according to the CSS-Loader README
 // (https://github.com/webpack/css-loader#sourcemaps)
 // In our experience, they generally work as expected,
 // just be aware of this issue when enabling this option.
 cssSourceMap: false
}

将target设置为我们需要访问的域名。

3、然后在main.js中设置全局属性:


Vue.prototype.HOST = '/api'

4、至此,我们就可以在全局使用这个域名了,如下:


var url = this.HOST + '/movie/in_theaters'
 this.$http.get(url).then(res => {
 this.movieList = res.data.subjects;
 },res => {
 console.info('调用失败');
 });

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持脚本之家。

vue 跨域设置 vue设置跨域 vue跨域