🔥码云GVP开源项目 12k star Uniapp+ElementUI 功能强大 支持多语言、二开方便! 广告
[TOC] ## 使用RESTer测试服务接口 > 接口测试可以在浏览器中安装RESTer扩展插件,通过插件可以快速的模拟表单发送实现各种请求。 在FireFox浏览器中安装RESTer扩展插件,启动插件输入: ~~~ http://localhost:3000/api.php?action=getBookInfo&id=1 ~~~ 代码说明: 该请求调用getBookInfo接口,并传递参数id,设置参数的值为1。 ![](https://img.kancloud.cn/a5/c8/a5c8e9e9a0dc9986c57bb723ae15bf32_770x570.png) ## 使用Ajax调用服务接口 ~~~ <html> <head> <script> function showResult(str) { if (str.length==0) { document.getElementById("txtHint").innerHTML=""; return; } if (window.XMLHttpRequest) { // IE7+, Firefox, Chrome, Opera, Safari 浏览器执行的代码 xhr=new XMLHttpRequest(); } else { //IE6, IE5 浏览器执行的代码 xhr=new ActiveXObject("Microsoft.xhr"); } xhr.onreadystatechange=function() { if (xhr.readyState==4 && xhr.status==200) { document.getElementById("txtHint").innerHTML= JSON.stringify(xhr.response); console.log(xhr.response) } } xhr.responseType ="json"; //指定返回的数据类型为JSON格式 xhr.open("GET","api.php?action=getBookInfo&id="+str,true); xhr.send(); } </script> </head> <body> <p><b>在输入框中输入一个图书ID:</b></p> <form> ID: <input type="text" onkeyup="showResult(this.value)"> </form> <p>返回值: <span id="txtHint"></span></p> </body> </html> ~~~