浏览模式: 标准 | 列表 | 订阅

用appCan连接腾讯&新浪微博并调用API实例

作者:ciniao 时间:2012-08-03 分类:JavaScript 3 Comments

    * 文章同步发布至appCan官方论坛:http://bbs.appcan.cn/forum.php?mod=viewthread&tid=4644
    点击登陆授权后,会调用API获取当前用户的微博信息,如果要调用其他接口,直接查看开放平台文档即可。
    腾讯微博API文档
    新浪微博API文档


<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
</head>
<body>

<a href="javascript:qqweiboLogin()">用腾讯微博登陆</a><br/>
<a href="javascript:sinaweiboLogin()">用新浪微博登陆</a>
<div id="aa"></div>
<script>
function sinaweiboLogin(){
    var W = new Weibo('sina');
    W.login('3183294709','http://weibo.uutown.com/oauth.html',function(){
        var me = this;
        this.api('users/show',function(json,result){
            document.getElementById('aa').innerHTML=result;    
        },{uid:me['sinauid']});
    });
}

function qqweiboLogin(){
    var W = new Weibo('qq');
    W.login('801205896','http://weibo.uutown.com/oauth.html',function(){
        this.api('user/info',function(json,result){
            document.getElementById('aa').innerHTML=result;        
        });
    });
}

(function(){
var __WBME;
var Weibo = window.Weibo = function(type){
    this.cfg = {};
    this.cfg.sina = {
        name : '新浪',
        login : 'https://api.weibo.com/oauth2/authorize?client_id={appKey}&response_type=token&display=wap&redirect_uri={backUrl}',
        api : 'https://api.weibo.com/2/{api}.json?access_token={access_token}'
    };
    this.cfg.qq = {
        name : '腾讯',
        login : 'https://open.t.qq.com/cgi-bin/oauth2/authorize?client_id={appKey}&response_type=token&redirect_uri={backUrl}',
        api : 'https://open.t.qq.com/api/{api}?oauth_consumer_key={appKey}&access_token={access_token}&openid={openid}&clientip={clientip}&oauth_version=2.a&scope=all&format=json'
    };
    this.type = type;
    this.oauthWindow = 'weiboLoginWin';
    __WBME = this; //fix:appcan onOAuth时,会导致this指向错误
};
Weibo.prototype = {
    /*
    开始登陆
    appKey:应用的appkey
    backUrl:应用的回调地址
    *以上2项必须和开放平台的后台设置一致,否则必定会授权失败
    
    succCall:授权成功后触发该函数
    */
    login : function(appKey,backUrl,succCall){
        this.appKey = appKey;
        this.backUrl = backUrl;
        this.succCall = succCall;
        
        var type = this.type;
        uexWindow.onOAuthInfo=this.onOAuth;
        uexWindow.toast("1","5","正在加载"+ this.cfg[type].name +"微博登陆页面...",5000);
        //格式化登陆地址
        var url = this.cfg[type].login;
        uexWindow.open(this.oauthWindow,"0",
        url.replace('{appKey}',appKey).replace('{backUrl}',encodeURIComponent(backUrl)),
        "2","0","0","5");
        return this;
    },
    /*
    当授权窗口的URL发生变化时,appcan会触发该函数
    */
    onOAuth:function(winNam,url){
        var me = __WBME;
        if(winNam == me.oauthWindow && url.indexOf(me.backUrl)==0){
            //fix:SINA会回调2次,设置1S内只
            if(me.lastCall && new Date()-me.lastCall<1000)return;
            
            var par = url.split('#')[1],par = par.split('&');
            for(var k in par){
                var _karr = par[k].split('=');
                me[me.type + _karr[0]] = localStorage[me.type + _karr[0]] = _karr[1];
            }
            uexWindow.toast("0","5","授权成功 正在返回...",3000);
            me.lastCall = new Date();
            me.succCall && me.succCall.call(me);
        }
        return me;
    },
    /*
    授权成功后,返回login信息
    */
    getLoginInfo : function(type){
        var t = (type || this.type);
        return {
            'access_token':localStorage[t+'access_token'],
            'expires_in':localStorage[t+'expires_in'],
            'remind_in':localStorage[t+'remind_in'],
            'uid':localStorage[t+'uid'],
            'openid':localStorage[t+'openid'],
            'openkey':localStorage[t+'openkey']
        };
    },
    /*
    调用微博的API接口(所有接口可进入微博对应的文档查询)
    api : 接口地址,如:user/info
    succCall : 成功时回调函数
    data : 接口的参数,可选,如:{reqnum:1,fopenid:5673}
    requestType : 请求的类型,默认为GET
    errCall : 失败时回调函数
    */
    api : function(api,succCall,data,requestType,errCall){
        var info = this.getLoginInfo();
        var type=this.type,apiBase = this.cfg[type].api;
        
        var url = apiBase.replace('{api}',api)
        .replace('{access_token}',info['access_token'])
        .replace('{appKey}',this.appKey)
        .replace('{openid}',info['openid'])
        .replace('{clientip}','127.0.0.1');
        
        var rq = (requestType||'GET'),
        httpID = (this.httpID || 0) + 1;
        
        //拼接GET请求的url地址
        if(rq=='GET' && data){
            var par = [];
            for(k in data){
                par.push(k + '=' + encodeURIComponent(data[k]));    
            }
            url+= ('&'+par.join('&'));
        }        
        var httpID = (this.httpID || 0) + 1;
        uexXmlHttpMgr.open(httpID, rq, url,"");
        //设置POST内容
        if(rq=='POST' && data){
            for(var k in data){
                uexXmlHttpMgr.setPostData(httpID, "0", k, data[k]);
            }
        }
        uexXmlHttpMgr.onData = function(opid,status,result){
            uexXmlHttpMgr.close(httpID);
            var json = eval('('+ result +')');
            succCall && succCall(json,result);
        };
    uexXmlHttpMgr.send(httpID);
        this.httpID = httpID+1;
        return this;
    }
};

})();
</script>

