JavaScript中发出HTTP请求最常用的方法


Posted in Javascript onJuly 12, 2018

JavaScript具有很好的模块和方法来发送可用于从服务器端资源发送或接收数据的HTTP请求。在本文中,我们将介绍一些在JavaScript中发出HTTP请求的流行方法。

Ajax

Ajax是发出异步HTTP请求的传统方式。可以使用HTTP POST方法发送数据,并使用HTTP GET方法接收数据。我们来看看发送GET请求。我将使用JSONPlaceholder,这是一个免费的在线REST API,适用于以JSON格式返回随机数据的开发人员。 要在Ajax中进行HTTP调用,您需要初始化一个新XMLHttpRequest()方法,指定URL端点和HTTP方法(在本例中为GET)。最后,我们使用该open()方法将HTTP方法和URL端点绑定在一起,并调用该send()方法来触发请求。 我们使用XMLHTTPRequest.onreadystatechange包含要在readystatechanged事件触发时调用的事件处理程序的属性将HTTP响应记录到控制台。

JavaScript中发出HTTP请求最常用的方法 

如果您查看浏览器控制台,它将返回JSON格式的数据数组。但是我们怎么知道请求是否完成了?换句话说,我们如何使用Ajax处理响应? 该onreadystatechange有两个方法,readyState 和 status允许我们可以检查请求的状态。

JavaScript中发出HTTP请求最常用的方法 

如果readyState等于4,则表示请求已完成。 除了使用JavaScript直接进行Ajax调用之外,还有其他更强大的HTTP调用方法,例如$.AjaxjQuery方法。

jQuery方法 jQuery有很多方法可以轻松处理HTTP请求。要使用这些方法,您需要在项目中包含jQuery库。

$.ajax

jQuery Ajax是进行HTTP调用的最简单方法之一。

JavaScript中发出HTTP请求最常用的方法 

$ .ajax方法需要许多参数,其中一些是必需的,另一些是可选的。它包含两个回调选项success并error处理收到的响应。

$.get方法

$.get方法用于执行GET请求。它需要两个参数:请求地址和回调函数。

JavaScript中发出HTTP请求最常用的方法 

$.post

该$.post方法是将数据发布到服务器的另一种方法。它需要三个参数:请求的url地址您要发送的数据和回调函数。

JavaScript中发出HTTP请求最常用的方法 

$.getJson

该$.getJSON方法仅检索JSON格式的数据。它需要两个参数:url和回调函数。

JavaScript中发出HTTP请求最常用的方法 

jQuery具有所有这些方法来请求或将数据发布到远程服务器。但实际上你可以将所有这些方法合而为一:$.ajax方法,如下例所示:

JavaScript中发出HTTP请求最常用的方法 

Fetch

fetch是一个新的功能强大的Web API,可以让您发出异步请求。事实上,这fetch是制作HTTP请求的最佳和最喜欢的方式之一。它返回一个“Promise”,这是ES6的一大特色。 如果你不熟悉ES6,你可以阅读一下关于ES6的文章。Promise允许我们以更智能的方式处理异步请求。我们来看看fetch技术如何运作。

JavaScript中发出HTTP请求最常用的方法 

该fetch函数需要一个必需参数:endpointURL。它还有其他可选参数,如下例所示:

JavaScript中发出HTTP请求最常用的方法 

如您所见,fetch制作HTTP请求有许多优点。此外,在fetch中还有其他模块和插件,允许我们向服务器端发送和从服务器端接收请求,例如Axios.

Axios

Axios是一个用于发出HTTP请求的开源库,并提供许多强大的功能。我们来看看它是如何工作的。

用法: 首先,您需要包含Axios。有两种方法可以在项目中包含Axios。 首先,你可以使用npm: npm install axios --save

然后你需要导入它 import axios from 'axios'

使用axios发出请求: 使用Axios,您可以使用GET和POST从服务器检索和发布数据。

JavaScript中发出HTTP请求最常用的方法 

axios采用一个必需参数,也可以采用第二个可选参数。这将一些数据作为简单查询。

POST:

JavaScript中发出HTTP请求最常用的方法 

Axios返回“Promise”。如果您熟悉promises,您可能知道promise可以执行多个请求。您可以使用axios执行相同的操作并同时运行多个请求。

Axios支持许多其他方法和选项。你可以官网了解他们

总结

