// 封装的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. Dapper事务操作

    1.报错信息: 如果分配给命令的连接位于本地挂起事务中,ExecuteNonQuery 要求命令拥有事务.命令的 Transaction 属性尚未初始化. 出现这种原因是在执行Execute语句时,没 ...

  2. memmove 的实现

    baidu的笔试题目 用C语言实现一个公用库函数void * memmove(void *dest,const void *src,size_t n).该函数的功能是拷贝src所指的内存内容前n个字节 ...

  3. CURL_INIT()

    private function http_curl($url,$data=null){ //1.初始化,创建一个新cURL资源 $ch = curl_init(); //2.设置URL和相应的选项 ...

  4. 【Jquery EasyUI + Servlet】DataGrid,url请求带中文出现乱码的解决方案

    demo.jsp: <% String name = "乱码"; %> $(function(){ $('#dg').datagrid({ url: 'DemoServ ...

  5. Thinkphp 控制器

    控 制 器: 1.命名方法:新建一个主页面的控制器 controller文件夹下新建一个文件,命名为:MainController.class.php首字母都大写,称为驼峰命名法 eg: <?p ...

  6. map(int, ..) 与 int() 的区别

    >>> map(int,') [0] >>> int('-1') -1 >>> map(int, l[1]) Traceback (most re ...

  7. Webbrowser判断页面加载完成

    Webbrowser 请求加载页面,页面中包含各种资源,不能够很准确的判断加载是否完成,需要通过特定的方法判断. 1.使用计数器判断页面是否加载完成.精准可控. // 计数器 ; // 添加事件响应函 ...

  8. ubuntu设置系统时间与网络时间同步

    ubuntu设置系统时间与网络时间同步   Linux的时间分为System Clock(系统时间)和Real Time Clock (硬件时间,简称RTC).   系统时间:指当前Linux Ker ...

  9. d3可视化实战03:神奇的superformula

    需求驱动实现 前文讲过了D3的数据驱动机制,中间所举的例子都很简单.例如那个demo里面,绑定的数据是一个简单的数组,实现的图元也仅仅是一堆用SVG画的circle.但是现实世界中我们往往会遇到复杂的 ...

  10. Spark 启动过程(standalone)

    Spark启动过程 正常启动Spark集群时往往使用start-all.sh ,此脚本中通过调用start-master.sh和start-slaves.sh启动mater及workers节点. 1. ...