记录自己第一次封装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请求的更多相关文章

  1. 自己封装一个简单的ajax插件

    function myAjax(obj) { var xmlHttp; //保存xmlHttpRequest对象 var type = obj.requestType; //保存请求方式 var ca ...

  2. jQuery-实现简单的Ajax请求封装

    封装的意义在于复用,在于减少重复的代码. 我在项目中做了简单的Ajax请求封装,实现方式如下: //封装Ajax请求 $.extend({ ajaxDirect:function(url,type,d ...

  3. 网络游戏开发-服务器(01)Asp.Net Core中的websocket,并封装一个简单的中间件

    先拉开MSDN的文档,大致读一遍 (https://docs.microsoft.com/zh-cn/aspnet/core/fundamentals/websockets) WebSocket 是一 ...

  4. 实现一个简单的http请求工具类

    OC自带的http请求用起来不直观,asihttprequest库又太大了,依赖也多,下面实现一个简单的http请求工具类 四个文件源码大致如下,还有优化空间 MYHttpRequest.h(类定义, ...

  5. Directx11学习笔记【四】 封装一个简单的Dx11DemoBase

    根据前面两个笔记的内容,我们来封装一个简单的基类,方便以后的使用. 代码和前面类似,没有什么新的内容,直接看代码吧(由于代码上次都注释了,这次代码就没怎么写注释o(╯□╰)o) Dx11DemoBas ...

  6. 代码改变世界 | 如何封装一个简单的 Koa

    下面给大家带来:封装一个简单的 Koa Koa 是基于 Node.js 平台的下一代 web 开发框架 Koa 是一个新的 web 框架,可以快速而愉快地编写服务端应用程序,本文将跟大家一起学习:封装 ...

  7. python+selenium之自定义封装一个简单的Log类

    python+selenium之自定义封装一个简单的Log类 一. 问题分析: 我们需要封装一个简单的日志类,主要有以下内容: 1. 生成的日志文件格式是 年月日时分秒.log 2. 生成的xxx.l ...

  8. 一个标准的AJAX请求

    这是一个标准的ajax请求: $.ajax({ type:"post", url:basePath+"/resourcePush/operationLog", ...

  9. Python之自定义封装一个简单的Log类

    参考:http://www.jb51.net/article/42626.htm 参考:http://blog.csdn.net/u011541946/article/details/70198676 ...

随机推荐

  1. Windows Server安装MySQL

    1.下载zip包 https://dev.mysql.com/downloads/file/?id=467269 2.直接解压zip包到指定路径下 3.添加环境变量 在系统变量path后面添加mysq ...

  2. WEB漏洞——XSS

    跨站脚本( Cross-site Scripting,简称为XSS或跨站脚本或跨站脚本攻击)是一种针对网站应用程序的安全漏洞攻击技术,是代码注入的一种. XSS攻击可以分为三种:反射型.存储型和DOM ...

  3. JVM-调优-命令

    目录 jps 命令格式 option参数 示例 jstat 命令格式 参数 option 参数总览 option 参数详解 -class -compiler -gc -gccapacity -gcut ...

  4. Stream 流

    Stream流(接口不是函数接口) 描述 在java.1.8中,由于 lambda表达式这种函数编程jdk引入了一个全新的改变Stream流它是用来解决已有集合类库的一些弊端的. Stream是jav ...

  5. 机器学习——集成学习(Bagging、Boosting、Stacking)

    1 前言 集成学习的思想是将若干个学习器(分类器&回归器)组合之后产生一个新学习器.弱分类器(weak learner)指那些分类准确率只稍微好于随机猜测的分类器(errorrate < ...

  6. python函数模块

    python函数模块 学习完本篇,你将会深入掌握 函数相关知识 1.函数定义 2.函数如何调用 3.递归函数以及匿名函数使用 模块相关知识 1.模块如何导入调用 2.函数调用顺序 函数定义 函数代码块 ...

  7. Jmeter系类(31) - JSR223(1) | 控件介绍

    JSR233 介绍 JSR223控件执行JSR223脚本代码用于创建/更新所需的某些变量 JSR223可以使用其内置的变量,有助于精简脚本,提高开发测试的效率 由于JSR223脚本编译方式基本相同,J ...

  8. Shell系列(36)- for循环语法二简介及批量添加删除用户

    for循环语法二 for ((初始值;循环控制条件;变量变化)) do 程序 done 例子 例子-1 求和工具 需求:根据用户输入的数字,求1~输入所有数字的和 脚本: #!/bin/bash re ...

  9. jenkin—持续集成

    jenkins与持续集成 Jenkins是一个开源软件项目,是基于Java开发的一种持续集成工具,用于监控持续重复的工作,旨在提供一个开放易用的软件平台,使软件的持续集成变成可能.(百度百科) 持续集 ...

  10. AT5661-[AGC040C]Neither AB nor BA【模型转换】

    正题 题目链接:https://www.luogu.com.cn/problem/AT5661 题目大意 一个包含\(A,B,C\)的序列,每次可以选择相邻的两个除了\(AB\)和\(BA\)的删去. ...