// 封装的ajax网络请求函数
// obj 是一个对象
function AJAX(obj){

//跨域请求
        if (obj.dataType == "jsonp") {
            //在这里 callback 必须是全局变量 保证函数消失的时候 这个变量不可以被销毁

//处理一下函数名(防止多个网络请求 函数名字相同 出现紊乱的情况)
            var hehe = "callBack" + "_" + new Date().getTime() + "_" + String(Math.random()).replace(".","");
            window[hehe] = obj.success;
            //创建 script标签
            var sc = document.createElement("script");
            sc.src = obj.url + "?" + "cb=" + hehe;
            console.log(sc.src);
            document.body.appendChild(sc);
            document.body.removeChild(sc);
            return;
        }

//1、创建 ajax 对象
    var ajaxObj = null;
    if (window.XMLHttpRequest) {
        ajaxObj = new XMLHttpRequest();
    }else{
        ajaxObj = new ActiveXObject("Microsoft.XMLHTTP");
    }

//设置请求的类型
    obj.type = obj.type.toUpperCase() || "GET";

//如果是get请求 并且需要传递参数 则需要给 url 后面拼接参数
    if (obj.type == "GET") {
        var arr = [];//定义数组 用于把对象存储到数据里面
        for (var key in obj.data) {
            arr.push(key +"="+ obj.data[key]);
        }
        //用&分隔数组 让其转化为类似:name=lxl&age=18 的形式
        var str = arr.join("&");
        obj.url = obj.url +"?"+ str;
        //拨号
        ajaxObj.open(obj.type,obj.url,true);

//发送"name=123&age=18"
        ajaxObj.send();
    }else{
        var arr = [];//定义数组 用于把对象存储到数据里面
        for (var key in obj.data) {
            arr.push(key +"="+ obj.data[key]);
            //console.log(arr);
        }
        //用&分隔数组 让其转化为类似:name=lxl&age=18 的形式
        var str = arr.join("&");
        //console.log(str);
        ajaxObj.open(obj.type,obj.url,true);
        ajaxObj.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");
        ajaxObj.send(str);
    }

//监听
    ajaxObj.onreadystatechange = function(){

if (ajaxObj.readyState == 4) {
            if (ajaxObj.status >= 200 && ajaxObj.status < 300 || ajaxObj.status == 304) {
                //请求成功
                obj.success(ajaxObj.responseText);
            }else{
                //请求失败
                obj.error(ajaxObj.status);
            }
        }

}

}

关于ajax网络请求的封装的更多相关文章

  1. AFNetworking 2.5.x 网络请求的封装

    AFNetworking 2.5.x 网络请求的封装 源码地址 https://github.com/YouXianMing/Networking 说明 1. 将block形式的请求转换成用代理来处理 ...

  2. Swift3.0 Alamofire网络请求的封装(get,post,upload图片上传)转

    转自: http://blog.csdn.net/C_calary/article/details/53193747 学习Swift 试着动手写个天气小app,搜集资料这个封装还蛮好用的. 我用的第三 ...

  3. Angular网络请求的封装

    很多时候,我很喜欢angular的编码风格,特别是angular支持typescript之后,完整的生命周期,完美的钩子函数,都是别的语言所无法替代的.这里我来说说我自己的网络请求封装,某种意义上来说 ...

  4. Axios 网络请求组件封装 (鉴权、刷新、拦截)

    一.前言 注意:本教程需要你对axios有一定的了解,不适用于小白(只能借鉴,希望你能自己动手),注释都写的很清楚.此封装并非完整版,已进行部分删减修改操作,但仍然适用于大部分业务场景,如果不适用于你 ...

  5. IOS开发之—— 在AFN基础上进行的网络请求的封装

    网络请求的思路:如果请求成功的话AFN的responseObject就是解析好的. 1发送网络请求:get/post/或者别的 带上URL,需要传的参数 2判断后台网络状态码有没有请求成功: 3 请求 ...

  6. iOS-在AFN基础上进行网络请求的封装

    网络请求的思路:如果请求成功的话AFN的responseObject就是解析好的. 1发送网络请求:get/post/或者别的 带上URL,需要传的参数 2判断后台网络状态码有没有请求成功: 3 请求 ...

  7. 对小程序的网络请求的封装 wx.request 接收参数修改

    wepy-mall/wxRequest.js at master · dyq086/wepy-mall https://github.com/dyq086/wepy-mall/blob/master/ ...

  8. Spring Boot + Vue 前后端分离开发,前端网络请求封装与配置

    前端网络访问,主流方案就是 Ajax,Vue 也不例外,在 Vue2.0 之前,网络访问较多的采用 vue-resources,Vue2.0 之后,官方不再建议使用 vue-resources ,这个 ...

  9. andriod开发,简单的封装网络请求并监听返回.

    一.为什么封装 因为android 4.0 以后的发送网络请求必须要放到异步线程中,而异步线程必须跟handle合作才能更新主线程中的UI,所以建议用一个类继承handler来异步处理网络请求. 二. ...

随机推荐

  1. 微信js-sdk,选择图片,上传,下载到本地,php服务端

    //前端js代码<script> //客户端6.0.2 wx.config({ //debug:true, appId: "{pigcms:$signPackage.appId} ...

  2. C#中的委托(Delegate)和事件(Event)

    原文地址:C#中的委托(Delegate)和事件(Event) 作者:jiyuan51 把C#中的委托(Delegate)和事件(Event)放到现在讲是有目的的:给下次写的设计模式--观察者(Obs ...

  3. 工作流activiti-03数据查询(流程定义 流程实例 代办任务) 以及个人小练习

    在做数据查询的时候通过调用api来查询数据是相当的简单 对分页也进行了封装listPage(0, 4) ;listPage:分页查询 0:表示起始位置,4:表示查询长度 但是公司的框架封装了分页数据  ...

  4. WDCP一些常用的一健安装包可选安装组件

    为有更好的性能,也为更简洁的系统,一些不是常用或不是基本的功能,都将做为可选的安装组件需要用到的就安装 memcache的安装 wget -c http://down.wdlinux.cn/in/me ...

  5. PHPCMS V9 简单的二次开发

    更多二次开发技巧,查看phpcms系统帮助 ,前台模板解析后的缓存 caches\caches_template\default 前台控制类index.php,前台标签类*_tag.class.php ...

  6. LRU缓存算法 - C++版

    LRU是Least Recently Used的缩写,意思是最近最少使用,它是一种Cache替换算法. 实现思路: hashtable + 双向链表 时间复杂度: 插入,查找,删除:O(1) 空间使用 ...

  7. Lua----注意事项

    前言:Lua相对一般的语言相对简单,有c基础看一遍就差不多了.一般的代码都能够看懂.但是Lua也有一些自己的特点,区别与其他语言,这里需要注意一下. 1.数组下标 在Lua中数组下标是从1开始计数的. ...

  8. 学习python的记录

    今天买了本head first pyhton,目的用于更加方便的学习自动化,希望可以坚持下来,没看完一张,在博客园里做出笔记 环境:公司或家中的windows7  python3.6版本 书籍:hea ...

  9. IE中对于stylesheet的个数限制

    对于IE6-9: 1.样式规则最多只能有4095个,多于这个数目的会被忽略: 2.样式表(通过@import, <link> 或 <style>)最多可以有31个(总和),多于 ...

  10. 转:成为JavaGC专家Part I — 深入浅出Java垃圾回收机制

    文章来自于:http://www.importnew.com/1993.html 对于Java开发人员来说,了解垃圾回收机制(GC)有哪些好处呢?首先可以满足作为一名软件工程师的求知欲,其次,深入了解 ...