PC端–milo登录

组件CDN:

<script src="//ossweb-img.qq.com/images/js/milo_bundle/milo.js"></script>

代码示例:登录前的容器ID名为 unlogin、登录后的容器ID名为 logined,登录后用户信息ID名为 login_qq_span均不可修改。
DOM部分:

    <!--登录前状态 Start-->
    <div id="unlogin" class="login" style="display: block;">
        你好,请【<a id="btn_qqlogin" href="javascript:void(0)" title="QQ登录">QQ登录</a>】
       【<a id="btn_wxlogin" href="javascript:void(0);" title="微信登陆">微信登陆</a>】
       【<a id="btn_wxandqqlogin" href="javascript:void(0);" title="一体化登录">QQ微信一体化登录</a>】
     </div>
    <!--登录前状态 End-->
    <!--登录后状态 Start-->
    <div id="logined" class="login" style="display: none;">
        欢迎您,<span id="login_qq_span"></span> 
        <span id="ams_user_headimg"></span> 
       【<a id="btn_logout" href="javascript:void(0)" title="注销">注销</a>】
    </div>
    <!--登录后状态 End-->

JS部分:

 <script src="//ossweb-img.qq.com/images/js/milo_bundle/milo.js"></script>
    <script>
        milo.ready(function () {
    need("biz.login",function(LoginManager){
        //QQ登录
        milo.addEvent(g('btn_qqlogin'),'click',function(e){
            LoginManager.login();
        });
        //微信登录
        milo.addEvent(g('btn_wxlogin'),'click',function(e){
            LoginManager.loginByWx({
                "appId":"xxxxxxx",  //游戏在微信的appid,联系内部
                gameDomain:"xxx.qq.com",
                serviceType:"xxx"
            });
        });

        //QQ微信一体化登录
        milo.addEvent(g("btn_wxandqqlogin"),"click",function(){
            LoginManager.loginByWXAndQQ({
                "appId":"xxxxxxx", //游戏在微信的appid
                gameDomain:"xxx.qq.com",
                serviceType:"xxx"
            },function(){
                alert("已登录,即将刷新页面");
                location.reload();
            });
        });

        //检查登录态
        milo.addEvent(g("checkLogin"),"click",function(){
            LoginManager.checkLogin(function(userInfo){
                g("loginInfobox").innerHTML="已登录:<br/>"+JSON.stringify(userInfo);
            },function(){
                g("loginInfobox").innerHTML="未登录";
            })
        })

        //注销
        milo.addEvent(g("btn_logout"),"click",function(){
            LoginManager.logout();
        })

        var chkLoginFunc=function(str){
            LoginManager.checkLogin(function(){
                console.log("已登录: "+str);
            },function(){
                console.log("未登录: "+str);
            })
        }
        //执行验证登陆操作
        LoginManager.checkLogin(function(userinfo){
            //此处返回用户的基本信息
            console.log("已登录:\n",userinfo);
            //如果登陆类型是qq,使用LoginManager.getUserFace方法去获取头像
            if (userinfo.logtype=="qq"){
                LoginManager.getUserFace(function(data){
                    $("#ams_user_headimg").html("<img src=\""+data.userFace+"\"> ");
                });
            }else if(userinfo.logtype=="wx"){
                //如果登陆类型是wx微信,就直接获取基本信息里的头像
                $("#ams_user_headimg").html("<img src=\""+userinfo.headimgurl+"/64\"> ");
            }

        },function(){
            console.log("未登录");
            //LoginManager.init();
        });
    });
});
</script>

iframe方式

视频点播:

<div id="video_container"></div>
<script type="text/javascript" src="//vm.gtimg.cn/tencentvideo/txp/js/iframe/api.js"></script>
<script>
    // 点播方式
    var player = new Txp.Player({
        containerId: 'video_container',
        width:800,
        height:600,        
        vid: '点播ID',
        autoplay:false,
        mini:false  //是否使用迷你皮肤
    });
</script>



视频直播:

<div id="video_container"></div>
<script type="text/javascript" src="//vm.gtimg.cn/tencentvideo/txp/js/iframe/api.js"></script>
<script>
    // 直播方式
    var player = new Txp.LivePlayer({
        containerId: 'video_container',
        vid: '直播ID',
        width:800,
        height:600,
        autoplay:false,
        livepid: '',    
    });
</script>


JS方式

视频点播:

<div id="container"></div>
<!-- 使用相对协议,同时支持http和https -->
<script src='//vm.gtimg.cn/tencentvideo/txp/js/txplayer.js'></script>
<script>
    var player = new Txplayer({
        containerId: '点播容器dom的ID',
        vid: '点播vid',
        width: '600',
        height: '400',
        autoplay: true
    });
</script>



视频直播:

<script src="//ossweb-img.qq.com/images/js/jquery/jquery-1.11.3.min.js"></script>
<script src="//vm.gtimg.cn/tencentvideo/txvlive/2017/txvlive.js"></script>
<script>
    var config = {
        containerId: '直播容器dom的ID',
        vid: '直播ID',
        livepid: '',
        width: '670',
        height: '377',
        autoplay: true
        };
    var player = new TxvLive(config);
    player.on('ready', function () {
    //准备完成开始播放
    });
</script>



API:

player.play(); //播放视频,可用作无刷新切换

// 播放视频对象参数

player.play({vid: 'xxx', autoplay: true})

// 播放视频vid 字符串参数

player.play('xxx')

player.pause(); //暂停视频

player.togglePlayPause(); //暂停或播放视频

player.seekTo( Number::time ) //跳到指定时间点播放

player.getPlayerState() //获取视频播放状态(-1(未开始)、0(已结束)、1(正在播放)、2(已暂停)、3(正在缓冲))

player.mute(); //静音

player.unMute();//取消静音

player.setPoster(String::url); //设置封面图


H5端–millo登录

组件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>