StreamCreated订阅上的Opentok使移动铬冻结

时间:2017-10-13 08:16:39

标签: google-chrome mobile vue.js opentok

我正在开发opentok平台和vue.js上的webRTC聊天。虽然在desctop和移动firefox浏览器上一切正常,但在尝试订阅event.stream时,移动Chrome会挂起。奇怪的是,如果我激活开发人员工具,那么它将按照预期在移动chrome上运行,因此我无法调试此错误日志。我已经在这三天里绞尽脑汁了。如果有人可以帮助我,我会很感激!这是我的代码的相关部分:

    //start the live vicdeo sessiion
    startLivevideoSession: function(session){

        this.call = true; //set call to true

        //initiate opentok session
        this.LiveVideo_session = OT.initSession(session.apiKey, session.session)

        //define on streamcreated method
        this.LiveVideo_session.on('streamCreated', function(event) {

                //this is the problem:
                this.LiveVideo_session.subscribe(event.stream, 'stream_video1', {
                      height: '100%',
                      width: '100%',
                      showControls: true,
                      style: {
                        audioLevelDisplayMode: 'auto',
                        buttonDisplayMode: 'off',
                        nameDisplayMode: 'off',
                        videoDisabledDisplayMode: 'auto',
                        showArchiveStatus: false
                      }
                }, this.handleError)
                //problem ends


            }.bind(this))

        //define on sessionDisconnected method
        this.LiveVideo_session.on("sessionDisconnected", function (event) {

                if(this.call){
                    this.stopVideoButtonPress() //stop on going chat session if any
                    bus.$emit('showModal', "stopLivevideoSessionLeft"); //notify user that other user left the page
                }
            }.bind(this))

        //define connect method
        this.LiveVideo_session.connect(session.token, function(error) {

                if(error){
                    this.handleError(error)
                }else{

                    //if call mode is chat, do not publish chat at all
                    if(this.call_mode != 'chat'){
                        this.LiveVideo_session.publish(this.my_video); //publish my video to chatroom
                    }

                    //if testsession, publish stream also to stream_video1
                    if(this.testSession){
                        this.LiveVideo_session.publish(this.test_publisher)
                    }
                }

            }.bind(this));

        //store session.premium_session to premium_session
        this.premium_session = session.premium_session

        //wait for UI elements to be created on page before OT.initPublisher
        setTimeout(() => {
            //setup my_video
            if(this.call_mode == "audio") //if only audio is selected
                var publisherOptions = {
                  videoSource: null,
                  name: this.connection_setup.stream_video_description+" (vain ääni)",
                  width: '100%',
                  height: '100%',
                  opaque: '1',
                  style: {
                    nameDisplayMode: "on",
                    audioLevelDisplayMode: "on",
                    }
                }
                else
                //setup my_video for videochat
                var publisherOptions = {
                  name: this.connection_setup.stream_video_description,
                  width: '100%',
                  height: '100%',
                  opaque: '1',
                  style: {
                    nameDisplayMode: "on",
                    audioLevelDisplayMode: "on",
                    }
                }

            //if call mode is chat, do not publish chat at all
            if(this.call_mode != 'chat'){
                console.log("call mode"+this.call_mode)
                this.my_video = OT.initPublisher('my_video', publisherOptions, this.handleError)
            }

            //if testsession, publish stream also to stream_video1
            if(this.testSession){
                console.log("call testSession "+this.testSession)
                publisherOptions.name = 'Sinun kuvasi keskustelukumppanin näkemänä';
                this.test_publisher = OT.initPublisher('stream_video1', publisherOptions, this.handleError)
            }

        }, 600);

    },

1 个答案:

答案 0 :(得分:1)

Chrome可能冻结,而不是opentok。请参阅this chrome 61/android bug,其中包括添加border-radius

的解决方法