首页 > 代码库 > QQ开放平台网页应用接口测试

QQ开放平台网页应用接口测试

2024-08-03 05:16:37   223人阅读

闲来无事，近日对QQ应用开发有了兴趣。

想法：

　　在自己的pc上搭建一个服务器，可以使Tomcat，运用Eclipse传建一个web项目，框架为Spring MVC

　　申请一个免费域名，映射到我的本地，这样就可以在外网看到我正在开发的项目了，并且我自己还便于维护。

　　将这个项目地址投放到QQ申请的应用上调试接口即可:)

开放平台地址：

　　http://open.qq.com/

创建一个属于自己的应用，类型：网页。非托管方式。保存后TX将分配一个appid、appkey

　　这里为什么要选择非托管方式呢？因为选择非托管的话，就意味着应用平台地址可以填写自己本地部署的应用于外网的项目。而托管的话，就必须将项目放到TX云服务器上，因为只是学习，并没有要去真正的开发项目，所以暂时如此，虽然会随着自己本地Tomcat断开就看不到效果了。。

开始：

本地tomcat端口改为8080

1.申请域名：

　　

　　http://my.dot.tk/cgi-bin/login01.taloha

　　外网关联内网：下载nat123 from nat123.com，创建一个端口映射

　　dot tk申请的域名manage dns CNAME设置:

　　　　　　name:www

　　　　　　target:nat123自主域名

2.下载JAVA SDK OPENV3

　　我们发现调用接口时需要openid，通过了解openid、openkey、pf等参数的获取都是在调试的时候转入的。

　　参考地址：http://open.qq.com/tools

　　我们需要在Controller端将这些参数获取，当然appid、appkey是从properties里获取

　　

@RequestMapping(value =http://www.mamicode.com/{"/index.htm"," /"},method =RequestMethod.GET)        public String toHome(Model model,HttpServletRequest request,                HttpServletResponse response){            model.addAttribute("appid", QQConfig.getValue("app_ID"));            model.addAttribute("appkey", QQConfig.getValue("app_KEY"));            model.addAttribute("openid", request.getParameter("openid"));            model.addAttribute("openkey", request.getParameter("openkey"));            model.addAttribute("pf", request.getParameter("pf"));            return "index";        }

这时，在js端就可以通过ajax访问调用接口了

    var appid =$j("#appid").val();    var appkey =$j("#appkey").val();    var openid =$j("#openid").val();    var openkey =$j("#openkey").val();    var pf =$j("#pf").val();    //用户信息    $j.ajax(            {                type: "get",                async: false,                url: getUserInfo,                contentType: "application/x-www-form-urlencoded; charset=utf-8",                data: {                        ‘appid‘:appid,                        ‘appkey‘:appkey,                        ‘openid‘:openid,                        ‘openkey‘:openkey,                        ‘pf‘:pf                    },                dataType: "json",                cache: false,                success: function (data) {                    if(data.ret==‘1002‘){                        //登陆失效，需重新登陆                        fusion2.dialog.relogin();                    }else{                        $j("#userinfo").html("用户信息:<br>"+data);                    }                },                error: function (err) {                    alert(err);                }            }                                    );

前端jsp代码如下：

<center>      <div id ="hidden_area">                <input type="hidden" id="appid" value="http://www.mamicode.com/${appid}" />          <input type="hidden" id="appkey" value="http://www.mamicode.com/${appkey}" />          <input type="hidden" id="openid" value="http://www.mamicode.com/${openid}" />          <input type="hidden" id="openkey" value="http://www.mamicode.com/${openkey}" />          <input type="hidden" id="pf" value="http://www.mamicode.com/${pf}" />      </div>          Just for test~          <br>          <span id="userinfo"></span>          <div>              <input type="button" value="http://www.mamicode.com/加入应用群" id="joinAppGroup" />          </div>                    <div>              <span>发送一条微博:</span>              <input type="text" id="weiboContent" /><br>              <span id="sync">是否同步?</span><input type="checkbox" id ="syncflag" value="http://www.mamicode.com/0" checked="checked"/>              <span id="error_msg" style="color:red ;display :none" >不能为空</span>              <input type="button" value="http://www.mamicode.com/发送" id="sendWeibo" />          </div>          <input type="text" name="app" value="http://www.mamicode.com/sss">          <input type="text" name="app" value="http://www.mamicode.com/ttt">              </center>

调试效果： 

QQ开放平台网页应用接口测试


联系
我们