// 封装的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. 解决Access restriction问题

    今天在导入一个包时报错了

  2. 限制窗口拉伸范围(二)——OnSizing

    之前用的GetMinMaxInfo,在VS2015中会导致:Report模式的CListCtrl随窗口拉伸时,表头无法绘制超过原大小的区域.其他版本和控件未测试,而OnSizing没有这问题. 前一方 ...

  3. 中文man帮助安装

    下面我们来安装下中文man帮助 首先在http://pkgs.fedoraproject.org/repo/pkgs/man-pages-zh-CN/manpages-zh-1.5.2.tar.bz2 ...

  4. 关于c语言不定参数的研究

    一. 学习过程 编写程序如下: 编译连接并用debug加载,观察main函数的内容: Showchar函数的内容: 观察发现,main函数要传递两个参数‘a’和2,在汇编代码中是先将2赋给ax,再将a ...

  5. c++四则运算代码

    //Code highlighting produced by Actipro CodeHighlighter (freeware)http://www.CodeHighlighter.com/--& ...

  6. ALTIUM DESIGNER怎么定义差分对布线

    方法一:第一步是在原理图中声明,这样做的目的是为了让差分对布线器清楚哪两个网络是属于同一组差分对,设计编译器将查找格式为NETNAME_N和NETNAME_P(即以_N和_P为后缀)的两个同名网络.这 ...

  7. PHP curl 模拟登陆

    一个比较好的类: $cookie_file=tempnam("C:/users","tmp");生成以以tmp为前缀的文件. <?php define ( ...

  8. ruby文档

    http://www.ruby-doc.org/http://rubyonrails.org/https://www.ruby-lang.org/zh_cn/downloads/http://ruby ...

  9. [LeetCode] Search in Rotated Sorted Array I (33) && II (81) 解题思路

    33. Search in Rotated Sorted Array Suppose a sorted array is rotated at some pivot unknown to you be ...

  10. [Qt] QString 和 char* 转换

    (1) QString 转 char* char acResult[10240]; //QByteArray baResult = strResult.toLatin1(); QByteArray b ...