虽然我们是后台开发人员,但是最基本的 ajax 一定是要会写的;比如某个接口你通过 postman 接口测试已经没问题了,但是前端人员非要说你这有问题,你就可以一个简单的 ajax 去说服他。
1.Ajax 一般格式
function test(){
$.ajax({
// 提交数据的类型 POST GET
type:"POST",
// 提交的 URL
url:"testLogin.aspx",
// 提交的数据
data:{Name:"sanmao",Password:"sanmaoword"},
// 返回数据的格式
datatype: "html",//"xml", "html", "script", "json", "jsonp", "text".
// 在请求之前调用的函数
beforeSend:function(){$("#msg").html("logining");},
// 成功返回之后调用的函数
success:function(data){
$("#msg").html(decodeURI(data));
} ,
// 调用执行后调用的函数
complete: function(XMLHttpRequest, textStatus){
alert(XMLHttpRequest.responseText);
alert(textStatus);
//HideLoading();
},
// 调用出错执行的函数
error: function(){
//请求出错处理
}
});
}
2.Ajax 测试实例
在 SpringBoot 项目的 static 目录下新建一个 test.html,这样我们在浏览器直接就可以访问该页面,从浏览器控制台看到请求头和请求体
注:先要引入 jquery 的 js 包(jquery-3.3.1.min.js)
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body>
<button type="button" onclick="test()">TEST</button>
<script src="jquery-3.3.1.min%20.js"></script>
<script>
function test() {
$.ajax({
type:"POST",
url:"http://39.105.136.112/code/phone",
contentType: "application/json", // json
data:JSON.stringify({"phone":"15389093292"}), // 转 json(内置函数)
dataType: 'json',
success:function (data) {
console.log(data);
}
})
}
</script>
</body>
</html>
本文标题:【项目杂记】通过简易 AJAX 进行接口测试
本文链接:https://blog.quwenai.cn/post/9858.html
版权声明:本文不使用任何协议授权,您可以任何形式自由转载或使用。






还没有评论,来说两句吧...