vue中axios使用二:axios以post,get,jsonp的方式请求后台数据
本文为博主原创,转载请注明出处
axios在上一篇中讲过:vue中axios使用一:axios做拦截器,axios是请求后台资源的模块,用来请求后台资源。
axios本身是支持get,post请求后台数据,示例如下:
post方式:
axios.post('/user', {
firstName: 'Fred',
lastName: 'Flintstone'
})
.then(function (response) {
console.log(response);
})
.catch(function (error) {
console.log(error);
});
get方式:
axios.get('/user?ID=12345')
.then(function (response) {
console.log(response);
})
.catch(function (error) {
console.log(error);
});
axios不支持jsonp的方式,在网上搜寻了很多的方式,找到一个可以使用jsonp在前端跨域请求的一个方法,特此记录
axios不支持jsonp,因为axios的作者觉得jsonp不太友好,推荐用CORS方式更为干净,但是jsonp支持范围更加广阔一些,
一些老式的IE浏览器也能支持,所以有些公司还是jsonp用的多些,那么如果要使用jsonp,可以独立安装
npm i jsonp --save-dev 然后在页面中引用import jsonp from 'jsonp',使用方式也是非常简单的:
jsonp(config.ajaxUrl + '路径', null, (err, data) => {
if (err) {
console.error(err.message);
} else {
if (data.list.length > 0) {
data.list.map((item) => this.list.push(item))
console.log(data);
}
}
})
vue中axios使用二:axios以post,get,jsonp的方式请求后台数据的更多相关文章
- Vue 使用 axios post请求后台数据时 404
今天遇到Vue 使用 axios post请求后台数据时 404 使用postman 就能获取到 网上找了大半天 终于找到了解决方法,传送门:https://www.jianshu.com/p/b10 ...
- jquery中ajax请求后台数据成功后既不执行success也不执行error解决方法
jquery中ajax请求后台数据成功后既不执行success也不执行error,此外系统报错:Uncaught SyntaxError: Unexpected identifier at Objec ...
- vue 请求后台数据2(copy)
https://blog.csdn.net/vergilgeekopen/article/details/68954940 需要引用vue-resource 安装请参考https://github.c ...
- 在vue中实现扫描二维码跳转页面
文字少的博文不允许发布到网站首页.文字少的博文不允许发布到网站首页.文字少的博文不允许发布到网站首页.文字少的博文不允许发布到网站首页.文字少的博文不允许发布到网站首页.文字少的博文不允许发布到网站首 ...
- vue中,写在methods里的B方法去调A方法的数据,访问不到?
今天在写项目的时候,发现了一个京城性忽略的问题,在vue的methods的方法里面定义了两个方法,如下: getTaskList() { api.growthDetails.taskList({ ap ...
- vue 请求后台数据 (copy)
https://www.cnblogs.com/calledspeed001/p/7094494.html var that=this get请求 that.$http.get("1.txt ...
- Vue中实现与后台的数据交换(vue-resource)
vue-resource是Vue.js的一款插件,它可以通过XMLHttpRequest或JSONP发起请求并处理响应.(但是目前它已经停止更新了) 1.在vue中安装vue-resource插件 打 ...
- vue中axios使用封装
一.在main.js导入 // 引入axios,并加到原型链中 import axios from 'axios'; Vue.prototype.$axios = axios; import QS f ...
- Vue(项目踩坑)_解决vue中axios请求跨域的问题
一.前言 今天在做项目的时候发现axios不能请求跨域接口 二.主要内容 1.之前直接用get方式请求聚合数据里的接口报错如下 2.当前请求的代码 3.解决方法 (1)在项目目录中依次找到:confi ...
随机推荐
- 微服务——SpringCloud(Eureka注册中心搭建)
IDE:IDEA,说实话,真不怎么喜欢用Eclipse这个IDE,太锻炼人了 配置模式:Grandle 微服务框架:SpringCloud 第一步 创建一个Spring Initializr项目 第二 ...
- postgresql9.5编译安装体验
实验环境: centos7.6 pgsql9.5 源码编译安装 实验目的: 体验源码编译安装pgsql 01.download https://ftp.postgresql.org/pub/sourc ...
- Hadoop-HA集群搭建-rehl7.4
Hadoop-HA集群搭建-rehl7.4 hadoop 无说明需要登录其它机器操作,都是在集群的HD-2-101上执行的命令. 所有安装包地址:百度网盘,提取码:24oy 1. 基础环境配置 1.1 ...
- ansible之REPLACE模块
> REPLACE (/usr/lib/python2.7/site-packages/ansible/modules/files/replace.py) This module will re ...
- SpringBoot——报错总结
前言 记录SpringBoot的相关报错信息 错误 无法引入@ResponseBody和@RequestMapping("/") <dependency> <gr ...
- Spring中AOP方式实现多数据源切换
作者:suroot spring动态配置多数据源,即在大型应用中对数据进行切分,并且采用多个数据库实例进行管理,这样可以有效提高系统的水平伸缩性.而这样的方案就会不同于常见的单一数据实例的方案,这就要 ...
- NSSting NSData 与字符集合
NSString 是为了人类阅读而存在的,必须进行编码,以使得bytes对人类有意义 String Objects An NSString object encodes a Unicode-compl ...
- 函数式编程—函数的关系—is-a、has-a、use-a
is-a:函数的实现与函数类型的关系: has-a:匿名(闭包)函数的创建者与匿名函数的关系:匿名函数与环境和上下文(函数)的关系: use-a:高阶函数与参量函数的关系: 函数式编程的基本功之一就是 ...
- Sam小结和模板
Sam 的一些总结 注意在子串在某个节点的性质,其 father 上也会有相同的性质 1. 统计子串出现的次数 在 \(parent\) 树上做 \(dp\),对于每一个节点,初始化为 \(dp[i] ...
- K-string HDU - 4641 (后缀自动机)
K-string \[ Time Limit: 2000 ms\quad Memory Limit: 131072 kB \] 题意 给出长度为 \(n\) 的字符串,接下来跟着 \(m\) 次操作, ...