文档章节

VUE下跨域设置

见就别贱
 见就别贱
发布于 2017/09/11 10:41
字数 217
阅读 40
收藏 0

##vue 跨域设置(以豆瓣为例)

  1. 在使用vue开发的时候经常要涉及到跨域的问题,其实在vue cli中是有我们设置跨域请求的文件的。
  2. 当跨域无法请求的时候我们可以修改工程下config文件夹下的index.js中的dev:{}部分。
    ``` env: require('./dev.env'),
		  	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('调用失败');
    	});

© 著作权归作者所有

共有 人打赏支持
见就别贱
粉丝 1
博文 9
码字总数 3632
作品 0
温州
私信 提问
详解Vue-cli代理解决跨域问题

使用vue-cli调接口的时候,总是会出现跨域问题,因为vue的localhost与访问域名不一致导致。而这一点,开发者显然也想到了,故而在vuejs-templates,也就是vue-cli的使用的模板插件里,有关于...

李晓艳
04/19
0
0
vue-cli创建项目,并且引入element-ui

注:本项目全部是按vue-cli3版本,旧版本有差异 1.创建项目,项目名称不能有大写字母 vue create project-name 2.进入项目目录,添加element-ui cd project-name vue add element 3.一般用v...

shatian
10/25
0
0
vue+webpack+express中间件接口使用

环境:vue 2.9.3; webpack 目的:接口的调用 跨域方式:   1、express中间的使用   2、nginx代理   3、各个浏览器跨域设置 --------------------------------------------分割线-----...

不爱贞子爱爽子
07/16
0
0
Vue2.0笔记——Ajax,JSONP跨域

Ajax实现 vue本身不支持发送AJAX请求,需要使用vue-resource、axios等插件实现。 axios是一个基于Promise的HTTP请求客户端,用来发送请求,也是vue2.0官方推荐的,同时不再对vue-resource进行...

逝岁月
04/16
0
0
vue框架搭建之axios使用教程

本文重点介绍axios如何配合vue搭建项目框架,而axios的详细使用介绍请移步 1、安装 2、引入main.js 文件引入: 3、使用 4、跨域与代理在vue本地开发时请求总是发生跨域解决方案:配置代理con...

前端攻城老湿
11/22
0
0

没有更多内容

加载失败,请刷新页面

加载更多

deepin中配置robot framework环境

本文永久更新地址:https://my.oschina.net/bysu/blog/2989005 【若要到岸,请摇船:开源中国 不最醉不龟归】 1.在终端中输入pip,回车,如果提示没有该命令,则先安转pip sudo apt-get inst...

不最醉不龟归
19分钟前
2
0
OSChina 周日乱弹 —— 钱不还,我就当你人不在了

Osc乱弹歌单(2018)请戳(这里) 【今日歌曲】 @莱布妮子 :分享Bigleaf的单曲《小鹿》 《小鹿》- Bigleaf 手机党少年们想听歌,请使劲儿戳(这里) 周日在家做什么? 做手工呀, @poorfis...

小小编辑
今天
85
3
EOS docker开发环境

使用eos docker镜像是部署本地EOS开发环境的最轻松愉快的方法。使用官方提供的eos docker镜像,你可以快速建立一个eos开发环境,可以迅速启动开发节点和钱包服务器、创建账户、编写智能合约....

汇智网教程
今天
20
0
《唐史原来超有趣》的读后感优秀范文3700字

《唐史原来超有趣》的读后感优秀范文3700字: 作者:花若离。我今天分享的内容《唐史原来超有趣》这本书的读后感,我将这本书看了一遍之后就束之高阁了,不过里面的内容一直在在脑海中回放,...

原创小博客
今天
29
0
IC-CAD Methodology知识图谱

CAD (Computer Aided Design),计算机辅助设计,指利用计算机及其图形设备帮助设计人员进行设计工作,这个定义同样可以用来近似描述IC公司CAD工程师这个岗位的工作。 早期IC公司的CAD岗位最初...

李艳青1987
今天
35
0

没有更多内容

加载失败,请刷新页面

加载更多

返回顶部
顶部