首先,简单介绍下,get和post请求方法,综合以往笔记,现整理如下:

.HTTP请求比较:

两种在客户端和服务器端进行请求-响应的方法是:GET和POST。

  • GET - 从指定的资源请求数据
  • POST - 向指定的资源提交要处理的数据

GET 基本上用于从服务器获得(取回)数据。注释:GET 方法可能返回缓存数据。

POST 也可用于从服务器获取数据。不过,POST 方法不会缓存数据,并且常用于连同请求一起发送数据。

借鉴网上的图文解析!

 二HTTP 请求定义和方法

1.Ajax方法

根据响应的不同的 MIME 类型,传递给 success 回调函数的返回数据也有所不同,这些数据可以是 XML 根元素、文本字符串、JavaScript 文件或者 JSON 对象。也可向 success 回调函数传递响应的文本状态。

$.ajax({
type: 'POST',
url: url,
data: data,
success: success,
dataType: dataType
}); 1.Axios方法 前提下载好axios,import引入需要页面。
httpPost: function (url, data, callBack) {
axios.defaults.timeout = 9000
data.token = this.getToken()
data = qs.stringify(data)
console.log('---data=' + data)
axios.post(url, data, {'xhrFields': {withCredentials: true}, crossDomain: true}).then(function (response) {
let data = response.data
if (data.code === 1) {
callBack(data.data)
} else {
Toast(data.msg)
}
}).catch(function (error) {
console.log(JSON.stringify(error))
})
},

httpGet: function (url, callBack) {
axios.defaults.timeout = 3000
url = url + 'token=' + this.getToken()
console.log('geturl=' + url)
axios.get(url).then(function (response) {
if (response.status === 200) {
let data = response.data
if (data.code === 1) {
callBack(data.data)
} else {
Toast(data.msg)
}
}
}).catch(function (error) {
console.log(error)
})
},
新建一个Js文件,写好方法,在各个页面需要时调用, 增加代码的重复利用。以上仅为个人浅谈,不足之处还望大家留言批评指正,谢谢!

前端get和post那些事的更多相关文章

  1. 什么是web前端开发?

    Web前端开发工程师,主要职责是利用(X)HTML/CSS/JavaScript/Flash等各种Web技术进行客户端产品的开发.完成客户端程序(也就是浏览器端)的开发,开发JavaScript以及F ...

  2. SPA那点事

    前端猿一天不学习就没饭吃了,后端猿三天不学习仍旧有白米饭摆于桌前.IT行业的快速发展一直在推动着前端技术栈在不断地更新换代,前端的发展成了互联网时代的一个缩影.而单页面应用的发展给前端猿分了一杯羹. ...

  3. Reactjs-JQuery-Vuejs-Extjs-Angularjs对比

    写在前面 前端越来越混乱了,当然也可以美其名曰:繁荣. 当新启动一个前端项目,第一件事就是纠结:使用什么框架,重造什么轮子? 那么,希望看完此篇,能够给你一个清晰的认识,或者让你更加地纠结和无所适从 ...

  4. 浅析angular,react,vue.js jQuery使用区别

    前端越来越混乱了,当然也可以美其名曰:繁荣.当新启动一个前端项目,第一件事就是纠结:使用什么框架,重造什么轮子? PS:大牛留言讨论那么,希望看完此篇,能够给你一个清晰的认识,或者让你更加地纠结和无所 ...

  5. css hack整理:区别FF,IE8,IE7,IE6,SF,CH浏览器

    css hack整理:区别FF,IE8,IE7,IE6,SF,CH浏览器 2013年03月24日 ⁄ CSS ⁄ 共 716字 ⁄ 暂无评论         前端开发最要命的事就是处理浏览器的兼容性问 ...

  6. XSS 漏洞原理及防御方法

    XSS跨站脚本攻击:两种情况.一种通过外部输入然后直接在浏览器端触发,即反射型XSS:还有一种则是先把利用代码保存在数据库或文件中,当web程序读取利用代码并输出在页面上时触发漏洞,即存储型XSS.D ...

  7. Reactjs-JQuery-Omi-Extjs-Angularjs对比

    写在前面 前端越来越混乱了,当然也可以美其名曰:繁荣. 当新启动一个前端项目,第一件事就是纠结:使用什么框架,重造什么轮子? 那么,希望看完此篇,能够给你一个清晰的认识,或者让你更加地纠结和无所适从 ...

  8. js的视频和音频采集

    js的视频和音频采集 今天要写的,不是大家平时会用到的东西.因为兼容性实在不行,只是为了说明下前端原来还能干这些事. 大家能想象前端是能将摄像头和麦克风的视频流和音频流提取出来,再为所欲为的么.或者说 ...

  9. 【javascript/css】关于鼠标事件onmousexxx和css伪类hover

    在运用鼠标移入移出事件时,一般有两种做法,一种是DOM事件的"onmouseover"和"onmouseout",还有一种是css的伪类":hover ...