以上所述是小编给大家介绍的JavaScript中发出HTTP请求最常用的方法,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对三水点靠木网站的支持!

Javascript 相关文章推荐
写自已的js类库需要的核心代码
Jul 16 Javascript
载入jQuery库的最佳方法详细说明及实现代码
Dec 28 Javascript
js运动框架_包括图片的淡入淡出效果
May 11 Javascript
javascript模块化是什么及其优缺点介绍
Sep 02 Javascript
javascript比较两个日期相差天数的方法
Jul 23 Javascript
基于js中的原型(全面讲解)
Sep 19 Javascript
vue 中swiper的使用教程
May 22 Javascript
微信{"errcode":48001,"errmsg":"api unauthorized, hints: [ req_id: 1QoCla0699ns81 ]"}
Oct 12 Javascript
Vue监听页面刷新和关闭功能
Jun 20 Javascript
小程序实现录音上传功能
Nov 22 Javascript
使用React代码动态生成栅格布局的方法
May 24 Javascript
Threejs实现滴滴官网首页地球动画功能
Jul 13 Javascript
vue实现引入本地json的方法分析
Jul 12 #Javascript
jQuery实现checkbox全选功能完整实例
Jul 12 #jQuery
JS实现将二维数组转为json格式字符串操作示例
Jul 12 #Javascript
vue路由组件按需加载的几种方法小结
Jul 12 #Javascript
js与jQuery实现获取table中的数据并拼成json字符串操作示例
Jul 12 #jQuery
使用json-server简单完成CRUD模拟后台数据的方法
Jul 12 #Javascript
教你如何用node连接redis的示例代码
Jul 12 #Javascript
You might like
PHP分页显示制作详细讲解
2006/10/09 PHP
第六节--访问属性和方法
2006/11/16 PHP
PHP原理之异常机制深入分析
2010/08/08 PHP
php使用explode()函数将字符串拆分成数组的方法
2015/02/17 PHP
详解PHP数据压缩、加解密(pack, unpack)
2016/12/17 PHP
document 和 document.all 分别什么时候用
2006/06/22 Javascript
js 页面输出值
2008/11/30 Javascript
jquery 常用操作整理 基础入门篇
2009/10/14 Javascript
Javascript四舍五入Math.round()与Math.pow()使用介绍
2013/12/27 Javascript
javascript常用代码段搜集
2014/12/04 Javascript
js实现模拟计算器退格键删除文字效果的方法
2015/05/07 Javascript
浅析Node.js中使用依赖注入的相关问题及解决方法
2015/06/24 Javascript
微信公众号开发 实现点击返回按钮就返回到聊天界面
2016/12/15 Javascript
基于jQuery实现的设置文本区域的光标位置
2018/06/15 jQuery
微信小程序与公众号实现数据互通的方法
2019/07/25 Javascript
Vue中的this.$options.data()和this.$data用法说明
2020/07/26 Javascript
vue+element_ui上传文件,并传递额外参数操作
2020/12/05 Vue.js
python写的一个squid访问日志分析的小程序
2014/09/17 Python
Python捕捉和模拟鼠标事件的方法
2015/06/03 Python
numpy中索引和切片详解
2017/12/15 Python
python3+selenium实现qq邮箱登陆并发送邮件功能
2019/01/23 Python
浅谈python的输入输出,注释,基本数据类型
2019/04/02 Python
python 实现检验33品种数据是否是正态分布
2019/12/09 Python
Python实现验证码识别
2020/06/15 Python
Python基于xlrd模块处理合并单元格
2020/07/28 Python
HTML4和HTML5之间除了相似以外的10个主要不同
2012/12/13 HTML / CSS
名词解释WEB SERVICE,SOAP,UDDI,WSDL,JAXP,JAXM;JSWDL开发包的介绍。
2012/10/27 面试题
实习医生自我评价
2013/09/22 职场文书
医学毕业生自我鉴定
2013/10/30 职场文书
大学生应聘推荐信范文
2013/11/19 职场文书
大学生四年生活自我鉴定
2013/11/21 职场文书
幼儿园保育员责任书
2014/07/22 职场文书
2014年大学生党员评议表自我评价
2014/09/20 职场文书
2014年最新个人对照检查材料范文
2014/09/25 职场文书
列车乘务员工作不细心检讨书
2014/10/07 职场文书
奖金申请报告模板
2015/05/15 职场文书