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 相关文章推荐
javascript new 需不需要继续使用
Jul 02 Javascript
js获取元素在浏览器中的绝对位置
Jul 24 Javascript
Jquery从头学起第四讲 jquery入门教程
Aug 01 Javascript
GRID拖拽行的实例代码
Jul 18 Javascript
利用jQuery实现可以编辑的表格
May 26 Javascript
js如何获取网页所有图片
May 12 Javascript
nuxt框架中路由鉴权之Koa和Session的用法
May 09 Javascript
vue element table 表格请求后台排序的方法
Sep 28 Javascript
微信小程序判断用户是否需要再次授权获取个人信息
Jul 18 Javascript
浅谈TypeScript 用 Webpack/ts-node 运行的配置记录
Oct 11 Javascript
vue+ElementUI 关闭对话框清空验证,清除form表单的操作
Aug 06 Javascript
使用纯前端JavaScript实现Excel导入导出方法过程详解
Aug 07 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数组函数序列之rsort() - 对数组的元素值进行降序排序
2011/11/02 PHP
利用PHP脚本在Linux下用md5函数加密字符串的方法
2015/06/29 PHP
PHP中Trait及其应用详解
2017/02/14 PHP
TP5框架请求响应参数实例分析
2019/10/17 PHP
jquery时间下拉框小例子
2013/04/15 Javascript
一个js控制的导航菜单实例代码
2013/12/03 Javascript
JavaScript中的some()方法使用详解
2015/06/09 Javascript
基于jQuery实现select下拉选择可输入附源码下载
2016/02/03 Javascript
简单实现JS倒计时效果
2016/12/23 Javascript
浅谈vuex之mutation和action的基本使用
2017/08/29 Javascript
Vue使用vue-cli创建项目
2017/09/01 Javascript
element 结合vue 在表单验证时有值却提示错误的解决办法
2018/01/22 Javascript
js根据需要计算数组中重复出现某个元素的个数
2019/01/18 Javascript
微信小程序项目总结之记账小程序功能的实现(包括后端)
2019/08/20 Javascript
vue路由传参页面刷新参数丢失问题解决方案
2019/10/08 Javascript
JavaScript 函数用法详解【函数定义、参数、绑定、作用域、闭包等】
2020/05/12 Javascript
仅用500行Python代码实现一个英文解析器的教程
2015/04/02 Python
Python发送以整个文件夹的内容为附件的邮件的教程
2015/05/06 Python
深入讲解Python中面向对象编程的相关知识
2015/05/25 Python
python网络编程调用recv函数完整接收数据的三种方法
2017/03/31 Python
python实现微信跳一跳辅助工具步骤详解
2018/01/04 Python
windows下安装Python虚拟环境virtualenvwrapper-win
2019/06/14 Python
用python生成与调用cntk模型代码演示方法
2019/08/26 Python
Python pandas如何向excel添加数据
2020/05/22 Python
python collections模块的使用
2020/10/16 Python
python 实现的车牌识别项目
2021/01/25 Python
HTML5 的新的表单元素(datalist/keygen/output)使用介绍
2013/07/19 HTML / CSS
求职信的要素有哪些呢
2013/12/26 职场文书
学前教育学生自荐信范文
2013/12/31 职场文书
会计主管岗位职责
2014/01/03 职场文书
企业给企业的表扬信
2014/01/13 职场文书
个人政风行风自查自纠报告
2014/10/21 职场文书
2015年销售工作总结范文
2015/03/30 职场文书
银行催款通知书
2015/04/17 职场文书
2016年小学生寒假总结
2015/10/10 职场文书
《游戏公平》教学反思
2016/02/20 职场文书