随机推荐

  1. java设计模式7.策略模式、模板方法模式、观察者模式

    策略模式 策略模式的用意,将每一个算法封装到具有共同接口的独立的类中,从而使得它们可以相互替换.策略模式使得算法可以在不影响到客户端的情况下发生变化. 环境角色:持有一个抽象策略角色的引用. 抽象策略 ...

  2. NLP(八) 创建自然语言处理管道

    一条管道可以被看作一个多阶段的数据流系统,其中一个组件的输出被视为另一个组件的输入 管道特点: 数据始终从一个组件流向另一个组件 组件是一个只考虑输入和输出数据的黑盒 NLP管道应有的功能: 采集输入 ...

  3. effective java 3th item2:考虑 builder 模式,当构造器参数过多的时候

    yiaz 读书笔记,翻译于 effective java 3th 英文版,可能有些地方有错误.欢迎指正. 静态工厂方法和构造器都有一个限制:当有许多参数的时候,它们不能很好的扩展. 比如试想下如下场景 ...

  4. Codeforces 832 D Misha, Grisha and Underground

    Misha, Grisha and Underground 题意:Misha 和 Grisha 是2个很喜欢恶作剧的孩子, 每天早上 Misha 会从地铁站 s 通过最短的路到达地铁站 f, 并且在每 ...

  5. 背包形动态规划 fjutoj1380 Piggy-Bank

    Piggy-Bank TimeLimit: 2000/1000 MS (Java/Others)  MemoryLimit: 65536/32768 K (Java/Others) 64-bit in ...

  6. 计蒜客 ACM训练联盟周赛 第一场 Alice和Bob的Nim游戏 矩阵快速幂

    题目描述 众所周知,Alice和Bob非常喜欢博弈,而且Alice永远是先手,Bob永远是后手. Alice和Bob面前有3堆石子,Alice和Bob每次轮流拿某堆石子中的若干个石子(不可以是0个), ...

  7. poj 1797Heavy Transportation(dijkstra变形)

    题目链接:http://poj.org/problem?id=1797 题意:有n个城市,m条道路,在每条道路上有一个承载量,现在要求从1到n城市最大承载量,而最大承载量就是从城市1到城市n所有通路上 ...

  8. 深入浅出TypeScript(5)- 在React项目中使用TypeScript

    前言 在第二小节中,我们讨论了利用TypeScript创建Web项目的实现,在本下节,我们讨论一下如何结合React创建一个具备TypeScript类型的应用项目. 准备 Webpack配置在第二小节 ...

  9. 反射,Expression Tree,IL Emit 属性操作对比

    .net的反射(Reflection) 是.Net中获取运行时类型信息的一种方法,通过反射编码的方式可以获得 程序集,模块,类型,元数据等信息. 反射的优点在于微软提供的API调用简单,使用方便: 表 ...

  10. 动态设置 view 在布局中位置

    一.概述 有时项目需要动态设置一个 底部列表,比如 popupwindow ,listview 底部显示 ,所以记录一下 此处, android.support.v7.widget.CardView ...