qq第三方登录

JS_SDK 方式简单到不行,几乎0操作。

相关链接:http://qzonestyle.gtimg.cn/qzone/openapi/js-sdk-demo.html

不过还是记录下。

@section Css{
    @*<script type="text/javascript" src="http://qzonestyle.gtimg.cn/qzone/openapi/qc_loader.js" data-appid="APPID" data-redirecturi="REDIRECTURI" charset="utf-8"></script>*@
 
    <script>
        var appid = /Android|webOS|iPhone|iPod|BlackBerry/i.test(navigator.userAgent) ? "1111111" : "2222222";    
    </script>
    <script type="text/javascript"
            src="http://qzonestyle.gtimg.cn/qzone/openapi/qc_loader.js" 
            data-appid="@Model.AppId"
            data-redirecturi="http://xxx.com/account/login" charset="utf-8"  data-callback="true" ></script>
}

以上,先来个js端的check客户端吧?但是不方便嵌入到下面的链接js去。还是用了服务端返回的appid。

问题来了,为什么会动态appid,这是qq的坑。每个应用给你一个appid,还让你去openid获取unionid。

不过无所谓,多请求个unionid作为唯一标识吧。

注意到这里data-callback="true" ,是的,写在一个页面了。因为跳转回写就是这个页面。如果你用其它callback,那就按最初的写法。好处是,单独接收,不需这里的每次加载一些不相干的东西。自行取舍吧。

     var redirectFlag = true;//wap手机网站会有页面跳转问题,所以就不用这个方案了
                    //if (QC.Login.check()) {//如果已登录
                    //  redirectFlag = false;//就不需要跳转
                    //}
                    //调用QC.Login方法,指定btnId参数将按钮绑定在容器节点中
                    QC.Login({
                        //btnId:插入按钮的节点id,必选
                        btnId: "qqLoginBtn",
                        //用户需要确认的scope授权项,可选,默认all
                        scope: "all",
                        //按钮尺寸,可用值[A_XL| A_L| A_M| A_S|  B_M| B_S| C_S],可选,默认B_S
                        size: "B_M"
                    }, function (reqData, opts) {//登录成功
                        //根据返回数据,更换按钮显示状态方法

                        var dom = document.getElementById(opts['btnId']),
                            _logoutTemplate = [
                                //头像
                                '<span><img src="{figureurl}" class="{size_key}"/></span>',
                                //昵称
                                '<span>{nickname}</span>',
                                //退出
                                '<span><a href="javascript:QC.Login.signOut();">退出</a></span>'
                            ].join("");
                        dom && (dom.innerHTML = QC.String.format(_logoutTemplate, {
                            nickname: QC.String.escHTML(reqData.nickname),
                            figureurl: reqData.figureurl
                        }));
                        if (redirectFlag) {
                            ////每次页面加载都会执行--》没机会退出qq了!!所以加了flag判断是否已经登录的,是就不跳转了。
                            setTimeout(QC.Login.getMe(function (openId, accessToken) {
                                location.href = '/a?handler=R&name=' + reqData.nickname + "&openid=" + openId + "&otype=1&token=" + accessToken;
                            }),3000)
                        }

                    }, function (opts) {//注销成功
                        location.href = '/';
                    });

后记,搞完了pc,wap端的跳转好像不好使,pc端是跳出来个窗口页面,登录后消失。wap则直接跳过去了,卡在那不动了。区别是造成了QC.Login.check()。

所以这里就给3秒退出的机会吧。

顺便吐槽下300微信登录。

:: [QQConnect] > access_token丢失 : _getMeError

关于这个东东,唉,咋回事?好像不影响。先这样吧。

原文地址:https://www.cnblogs.com/zhoudelun/p/9360277.html