如何获取 Agora io 屏幕共享取消事件？答案

【问题标题】：How to get Agora io Screen sharing cancel event?如何获取 Agora io 屏幕共享取消事件？
【发布时间】：2019-09-24 02:49:46
【问题描述】：

我正在使用 agora io 进行视频通话和屏幕共享。屏幕共享工作正常。但问题是当我取消屏幕共享时，流不显示。但加入仍然有效。我需要捕捉屏幕共享的取消事件。我已阅读文档，但没有关于取消事件的线索。您能帮忙取消活动吗？提前谢谢。

【问题讨论】：

标签： cancellation screensharing agora.io

【解决方案1】：

    If you are using agora web sdk ng library then you can detect this by using track-ended event.
    
    We can create screen track using createScreenVideoTrack in this sdk.
step-1 call this method to create track
     async shareScreen() {
        const localScreenTrack = await AgoraRTC.createScreenVideoTrack();
        return localScreenTrack;
      }
 
step2- call event method after creating track.
 
    To add event on this track create different method to handle event
    shareScreenEvent(){
    const track = this.shareScreen()
    
     if (track) {
          track.on('track-ended', () => {
            console.log('track-ended');
    console.log('you can run your code here to stop screen')
          })
        }
    }

【讨论】：

【解决方案2】：

如果你使用的是 Agora Web SDK NG，那么你可以这样使用-

screen_rtc.screenTrack.close();

这里 screen_rtc 是我的客户端对象，你也可以像下面这样禁用屏幕客户端 -

screen_rtc.client.leave();

我的屏幕共享完整代码如下-

<!-- Import Agora -->
     import AgoraRTC from "agora-rtc-sdk-ng";

<!-- Create client for screen -->
      screen_rtc: {
       client: null,
       screenTrack: null,
      },

<!-- Start Screen sharing -->
     screen_rtc.client = AgoraRTC.createClient({
       mode: "rtc",
       codec: "vp8",
     });

     await screen_rtc.client.join(
       <YOUR_APP_ID>,
       <YOUR_CHANNEL_NAME>,
       <YOUR_TOKEN>,
       null
    );

    screen_rtc.screenTrack = await AgoraRTC.createScreenVideoTrack();
    await screen_rtc.client.publish(screen_rtc.screenTrack);

<!-- Stop screen sharing -->
   screen_rtc.screenTrack.close();
   await screen_rtc.client.leave();

【讨论】：

【解决方案3】：

Agora 的 Web SDK 不提供任何检测方法，但由于 Agora Web SDK 是基于 Web RTC 的，因此您可以利用 navigator 对象和 catch 错误。

navigator.mediaDevices.getUserMedia(constraints).then(function success(stream) {
    /* media access has been granted */
}).catch(function(err) {
    //log to console first 
    console.log(err); /* handle the error */
    if (err.name == "NotFoundError" || err.name == "DevicesNotFoundError") {
        //required track is missing 
    } else if (err.name == "NotReadableError" || err.name == "TrackStartError") {
        //webcam or mic are already in use 
    } else if (err.name == "OverconstrainedError" || err.name == "ConstraintNotSatisfiedError") {
        //constraints can not be satisfied by avb. devices 
    } else if (err.name == "NotAllowedError" || err.name == "PermissionDeniedError") {
        //permission denied in browser 
    } else if (err.name == "TypeError" || err.name == "TypeError") {
        //empty constraints object 
    } else {
        //other errors 
        console.log("Error: " + err.name);
    }
});

参考链接：https://blog.addpipe.com/common-getusermedia-errors/
代码笔演示：https://codepen.io/naicuoctavian/pen/wPeZWO

【讨论】：

【解决方案4】：

这是一个错误，您应该处理它。如果用户取消屏幕共享，屏幕轨道将需要停止并离开。所以，你可以简单地使用 try/catch。

try {
      await clientScreen.join(appId, channelName, rtcToken, screenShareUid);

      const screenTrack = await AgoraRTC.createScreenVideoTrack(
        {
          encoderConfig: interviewInfo.video_encoding[0] as VideoEncoderConfiguration,
        },
        'disable'
      );
      screenTrack.on('track-ended', () => {
        handleStopShareScreen();
      });

      if (screenTrack) {
        await clientScreen.publish(screenTrack);
      }
    } catch (e) {
      handleStopShareScreen();
    }
  };

和handleStopShareScreen函数：

const handleStopShareScreen = async () => {
    if (screenShareTrack) {
      screenShareTrack.stop();
      screenShareTrack.close();
    }
    clientScreen.removeAllListeners();
    await clientScreen.leave();
  };

【讨论】：