封装一个简单的ajax请求
记录自己第一次封装ajax,肯定有很多考虑不周到,如有错误请指出,本人必将虚心改正。
/**
*
* @param {Object} obj =>header:请求头;url:请求地址;methods:请求方法;data:请求参数
* @returns {JSON}
* @returns {XML}
*/
const ajax = function (obj) {
//返回promise对象
return new Promise((res, rej) => {
let xhr = null
if (window.XMLHttpRequest) {
xhr = new XMLHttpRequest()
} else {
//兼容ie5、ie6
xhr = new ActiveXObject('Microsoft.XMLHTTP')
}
xhr.onreadystatechange = function () {
try {
/**
* readyState值的含义
* 0: 请求未初始化
* 1: 服务器连接已建立
* 2: 请求已接收 接收到了响应头
* 3: 请求处理中 正在下载响应体
* 4: 请求已完成,且响应已就绪
*/
if (xhr.readyState == 4 && xhr.status == 200) {
if (xhr.responseXML) {
res(xhr.responseXML)
} else {
res(JSON.parse(xhr.responseText))
}
} else {
if (xhr.status == 404) throw '404,未找到页面'
}
} catch (e) {
rej(e)
}
}
//参数处理,当请求方式为get时,需要将参数加在请求地址后面。post则直接传参
let data = '?'
if (obj.data != undefined) {
for (const key in obj.data) {
data += key + '=' + obj.data[key] + '&'
}
data.substring(data.length - 1)
obj.data = data
}
if (obj.methods == 'GET' || obj.methods == 'get') {
obj.url += data
}
xhr.open(obj.methods, obj.url, true) //发起请求
//对请求头进行处理
if (obj.header != undefined) {
let key = Object.keys(obj.header)
xhr.setRequestHeader(key[0], obj.header[key[0]])
}
//发送请求
xhr.send(obj.data)
})
}
封装一个简单的ajax请求的更多相关文章
- 自己封装一个简单的ajax插件
function myAjax(obj) { var xmlHttp; //保存xmlHttpRequest对象 var type = obj.requestType; //保存请求方式 var ca ...
- jQuery-实现简单的Ajax请求封装
封装的意义在于复用,在于减少重复的代码. 我在项目中做了简单的Ajax请求封装,实现方式如下: //封装Ajax请求 $.extend({ ajaxDirect:function(url,type,d ...
- 网络游戏开发-服务器(01)Asp.Net Core中的websocket,并封装一个简单的中间件
先拉开MSDN的文档,大致读一遍 (https://docs.microsoft.com/zh-cn/aspnet/core/fundamentals/websockets) WebSocket 是一 ...
- 实现一个简单的http请求工具类
OC自带的http请求用起来不直观,asihttprequest库又太大了,依赖也多,下面实现一个简单的http请求工具类 四个文件源码大致如下,还有优化空间 MYHttpRequest.h(类定义, ...
- Directx11学习笔记【四】 封装一个简单的Dx11DemoBase
根据前面两个笔记的内容,我们来封装一个简单的基类,方便以后的使用. 代码和前面类似,没有什么新的内容,直接看代码吧(由于代码上次都注释了,这次代码就没怎么写注释o(╯□╰)o) Dx11DemoBas ...
- 代码改变世界 | 如何封装一个简单的 Koa
下面给大家带来:封装一个简单的 Koa Koa 是基于 Node.js 平台的下一代 web 开发框架 Koa 是一个新的 web 框架,可以快速而愉快地编写服务端应用程序,本文将跟大家一起学习:封装 ...
- python+selenium之自定义封装一个简单的Log类
python+selenium之自定义封装一个简单的Log类 一. 问题分析: 我们需要封装一个简单的日志类,主要有以下内容: 1. 生成的日志文件格式是 年月日时分秒.log 2. 生成的xxx.l ...
- 一个标准的AJAX请求
这是一个标准的ajax请求: $.ajax({ type:"post", url:basePath+"/resourcePush/operationLog", ...
- Python之自定义封装一个简单的Log类
参考:http://www.jb51.net/article/42626.htm 参考:http://blog.csdn.net/u011541946/article/details/70198676 ...
随机推荐
- 20210807 Smooth,Six,Walker
考场 开题,感觉 T1 很像 dky 讲过的一道中北大学 ACM 题,T3 一看就是随机化,具体不知道怎么做. T1 sb 题,直接取当前最小的光滑数,把它乘一个质因子放入候选集.类似<蚯蚓&g ...
- Linux常用命令 - nl命令详解
21篇测试必备的Linux常用命令,每天敲一篇,每次敲三遍,每月一循环,全都可记住!! https://www.cnblogs.com/poloyy/category/1672457.html 显示行 ...
- Postman 根据nginx日志查账号
1) GET:http://fwm.le-yao.com/api/backend/profile 2) Headers中,在KEY中添加 Content-Type ,对应的VALUE为 applica ...
- 多Host情况下IDEA无法启动Tomcat的问题
学习Java Web,学到将WAR包部署到Tomcat中时,遇到一个问题. 部署WAR包的过程本身没什么问题,把.war文件放在<Tomcat安装目录>/webapps/中,然后修改< ...
- 从零开始学习SQL SERVER(1)--- 了解SQL
SQL是什么 SQL (发音为 sequal [' sikwəl ' ]) SQL指 Structured Query Language 结构化查询语言,是用于访问和处理数据库的标准的计算机语言. ...
- oracle table()函数
PL/SQL表---table()函数用法/* PL/SQL表---table()函数用法:利用table()函数,我们可以将PL/SQL返回的结果集代替table. oracle内存表在查询和报表的 ...
- reeswitch http https ws wss nginx domain default port config
现代H5浏览器产业链越来越丰富,http+websocket+webrtc+sip组合已经是一种非常成熟的web原生音视频通讯解决方案 FreeSWITCH是一个开源的电话软交换平台,早在SIP年代就 ...
- 鸿蒙内核源码分析(消息队列篇) | 进程间如何异步传递大数据 | 百篇博客分析OpenHarmony源码 | v33.02
百篇博客系列篇.本篇为: v33.xx 鸿蒙内核源码分析(消息队列篇) | 进程间如何异步传递大数据 | 51.c.h .o 进程通讯相关篇为: v26.xx 鸿蒙内核源码分析(自旋锁篇) | 自旋锁 ...
- P7470-[NOI Online 2021 提高组]岛屿探险【Trie,CDQ分治】
正题 题目链接:https://www.luogu.com.cn/problem/P7470 题目大意 给出\(n\)个二元组\((a,b)\). \(q\)次询问给出\((l,r,c,d)\)表示询 ...
- pandas 基础命令
参考链接:https://github.com/rmpbastos/data_science/blob/master/_0014_Boost_your_Data_Analysis_with_Panda ...