前端时间给手机客户端做接口，当时弱爆了，写完api接口后，也不怎么测试，最后是等客户端调用的时候检验api的正确性。 后面利用php的curl实现post请求，检验api接口的正确性；配合前面做的一个查看apache错误日志的小工具，可将将错误一览无余；利用firebug
前端时间给手机客户端做接口，当时弱爆了，写完api接口后，也不怎么测试，最后是等客户端调用的时候检验api的正确性。
后面利用php的curl实现post请求，检验api接口的正确性；配合前面做的一个查看apache错误日志的小工具，可将将错误一览无余；利用firebug或fiddler可以查看http通讯。
一、功能说明样式 firebug中的http通信信息
1、client_name、client_version、api_debug和url这几个是每次都需要传的参数，除了url其他3个参数都可以根据实际情况修改，url是每个接口的地址
2、一行两个输入框的地方是可变参数，就是每个接口特有的需要传递的参数，参数名和参数值都可以自定义
3、点击添加参数可以增加那行可变参数
4、点击测试，将输入框中的数据发送到接口中
5、从接口端返回json格式的数据直接打印出来
二、html部分
style type=text/css> .mb20{margin-bottom:20px} .title{display:inline-block;width:150px;text-align:right} .w100{width:100px} .mr10{margin-right:10px}style>
div class=mb20> label class=title>client_name：label>input name=client_name type=text value=android/> div> div class=mb20> label class=title>client_version：label>input name=client_version type=text value=4.0/> div> div class=mb20> label class=title>api_debug：label>input name=api_debug type=text value=/> div> div class=mb20> label class=title>url：label>input name=client_url type=text value=/> div> div class=mb20> label class=title>input name=api_key type=text value= class=w100/>：label>input name=api_value type=text value=/> div> div class=mb20> label class=title>label>input type=button value=测试 id=submit class=mr10/>input type=button value=添加参数 id=add/> div> div id=message>div>
这里做了点简单的修改，高度，宽度等。可变参数那行只用了name属性，分别是api_key和api_value，方便等下的克隆操作。
三、javascript部分
script type=text/javascript> $(#add).click(function() { var $parent = $(this).parent(); var $clone = $parent.prev().clone(); $clone.find(':text').val(''); $clone.insertbefore($parent); }); $(#submit).click(function() { var api_keys = { api_debug:$('input[name=api_debug]').val(), client_url:$('input[name=client_url]').val() }; $('input[name=api_key]').map(function() { var key = $.trim($(this).val()); var value = $.trim($(this).next().val()); var repeat = {}; if(key != '') { repeat[key] = value; api_keys = $.extend(api_keys, repeat); } }); //提交到test文件中 $.post('test.php', api_keys, function(data) { $(#message).html(data); }); });script>
1、绑定两个按钮的click事件
2、$(#add)的click事件是在做克隆操作，克隆的同时将原先两个输入框中的内容清除
3、$('input[name=api_key]').map在做过滤无效可变参数的操作；有效的可变参数是指参数名和参数值都存在，只有都存在的才会发送过去
4、$(#submit)通过post给test.php，通过它来发送消息给接口
四、php部分
php $root = 'http://api.1ddian.cn/';//可自定义域名 $url= $root . $_request['client_url']; //用curl实现post请求，可跨域 $ch = curl_init(); curl_setopt($ch, curlopt_post, 1); curl_setopt($ch, curlopt_url, $url); curl_setopt($ch, curlopt_postfields, $_request); //传送参数 ob_start(); curl_exec($ch); $result = ob_get_contents() ; ob_end_clean(); print_r(json_decode($result)); //中文返回的是unicode编码，decode后方便阅读?>
1、$root这个域名可以自定义
2、用curl实现post请求，可跨域
3、中文返回的是unicode编码，decode后方便阅读
demo下载：
http://download.csdn.net/download/loneleaf1/7966101