学习用js, ajax, php做一个简单的小黄鸡页面(调用simsimi API)
2013-01-21 16:48
906 查看
1. 服务器端的simsimi.php,参见http://www.52its.net/articles/407.html,在其开头还需加上一句,如下
所加的句子使get获得的参数经过url编码(主要是让空格被编码,因为simsimi的API中msg字段不能直接处理含空格的字符串)。这样即完成一个API的调用。详情请跟踪http://www.simsimi.com/talk.htm的network请求!
2. 服务器上的html页面(如果作为本地文件使用,chrome不允许跨域访问,即file://与http://访问失败,可以chrome.exe --allow-file-access-from-files方式重新打开chrome;而IE8允许ActiveX之后可以)
效果图:
3. 注意事项:
3个编码问题:文件自身的编码,编码信息标记内容(meta),url或表单传输的编码(js: encodeURI; php: [raw]urlencode)。文件自身编码会影响文本中字符串传递的方式,以上两文件中php建议使用UTF-8,html可以使用ANSI/GBK。当客户端向服务器提交内容时,需注意两方对编码的处理问题,要求一致。一般在表单提交时先直接用encodeURI对内容编码。此文中服务器返回内容的编码似乎不产生影响。参见/article/4098665.html
ajax动态技术,参见w3school
文本框中输入回车后即执行。但在表单的文本框中,键入回车后触发事件代码需返回false以阻止默认的提交表单行为。
<?php /** * *作者:@Belin_love *来源:http://52its.sinaapp.com/ *日期:2012.11.27 * **/ //function simsimi($keyword) //{ //做成API接口的话,请发起GET请求,返回Josn //只自己用的话,封装成一个函数,返回JSON字段中的response if(isset($_GET['key'])){ $keyword = $_GET['key']; $keyword=rawurlencode($keyword);//<<<<<-------------添加这句话,解决输入空格引起的的错误 $url = "http://www.simsimi.com/talk.htm?lc=ch"; //这个curl是因为官方每次请求都有唯一的COOKIE,我们必须先把COOKIE拿出来,不然会一直返回“HI” $ch = curl_init(); curl_setopt($ch, CURLOPT_URL, $url); curl_setopt($ch, CURLOPT_HEADER, 1); curl_setopt($ch, CURLOPT_RETURNTRANSFER, true); $content = curl_exec($ch); curl_close($ch); list($header, $body) = explode("\r\n\r\n", $content); preg_match("/set\-cookie:([^\r\n]*)/i", $header, $matches); //curl_setopt($ch, CURLOPT_COOKIE, $cookie); $cookie = $matches[1]; $urll = 'http://www.simsimi.com/func/req?msg=' .$keyword. '&lc=ch'; // 这个CURL就是模拟发起请求咯,直接返回的就是JSON $ch = curl_init(); curl_setopt($ch, CURLOPT_URL, $urll); curl_setopt($ch, CURLOPT_HEADER, 0); curl_setopt($ch, CURLOPT_REFERER, "http://www.simsimi.com/talk.htm?lc=ch"); curl_setopt($ch, CURLOPT_RETURNTRANSFER, true); curl_setopt($ch, CURLOPT_COOKIE, $cookie); $content = curl_exec($ch); curl_close($ch); //输出json //print_r($content); $reply = '你说的话太高深啦,我还听不懂,你可以教教我吗?[兔子]<a href="http://www.simsimi.com/teach.htm" target="_blank">点这里教我吧~~</a>'; $json = json_decode($content, 1); if (isset($json['response'])) { $reply = $json['response']; } echo $reply; } //} ?>
所加的句子使get获得的参数经过url编码(主要是让空格被编码,因为simsimi的API中msg字段不能直接处理含空格的字符串)。这样即完成一个API的调用。详情请跟踪http://www.simsimi.com/talk.htm的network请求!
2. 服务器上的html页面(如果作为本地文件使用,chrome不允许跨域访问,即file://与http://访问失败,可以chrome.exe --allow-file-access-from-files方式重新打开chrome;而IE8允许ActiveX之后可以)
<html> <head> <meta http-equiv="Content-Type" content="text/html; charset=gbk" /> <script type="text/javascript"> function ajaxSimsimi(str){ var xmlhttp; if (str.length==0){ document.getElementById("txtHint").innerHTML=""; return; } if (window.XMLHttpRequest) {// code for IE7+, Firefox, Chrome, Opera, Safari xmlhttp=new XMLHttpRequest(); } else {// code for IE6, IE5 xmlhttp=new ActiveXObject("Microsoft.XMLHTTP"); } xmlhttp.onreadystatechange=function(){ //XMLHttpRequest对象的有效返回判别 if (xmlhttp.readyState==4 && xmlhttp.status==200) { document.getElementById("txtHint").innerHTML=xmlhttp.responseText; } } xmlhttp.open("GET","simsimi.php?key="+str,true); xmlhttp.send(); } </script> </head> <body> <h3>请在输入框中键入消息并回车:</h3> <form name="talk" action="simsimi.php" method="GET"> 求调戏: <input type="text" class="textbox" name="key" onkeypress="if(event.keyCode==13){ ajaxSimsimi(encodeURIComponent(this.value));this.select();return false;} "/> <!--在文本框内检测敲回车后即执行ajax。先将文本框中的字符串通过url编码(即UTF-8传输)再传给ajax函数,并调用php接口从而返回response的字符串--> <input type="button" value="确定" onclick="ajaxSimsimi(encodeURI(talk.key.value))"/> </form> <p>小贱鸡: <span id="txtHint">大爷,来调戏我啊~~~</span></p> </body> </html>
效果图:
3. 注意事项:
3个编码问题:文件自身的编码,编码信息标记内容(meta),url或表单传输的编码(js: encodeURI; php: [raw]urlencode)。文件自身编码会影响文本中字符串传递的方式,以上两文件中php建议使用UTF-8,html可以使用ANSI/GBK。当客户端向服务器提交内容时,需注意两方对编码的处理问题,要求一致。一般在表单提交时先直接用encodeURI对内容编码。此文中服务器返回内容的编码似乎不产生影响。参见/article/4098665.html
ajax动态技术,参见w3school
文本框中输入回车后即执行。但在表单的文本框中,键入回车后触发事件代码需返回false以阻止默认的提交表单行为。
相关文章推荐
- 学习用js, ajax, php做一个简单的小黄鸡页面(调用simsimi API)
- 困扰我的一个简单的php调用js跳转页面
- 一个简单的注册登录页面(包括阿里大于的手机验证)html+JS+AJAX+PHP
- ajax实例 html页面中用js调用一个php文件
- vue.js学习07之使用$.ajax和vue-resource实现OAuth的注册、登录、注销和API调用
- php学习,一个简单的Calendar(2) 一个简单的活动页面
- AngularJS+RestfulAPI+BasicAuth+Python/PHP/Node.JS来实现一个最简单的新闻管理后台
- 安卓学习笔记:2:用EditView创建一个简单的注册页面
- js调用父框架函数与弹窗调用父页面函数的简单代码
- MVC设计模式 (1)、html页面事件触发ajax()方法调用ajax.js发送请求至请求目标文件
- 超级简单的一个AJAX.JS 类
- 请写一个简单的幻灯效果页面。如果不使用JS来完成,可以加分。
- php+js+html+ajax获取页面数据
- jqury+ajax+php最简单的例子局部刷新页面
- php学习笔记(三十)ajax请求和接收参数的实现方式(包括json数据格式的简单处理)
- 一个简单的jQuery插件ajaxfileupload.js实现ajax上传文件例子
- 在一个aspx或ashx页面里进行多次ajax调用
- PHP调用WebService的一个简单示例
- ajax读取页面调用JS函数问题
- d3.js学习4----做一个简单的图表