</body>
</html>


#本文由刺鸟原创,欢迎转载,但请保留出处,也欢迎对本文感兴趣的同学多多交流。#

appCan离线手册手机版

作者:ciniao 时间:2012-08-05 分类:记录 2 Comments

    * 文章同步发布至appCan官方论坛http://bbs.appcan.cn/forum.php?mod=viewthread&tid=3525
    7月10日:
    公开源代码,供大家一起学习讨论参考。
    下载地址:http://uubox.me/app/appcanbook/appcanbook.zip

    7月5日更新:
    android版:http://uubox.me/app/appcanbook/appcanbook.apk
    IOS版:http://uubox.me/app/appcanbook/appcanbook.ipa
    之前一直在使用官方提供的appcanplay调试程序,每次修改好后,都需要copy到SD里去,操作比较麻烦,于是遂在本工具里增加了一个“项目调试工具”。实现原理:输入地址,点击开始调试后,系统会uexWindow.open一个name为root2的窗口,指向您所输入的地址,以达到调试的目的。见下图:
    

    6月28日:
    众所周知,目前appcan官方提供的API手册有多么的难用,本人经过几天查阅,终于不堪重负,决定用appcan本身来开发一个离线手册,经过一天一夜的整理,现在委婉发布0.1测试版本,尚有部分API未整理完成。

    离线版有什么优势?
    1:几乎重写了官方的所有示例,更简洁明了。
    2:随时随地都可以查看。 
    3:提供直接【执行代码】功能,可以更直观的看到最终效果。 

    使用中有BUG或文档不对怎么办?
    本文档未非官方版本,若有歧义时,请以官方在线版本API文档为准,我也会在最快时间内更新完成,并在线推送给已安装的用户来更新版本。若你在使用中有什么问题或建议,可以直接在本帖留言反馈。

    软件截图:
     

#本文由刺鸟原创,欢迎转载,但请保留出处,也欢迎对本文感兴趣的同学多多交流。#