组件CDN:
<script src="//ossweb-img.qq.com/images/js/mobile_bundle/milo.js"></script>
代码示例:登录前的容器ID名为 unlogin、登录后的容器ID名为 logined,登录后用户信息ID名为 login_qq_span均不可修改。
DOM部分:
<!-- 登录信息 --> <div id="ams_loginbar"> <div id="unlogin"> 你好,请<a id="ptLoginBtn" href="javascript:;" style="cursor: pointer;">[QQ登录]</a> <a id="wxloginBtn" href="javascript:void(0);">[微信登录]</a> </div> <div id="logined" style="display: none;"> <span>欢迎您,</span> <span id="userinfo">1079682165</span> 【<a id="ptLogoutBtn" href="javascript:;" style="cursor: pointer;">注销</a>】 </div> </div>
JS部分:
<script src="//ossweb-img.qq.com/images/js/mobile_bundle/milo.js"></script> <script> milo.ready(function () { need("biz.login", function (LoginManager) { LoginManager.init({ appConfig: { "avoidConflict":"false",//默认值为空,判断是否需要校验微信登录态串号,设为true,为必须校验,设为false,为不校验,默认值""表示在微信环境下校验,其它app环境下不校验 "QQBrowserAppId": "xxx", //在QQ浏览器端申请的APPID,联系内部同学 "WxAppId" : "xxxxxxxxxxx", //需要在微信申请openLink权限,联系内部同学 "AppName" : "业务的中文名称", //业务的中文名称 "scope" : "snsapi_base", //默认是 snsapi_base 静默授权,如果游戏无静默权限,就需要手动改成 snsapi_userinfo "LogoUrl" : "//ossweb-img.qq.com/images/feiji/web201507/logo.png" //业务在授权时需要显示的正方形标准Logo,图片要求:尺寸:100x100px } }); //QQ登录 milo.addEvent(g('ptLoginBtn'), 'click', function (e) { LoginManager.login(); }); //微信登录 milo.addEvent(g('wxloginBtn'), 'click', function (e) { LoginManager.loginByWX(); }); //检查登录态 LoginManager.checkLogin(function(userInfo){ console.log("已登录"); console.log("登录信息:",userInfo); },function(){ console.log("未登录"); }); //注销 milo.addEvent(g("ptLogoutBtn"),"click",function(){ LoginManager.logout( { logoutCallback:function(){ alert("已注销"); } } ); }) }); }); </script>