vue下跨域设置的相关介绍


Posted in Javascript onAugust 26, 2017

本文介绍了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('调用失败');
  });

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

Javascript 相关文章推荐
jquery autocomplete自动完成插件的的使用方法
Aug 07 Javascript
使用Math.floor与Math.random取随机整数的方法详解
May 07 Javascript
javascript制作网页图片上实现下雨效果
Feb 26 Javascript
JavaScript动态添加style节点的方法
Jun 09 Javascript
全面解析Bootstrap中scrollspy(滚动监听)的使用方法
Jun 06 Javascript
jquery.Callbacks的实现详解
Nov 30 Javascript
jquery仿ps颜色拾取功能
Mar 08 Javascript
jQuery发请求传输中文参数乱码问题的解决方案
May 22 jQuery
vue实现codemirror代码编辑器中的SQL代码格式化功能
Aug 27 Javascript
初学vue出现空格警告的原因及其解决方案
Oct 31 Javascript
js实现时分秒倒计时
Dec 03 Javascript
JavaScript实现简单图片切换
Apr 29 Javascript
客户端(vue框架)与服务器(koa框架)通信及服务器跨域配置详解
Aug 26 #Javascript
微信小程序实现顶部普通选项卡效果(非swiper)
Jun 19 #Javascript
微信小程序实现顶部选项卡(swiper)
Jun 19 #Javascript
js实现本地时间同步功能
Aug 26 #Javascript
基于jQuery实现图片推拉门动画效果的两种方法
Aug 26 #jQuery
Javascript快速实现浏览器系统通知
Aug 26 #Javascript
深入浅出es6模板字符串
Aug 26 #Javascript
You might like
php调用MySQL存储过程的方法集合(推荐)
2013/07/03 PHP
教你如何开启shopnc b2b2c 伪静态
2014/10/21 PHP
PHP+MySQL修改记录的方法
2015/01/21 PHP
PHP消息队列用法实例分析
2016/02/12 PHP
laravel中的一些简单实用功能
2018/11/03 PHP
ASP中用Join和Array,可以加快字符连接速度的代码
2007/08/22 Javascript
网页编辑器ckeditor和ckfinder配置步骤分享
2012/05/24 Javascript
原生JavaScript实现合并多个数组示例
2014/09/21 Javascript
node.js中的buffer.copy方法使用说明
2014/12/14 Javascript
jQuery实现的分子运动小球碰撞效果
2016/01/27 Javascript
JS组件Bootstrap Table布局详解
2016/05/27 Javascript
jQuery实现底部浮动窗口效果
2016/09/07 Javascript
基于JavaScript实现移动端无限加载分页
2017/03/27 Javascript
Bootstrap table表格初始化表格数据的方法
2018/07/25 Javascript
vue双向绑定及观察者模式详解
2019/03/19 Javascript
Vue-CLI 项目在pycharm中配置方法
2019/08/30 Javascript
小程序实现投票进度条
2019/11/20 Javascript
JS实现的定时器展示简单秒表、页面弹框及跳转操作完整示例
2020/01/26 Javascript
如何在VUE中使用vue-awesome-swiper
2021/01/04 Vue.js
[02:45]DOTA2英雄敌法师基础教程
2013/11/25 DOTA
python通过定义一个类实例作为ftp回调方法
2015/05/04 Python
python批量修改文件夹及其子文件夹下的文件内容
2019/03/15 Python
python 字符串常用方法汇总详解
2019/09/16 Python
python实现通过队列完成进程间的多任务功能示例
2019/10/28 Python
Html5游戏开发之乒乓Ping Pong游戏示例(三)
2013/01/21 HTML / CSS
详解canvas绘制多张图的排列顺序问题
2019/01/21 HTML / CSS
AmazeUI 折叠面板的实现代码
2020/08/17 HTML / CSS
小米旗下精品生活电商平台:小米有品
2018/12/18 全球购物
String s = new String(“xyz”);创建了几个String Object?
2015/08/05 面试题
办公室文书岗位职责
2013/12/16 职场文书
致铅球运动员加油稿
2014/02/13 职场文书
班级团队活动方案
2014/08/14 职场文书
2014院党委领导班子及其成员群众路线对照检查材料思想汇报
2014/10/04 职场文书
2014年客房部工作总结
2014/11/22 职场文书
2016学校先进集体事迹材料
2016/02/29 职场文书
2016年公共机构节能宣传周活动总结
2016/04/05 职场文书