2017-10-13 3 views
1

私はopentokプラットフォームとvue.jsでwebRTCチャットを開発中です。 desctopとモバイルのFirefoxブラウザではすべて問題なく動作しますが、モバイルChromeは、event.streamに登録しようとするとハングアップします。奇妙なことは、私が開発者のツールを起動すると、期待通りにモバイルクロムで動作するので、エラーログをデバッグできないということです。私はこれで3日間私の脳を揺らしています。誰かが私を助けることができるなら、私はそれを感謝します!ここに私のコードの関連部分があります:Opentok on stream作成した登録はモバイルクロムフリーズ

//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

これは、クロムが凍っているかもしれない、opentokではありません。ボーダー半径を追加する回避策を含むthis chrome 61/android bugを参照してください

+0

ありがとうございました!それは問題を解決しました! –

関連する問題