成都市网站制作,WordPress集群主题,wordpress视频商店,精神文明建设网站专栏AJax
概念#xff1a;Asynchronous JavaScript and XML#xff08;异步的 JavaScript 和 XML#xff09;。是一种网络请求的概念框架。 主要特点#xff1a;实现页面局部刷新#xff0c;主要使用js的XMLHttpRequest请求实现网络请求。 主要缺点#xff1a;使用函数回调的…AJax
概念Asynchronous JavaScript and XML异步的 JavaScript 和 XML。是一种网络请求的概念框架。 主要特点实现页面局部刷新主要使用js的XMLHttpRequest请求实现网络请求。 主要缺点使用函数回调的方式实现异步请求若请求里写请求将会导致回调地狱的发生。 示例代码
bodyscriptfunction ajax(url) {const xhr new XMLHttpRequest();xhr.open(get, url, false);//异步函数监听xhr.onreadystatechange function () {// 异步回调函数if (xhr.readyState 4) {if (xhr.status 200) {console.info(响应结果, xhr.response)}}}xhr.send(null);}ajax(https://smallpig.site/api/category/getCategory)/script
/body
Fetch
概念使用ES6中提出的promise实现网络请求是Ajax的替代品是真实存在的请求API。不是对Ajax的封装。 代码 scriptfunction ajaxFetch(url) {fetch(url).then(res res.json()).then(data {console.info(data)})}ajaxFetch(https://smallpig.site/api/category/getCategory)/script主要特点
使用promise的方式进行网络请求支持async / await采用模块化请求语法简洁更加语义化例如Request 、 Response,可读性较好脱离XHR采用新的实现方式。
主要缺点
只对网络请求错误进行reject而对服务器返回的400或者500 都会被当做成功的请求不支持终端和超时处理造成资源流量的浪费没办法监听请求的进度默认不会带cookie需要手动添加配置
Axios
概念它是一个基于XHR二次进行封装的HTTP请求库 代码
// 发送 POST 请求
axios({method: post,url: /user/12345,data: {firstName: Fred,lastName: Flintstone}
})
主要特点
浏览器端发起XMLHTTPRequest请求node端发起http请求可进行请求终端可监听请求和返回支持Promise API可中断请求可自动转换json格式客户端支持转换XSRF攻击
axios和vue没关系axios也不是随着Vue的兴起才广泛使用的axios本身就是独立的请求库跟用什么框架没关系而且最初Vue官方推荐的请求库是vue-resouce后来才推荐的axiosaxios不是xhr的子集axios利用xhr进行了二次封装的请求库xhr只是axios中的其中一个请求适配器axios在nodejs端还有个http的请求适配器axios xhr http
注意
axios和vue是没关系的它并不是随着vue的兴起而被广泛使用的而是axios本身就是一个独立的请求库跟使用的框架并没有关系最初vue官方推荐的请求库是vue-resouce后来才推荐使用axiosaxios是利用了xhr进行的二次封装库xhr只是其中的一个http请求适配器Axios XHR HTTP