摘要：这里我将jauery的ajax再次封装更方便我的使用。

创建一个 [commonUtils.js] 的文件，用于存放封装的方法

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29

window.baseUrl = "http://"+location.host;/*这个是获取的前缀地址，当然你也可以固定书写*/
    /*
    * url：接口地址后缀
    * requestData：请求数据对象
    * token：这个是我自己定义的一个header参数
    * successFun：请求成功后调用的方法
    * errorFun：请求失败调用的方法
    * 
    */
    function ajaxPost(url,requestData,token,successFun,errorFun) {
        $.ajax({
            type: "POST",
            contentType: "application/json",
            url: window.baseUrl+url,
            data:JSON.stringify(requestData),
            dataType: "JSON",
            beforeSend: function(xhr) {
                xhr.setRequestHeader("token",token);
            },
            success: function(result) {
                successFun(result);
            },
            //请求失败，包含具体的错误信息
            error : function(result){
                errorFun(result);
            }
        });
    }

再来看在html页面中的使用

1
2
3
4
5
6
7
8
9
var successFun = function(result){
    console.log(result)
    alert("请求成功。")
};
var errorFun = function(result){
    console.log(result)
    alert("网络异常，请重试。")
};
ajaxPost("/user/memberCenter",null,signature,successFun,errorFun);

其实这只是一个简单的封装，没有什么麻烦的但是需要交代一下你再引入自己写的[commonUtils.js] 的文件前一定要引入jquery否则是不能用的

1
2
<script src="https://cdn.bootcss.com/jquery/1.11.0/jquery.min.js"></script>
<script src='./me/js/commonUtils.js'></script>

图片引用