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 相关文章推荐
JavaScript中的apply()方法和call()方法使用介绍
Jul 25 Javascript
浏览器加载、渲染和解析过程黑箱简析
Nov 29 Javascript
解决js中window.open弹出的是上次的缓存页面问题
Dec 29 Javascript
js设置文本框中焦点位置在最后的示例代码(简单实用)
Mar 04 Javascript
对JavaScript中this指针的新理解分享
Jan 31 Javascript
Jquery操作Ajax方法小结
Nov 29 Javascript
2016年最热门的15 款代码语法高亮工具,美化你的代码
Jan 06 Javascript
js实现短信发送倒计时功能(正则验证)
Feb 10 Javascript
Bootstrap学习笔记 轮播(Carousel)插件
Mar 21 Javascript
vue 封装 Adminlte3组件的实现
Mar 18 Javascript
JavaScript Date对象功能与用法学习记录
Apr 28 Javascript
js前端对于大量数据的展示方式及处理方法
Dec 02 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
ajax在joomla中的原生态应用代码
2012/07/19 PHP
ThinkPHP5框架中使用JWT的方法示例
2020/06/03 PHP
jquery 表单下所有元素的隐藏
2009/07/25 Javascript
远离JS灾难css灾难之 js私有函数和css选择器作为容器
2011/12/11 Javascript
jQuery常用数据处理方法小结
2015/02/20 Javascript
React.js入门实例教程之创建hello world 的5种方式
2016/05/11 Javascript
Javascript农历与公历相互转换的简单实例
2016/10/09 Javascript
AngularJS出现$http异步后台无法获取请求参数问题的解决方法
2016/11/03 Javascript
jQuery Validate表单验证插件的基本使用方法及功能拓展
2017/01/04 Javascript
详解jQuery中ajax.load()方法
2017/01/25 Javascript
详解webpack自定义loader初探
2018/08/29 Javascript
element ui table(表格)实现点击一行展开功能
2018/12/04 Javascript
jquery-ui 进度条功能示例【测试可用】
2019/07/25 jQuery
深入浅析vue全局环境变量和模式
2020/04/28 Javascript
JavaScript实现简单日历效果
2020/09/11 Javascript
利用Tkinter和matplotlib两种方式画饼状图的实例
2017/11/06 Python
Linux CentOS Python开发环境搭建教程
2018/11/28 Python
Python3实现爬虫爬取赶集网列表功能【基于request和BeautifulSoup模块】
2018/12/05 Python
Pycharm以root权限运行脚本的方法
2019/01/19 Python
python聚类算法解决方案(rest接口/mpp数据库/json数据/下载图片及数据)
2019/08/28 Python
使用pandas实现连续数据的离散化处理方式(分箱操作)
2019/11/22 Python
Python使用Numpy模块读取文件并绘制图片
2020/05/13 Python
python调用摄像头的示例代码
2020/09/28 Python
教你如何用python操作摄像头以及对视频流的处理
2020/10/12 Python
Django 用户认证Auth组件的使用
2020/11/30 Python
利用SVG和CSS3来实现一个炫酷的边框动画
2015/07/22 HTML / CSS
HTML5 visibilityState属性详细介绍和使用实例
2014/05/03 HTML / CSS
联想哥伦比亚网上商城:Lenovo Colombia
2017/01/10 全球购物
美国领先的奢侈手表在线零售商:WatchMaxx
2017/12/17 全球购物
巴西独家产品和现场演示购物网站:Shoptime
2019/07/11 全球购物
家长写给老师的建议书
2014/03/13 职场文书
幼师辞职信范文
2015/02/27 职场文书
幼儿园六一儿童节主持词
2015/06/30 职场文书
重温经典:乔布斯在斯坦福大学的毕业演讲(双语)
2019/08/26 职场文书
2020优秀员工演讲稿(三篇)
2019/10/17 职场文书
原生JS实现分页
2022/04/19 Javascript