码迷,mamicode.com
首页 > 其他好文 > 详细

vue 数据请求

时间:2017-08-15 17:16:49      阅读:187      评论:0      收藏:0      [点我收藏+]

标签:let   option   qq群   接口   cte   ann   encoding   2.3   phi   

作者QQ:1095737364    QQ群:123300273     欢迎加入!
 

要引入模块: vue-resource

1.在package.json中的dependencies中添加vue-resource模块,然后安装(运行npm instal)

"dependencies": {
  "vue": "^2.3.3",
  "vue-router": "^2.6.0",
  "vue-resource":"^1.2.1"
},

2.在router路由文件夹的index 下添加如下代码:

import VueResource from ‘vue-resource‘
Vue.use(VueResource)

3.要使用请求的地方使用如下代码模板:

this.$http.get(‘/http://localhost:8080/graphicOneData‘).then(response => {
  console.log(response);
  var datas = JSON.parse(response.bodyText);
}, response => {
  console.log("error");
});
注意:
1.在请求接口数据时,涉及到跨域请求出现下面错误: 
           XMLHttpRequest cannot load http://localhost:8088/test. No ‘Access-Control-Allow-Origin’ header is present on the requested resource. Origin ‘http://localhost:8080’ is therefore not allowed access.
解决办法:
在接口中设置:
response.setHeader("Access-Control-Allow-Origin", "*");
response.setCharacterEncoding("UTF-8");
request.setCharacterEncoding("UTF-8");
response.setHeader("Access-Control-Allow-Origin", "*");
response.setHeader("Access-Control-Allow-Methods", "POST, GET, OPTIONS, DELETE");
response.setHeader("Access-Control-Max-Age", "3600");
response.setHeader("Access-Control-Allow-Headers", "x-requested-with,Authorization");
response.setHeader("Access-Control-Allow-Credentials","true");
 

vue 数据请求

标签:let   option   qq群   接口   cte   ann   encoding   2.3   phi   

原文地址:http://www.cnblogs.com/yysbolg/p/7365960.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!