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 相关文章推荐
js如何判断用户是在PC端和还是移动端访问
Apr 24 Javascript
浅析javascript操作 cookie对象
Dec 26 Javascript
jQuery实现在textarea指定位置插入字符或表情的方法
Mar 11 Javascript
基于jquery实现复选框全选,反选,全不选等功能
Oct 16 Javascript
jQuery.Callbacks()回调函数队列用法详解
Jun 14 Javascript
基于JavaScript实现Tab选项卡切换效果
Nov 24 Javascript
微信小程序商城项目之淘宝分类入口(2)
Apr 17 Javascript
老生常谈angularjs中的$state.go
Apr 24 Javascript
详解vue-cli下ESlint 配置说明
Sep 03 Javascript
微信小程序自定义组件的实现方法及自定义组件与页面间的数据传递问题
Oct 09 Javascript
简述vue路由打开一个新的窗口的方法
Nov 29 Javascript
vue-router的hooks用法详解
Jun 08 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脚本数据库功能详解(中)
2006/10/09 PHP
PHP输出日历表代码实例
2015/03/27 PHP
php结合ajax实现手机发红包的案例
2016/10/13 PHP
JS 用6N±1法求素数 实例教程
2009/10/20 Javascript
用innerhtml提高页面打开速度的方法
2013/08/02 Javascript
深入分析JSONP跨域的原理
2014/12/10 Javascript
js根据手机客户端浏览器类型,判断跳转官网/手机网站多个实例代码
2016/04/30 Javascript
Angular的$http与$location
2016/12/26 Javascript
Vue.js系列之项目搭建(1)
2017/01/03 Javascript
Nodejs 发送Post请求功能(发短信验证码例子)
2017/02/09 NodeJs
解决Node.js使用MySQL出现connect ECONNREFUSED 127.0.0.1:3306的问题
2017/03/09 Javascript
微信小程序中做用户登录与登录态维护的实现详解
2017/05/17 Javascript
Vue computed计算属性的使用方法
2017/07/14 Javascript
JS简单实现点击跳转登陆邮箱功能的方法
2017/10/31 Javascript
从0到1搭建element后台框架优化篇(打包优化)
2019/05/12 Javascript
JS实现选项卡效果的代码实例
2019/05/20 Javascript
详解Vue后台管理系统开发日常总结(组件PageHeader)
2019/11/01 Javascript
layui清除radio的选中状态实例
2019/11/14 Javascript
JS实现放大镜效果
2020/09/21 Javascript
[06:13]DOTA2进化论(修改版)
2013/10/08 DOTA
[06:11]2014DOTA2国际邀请赛 专访团结一心的VG战队
2014/07/21 DOTA
Python3基础之条件与循环控制实例解析
2014/08/13 Python
python3 与python2 异常处理的区别与联系
2016/06/19 Python
Python re 模块findall() 函数返回值展现方式解析
2019/08/09 Python
python识别文字(基于tesseract)代码实例
2019/08/24 Python
Django 创建后台,配置sqlite3教程
2019/11/18 Python
PyQt5高级界面控件之QTableWidget的具体使用方法
2020/02/23 Python
python GUI库图形界面开发之PyQt5美化窗体与控件(异形窗体)实例
2020/02/25 Python
基于django2.2连oracle11g解决版本冲突的问题
2020/07/02 Python
EJB发布WEB服务一般步骤
2012/10/31 面试题
求职信范文怎么写
2014/01/29 职场文书
维稳承诺书
2015/01/20 职场文书
好好学习保证书
2015/02/26 职场文书
关于分班的感言
2015/08/04 职场文书
教你如何使用Python Tkinter库制作记事本
2021/06/10 Python
新的CSS 伪类函数 :is() 和 :where()示例详解
2022/08/05 HTML / CSS