Ajax测试工具类

2019, Jan 20    

Ajax测试工具类

<html>

<head>
  <meta charset="UTF-8">
  <title>AJAX测试工具</title>
  <script src="http://libs.baidu.com/jquery/2.0.0/jquery.min.js"></script>
</head>

<body>
  <div>
    <button id="postButton">发送POST请求 </button>
  </div>
  <br>
  <div>
    <button id="getButton">发送get请求 </button>
  </div>
  <br>
  <!-- 表单提交，参数在url上 -->
  <div>
  <form action="http://www.123.com/postValue" method="post">
    <input type="text" name="username" placeholder="username" />
    <input type="text" name="password" placeholder="password" />
    <input type="submit" value="表单提交数据"/>
  </form>
</div>
<br>
  <!-- 表单提交文件，参数在url上 -->
<div>
  <form action="https://www.xxxx.com//ee/ad/ccfa7468ffd04ec7bbe8686b73119ce8" method="post" enctype="multipart/form-data">
    <input type="file"  name="file" />
    <input type="text"  name="ishead" placeholder="ishead" />
    <input type="text"  name="number" placeholder="number" />
    <button type="submit">表单提交文件和数据</button>
</form>
</div>
</body>
<script>
  // post请求
  $("#postButton").click(function () {
    // var data = {};
    data = {"departmentId":"ceshiceshi","contactMap":{"fghgdhfghjkkk":{"workNumber":"fghgdhfghjkkk","value":"1111","name":"yang"}}};
    // data.md5 = "dbb4c342386f87f210ffbf7f40e01cf6";
    data = JSON.stringify(data) // （1）使用stringify(data)把json对象转为json格式字符串
    $.ajax(
      {
        url: "http://108.118.60.29/address/update?userId=prim1536578686948&oldName=21321 3213 &newName=test Group",//"http://108.118.60.29/login",
        type: "put",
        contentType: "application/json", // （2）
        data: data,
        success: function (result) { alert(JSON.stringify(result)) }, //JSON.stringify(result)
        error: function () { }
      }
    );
  });

  // get请求
  $("#getButton").click(function () {
    var data = {"parm1":"val1", "param2":"val2"}
    $.get("http://localhost:8080/tt", data, function(retData){alert(JSON.stringify(data));}); 
  });
</script>
<!-- 请求发送说明
  GET请求 
    (1)URL上的键值对数据
    var data = {"parm1":"val1", "param2":"val2"}
    $.get(url, data, function(retData){alert(retData);}); 
    发送的GET请求URL如下:http://localhost:9090/pay?parm1=val1&param2=val2

    (2)url上的json数据
    第二个参数放入的数据类型是对象，如果放入json字符串，即stringify(data)的结果，发送的url请求则是
    http://localhost:9090/pay?{"parm1":"val1", "param2":"val2"}

  POST请求
    (1)数据在请求体中
    var data = {"parm1":"val1", "param2":"val2"}
    data = JSON.stringify(data) // （1）使用stringify(data)把json对象转为json格式字符串
    $.ajax(
      {url:"http://localhost:9090/pay", 
      type:"post", 
      contentType:"application/json", // （2） 如果没有这个参数，收到的数据会是{"parm1":"val1", "param2":"val2"}=  会多一个等号
        // 条件（1）不存在、（2）不存在：请求体的数据是parm1=val1&param2=val2
        // 条件（1）不存在、（2）存在：请求体的数据也是parm1=val1&param2=val2
        // 条件（1）存在、（2）不存在：请求体的数据是{"parm1":"val1", "param2":"val2"}=会多一个等号
        // 条件（1）存在、（2）存在：请求体的数据是{"parm1":"val1", "param2":"val2"}
      data:data, 
      success:function(result) {alert(result)}, 
      error:function(){}}
    );

    (2)数据在url上

    【附】：通用测试接口https://blackhole.m.jd.com/getinfo 或 http://blackhole.m.jd.com/getinfo
    如果是get请求，返回2
    如果是post请求，返回3
 -->
</html>
# Http