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 相关文章推荐
动态调用css文件——jquery的应用
Feb 20 Javascript
JavaScript高级程序设计 阅读笔记(二十一) JavaScript中的XML
Sep 14 Javascript
JavaScript取得鼠标绝对位置程序代码介绍
Sep 16 Javascript
jquery实现类似EasyUI的页面布局可改变左右的宽度
Sep 12 Javascript
详解js中构造流程图的核心技术JsPlumb(2)
Dec 08 Javascript
微信小程序之MaterialDesign--input组件详解
Feb 15 Javascript
jQuery zTree树插件动态加载实例代码
May 11 jQuery
js实现首屏延迟加载实现方法 js实现多屏单张图片延迟加载效果
Jul 17 Javascript
AngularJS2 与 D3.js集成实现自定义可视化的方法
Dec 01 Javascript
Vue实现active点击切换方法
Mar 16 Javascript
在create-react-app中使用sass的方法示例
Oct 01 Javascript
JavaScript展开操作符(Spread operator)详解
Jul 20 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
非洲第一个咖啡超凡杯大赛承办国—卢旺达的咖啡怎么样
2021/03/03 咖啡文化
PHP 5.0对象模型深度探索之属性和方法
2008/03/27 PHP
探讨:如何使用PHP实现计算两个日期间隔的年、月、周、日数
2013/06/13 PHP
thinkPHP5.0框架模块设计详解
2017/03/18 PHP
yii2.0整合阿里云oss的示例代码
2017/09/19 PHP
js资料prototype 属性
2007/03/13 Javascript
jQuery的实现原理的模拟代码 -3 事件处理
2010/08/03 Javascript
JQuery 拾色器插件发布-jquery.icolor.js
2010/10/20 Javascript
突发奇想的一个jquery插件
2010/11/19 Javascript
jQuery简单图表peity.js使用示例
2014/05/02 Javascript
解决js图片加载时出现404的问题
2020/11/30 Javascript
JavaScript为事件句柄绑定监听函数实例详解
2015/12/15 Javascript
JavaScipt中栈的实现方法
2016/02/17 Javascript
JS 实现Base64编码与解码实例详解
2016/11/07 Javascript
12条写出高质量JS代码的方法
2018/01/07 Javascript
详解给Vue2路由导航钩子和axios拦截器做个封装
2018/04/10 Javascript
vue.js 2.*项目环境搭建、运行、打包发布的详细步骤
2019/05/01 Javascript
Python os模块介绍
2014/11/30 Python
python使用cStringIO实现临时内存文件访问的方法
2015/03/26 Python
使用Python下载歌词并嵌入歌曲文件中的实现代码
2015/11/13 Python
python DataFrame 修改列的顺序实例
2018/04/10 Python
python 构造三维全零数组的方法
2018/11/12 Python
对Python3 goto 语句的使用方法详解
2019/02/16 Python
Pandas删除数据的几种情况(小结)
2019/06/21 Python
python pyqtgraph 保存图片到本地的实例
2020/03/14 Python
Python开发企业微信机器人每天定时发消息实例
2020/03/17 Python
Django返回HTML文件的实现方法
2020/09/17 Python
自我评价格式
2014/01/06 职场文书
小学语文教学经验交流材料
2014/06/02 职场文书
活动总结新闻稿
2014/08/30 职场文书
群众路线教育实践活动民主生活会个人检查对照思想汇报
2014/10/04 职场文书
学生上课迟到检讨书
2015/01/01 职场文书
邀请书格式范文
2015/02/02 职场文书
山楂树之恋观后感
2015/06/11 职场文书
2019年消防宣传标语集锦
2019/11/21 职场文书
vue实现可拖拽的dialog弹框
2021/05/13 Vue.js