分享web开发知识

注册/登录|最近发布|今日推荐

主页 IT知识网页技术软件开发前端开发代码编程运营维护技术分享教程案例
当前位置:首页 > 技术分享

Promise实现ajax

发布时间:2023-09-06 02:18责任编辑:赖小花关键词:暂无标签

利用Promise实现ajax

GET

 ???function getAjax(url) { ???????return new Promise((resolved,rejected)=>{ ???????????//创建ajax对象 ???????????let ajax = new XMLHttpRequest(); ???????????//配置参数 ???????????ajax.open(‘get‘,url,true) ???????????//发送请求 ???????????ajax.send(); ???????????//请求成功之后 ???????????ajax.onload = function () { ???????????????if(this.status === 200){ ???????????????????console.log(ajax.responseText) ???????????????????resolved(ajax.responseText); ???????????????}else{ ???????????????????rejected(); ???????????????} ???????????} ???????}) ???}
View Code
getAjax(url).then().catch()

POST

 ???function postAjax(url,param) { ???????return new Promise((resolved,rejected)=>{ ???????????//创建ajax对象 ???????????let ajax = new XMLHttpRequest(); ???????????//配置参数 ???????????ajax.open(‘post‘,url,true); ???????????//设置请求头,表示我传递的参数的类型 ???????????xhr.setRequestHeader("Content-type", "application/x-www-form-urlencoded"); ???????????//发送请求,并将数据传递过去 ???????????ajax.send(JSON.stringify(data)); ???????????//请求成功之后 ???????????ajax.onload = function () { ???????????????if(this.status === 200){ ???????????????????console.log(ajax.responseText) ???????????????????resolved(ajax.responseText); ???????????????}else{ ???????????????????rejected(); ???????????????} ???????????} ???????}) ???}
View Code
getAjax(url,param).then().catch()

GET \POST合并

 ???function myAjax(type,url,params) { ???????return new Promise((resolved,rejected)=>{ ???????????//创建ajax对象 ???????????let ajax; ???????????//注意,不要根据浏览器的navigator.userAgent来检测浏览器是否支持某个JavaScript特性,一是因为这个字符串本身可以伪造,二是通过IE版本判断JavaScript特性将非常复杂。 ???????????if (window.XMLHttpRequest) { ???????????????ajax = new XMLHttpRequest(); ???????????} else { ???????????????ajax = new ActiveXObject(‘Microsoft.XMLHTTP‘); ???????????} ???????????if(type == ‘get‘ || type == ‘‘){//get ???????????????//配置参数 ???????????????ajax.open(‘get‘,url,true) ???????????????//发送请求 ???????????????ajax.send(); ???????????}else if(type == ‘post‘){//post ???????????????//配置参数 ???????????????ajax.open(‘post‘,url,true); ???????????????//设置请求头,表示我传递的参数的类型 ???????????????xhr.setRequestHeader("Content-type", "application/x-www-form-urlencoded"); ???????????????//发送请求,并将数据传递过去 ???????????????ajax.send(JSON.stringify(data)); ???????????} ???????????//请求成功之后 ???????????request.onreadystatechange = function (){ ???????????????if (request.readyState === 4){ ???????????????????if(this.status === 200){ ???????????????????????console.log(ajax.responseText) ???????????????????????resolved(ajax.responseText); ???????????????????}else{ ???????????????????????rejected(); ???????????????????} ???????????????} ???????????} ???????}) ???}
View Code
 ???getAjax(‘get‘).then().catch() ???getAjax(‘post‘,param).then().catch()

Promise实现ajax

原文地址:https://www.cnblogs.com/shaokevin/p/9796882.html

知识推荐

我的编程学习网——分享web前端后端开发技术知识。 垃圾信息处理邮箱 tousu563@163.com 网站地图
icp备案号 闽ICP备2023006418号-8 不良信息举报平台 互联网安全管理备案 Copyright 2023 www.wodecom.cn All Rights Reserved