Customize how the video captures

Introduction

When the ZEGOCLOUD SDK's default video capture module cannot meet your application's requirement, the SDK allows you to customize the video capture process. By enabling custom video capture, you can manage the video capture on your own and send the captured video data to the SDK for the subsequent video encoding and stream publishing. With custom video capture enabled, you can still call the SDK's API to render the video for local preview, which means you don't have to implement the rendering yourself.

Listed below are some scenarios where enabling custom video capture is recommended:

• Your application needs to use a third-party beauty SDK. In such cases, You can perform video capture, and video preprocessing using the beauty SDK and then pass the preprocessed video data to the ZEGOCLOUD SDK for the subsequent video encoding and stream publishing.
• Your application needs to perform another task that also needs to use the camera during the live streaming, which will cause a conflict with the ZEGOCLOUD SDK's default video capturing module. For example, it needs to record a short video clip during live streaming.
• Your application needs to live stream with video data captured from a non-camera video source, such as a video file, a screen to be shared, or live video game content.

Prerequisites

Before you begin, make sure:

• Create a project in ZEGOCLOUD Admin Console, and get the AppID and ServerSecret of your project.
• Integrate the Video Call SDK into the project. For details, see Integration and Implementation.

Implementation Steps

To publish a stream with a custom video source, you can set up the "source" parameter to specify the video source when calling createZegoStream to create the ZegoLocalStream. Then, call startPublishingStream to publish the stream.

• Use a third-party media stream as the video source

  To push streams from custom video sources, you can create a ZegoLocalStream instance object by calling the createZegoStream interface, and specify the third-party data source by setting the "source" parameter. Then, call the startPublishingStream to publish the stream.

```javascript
//Start previewing the third-party media stream. 
previewVideo.srcObject = mediaStream;

// Use the third-party media stream as the video source to create a stream.
const stream = await zg.createZegoStream({
    custom: {
        video: {
            source: mediaStream
        },
        audio: {
            source: mediaStream
        }
    }
})
zg.startPublishingStream(idName, stream);
```

• Use an Audio or Video object as the video source

  Call the createZegoStream interface to create a third-party audio and video stream, and then call the startPublishingStream interface to push the stream.

  Set the "source" parameter of the API createZegoStreamas a "custom" object, and assign the <audio> or <video> object to the "source" property of the "custom" object. The audio or video source of the <audio> or <video> object will also be used for local preview.

  // Use localVideo, a <video> object, as the video source to create a stream.
  const stream = await zg.createZegoStream({
      custom: {
          video: {
              source: localVideo
          },
          audio: {
              source: localVideo
          }
      }
  })