Talk to us
Talk to us
menu

Blog Post

start building
Developer

How to implement Audio Mute in Video Calls

How to implement Audio Mute in Video Calls

Video calls have become one of the main ways we communicate with. Background noise or other distractions can sometimes make concentrating or holding a clear conversation difficult. That’s where the audio mute comes in handy. It allows users to temporarily silence their microphones, reducing background noise and improving the overall call quality.

In this guide, we’ll explore how you can mute audio for video calls and how it can improve your communication using ZEGOCLOUD Express Video SDK.

Express Video SDK Introduction

Developers can access a powerful toolkit for creating real-time video and audio, interactive services with ZEGOCLOUD’s Video Call (Express Video) SDK. This software provides the tools and features needed to bring your vision to life, from live show platforms to video conference applications.

Express Video covers you whether you’re just starting or looking to take your video-based service to the next level. The features of ZEGOCLOUD Video Call SDK are:

1. Easy to integrate: Because the SDK has such a straightforward and user-friendly user interface, integrating voice call capability into your application has never been more straightforward than it is now.

2. Enterprise-grade security: Use technologies such as encryption to safeguard calls and prevent unauthorized access to protect the privacy and security of your users.

3. Calls with high audio and video quality: Take pleasure in high-definition audio and video outputs with very little lag time and outstanding sound quality; they are ideal for real-time communication.

4. Audio and video effects: Captivate your users’ attention by providing them with enticing audio and visual effects, such as the ability to change their voice or enhance their visage.

Preparation

To get started, you first need the following:

  • ZEGOCLOUD developer account – Sign up
  • A device with internet connectivity that plays audio and video.
  • Some knowledge of web development.
  • Add Express Video SDK to your project. See Integration and Implementation for more information.

Express Video SDK Integration

Ready to integrate the Video Call Kit SDK into your project? Follow these steps to get started:

  1. Create a new project and set up a local web server for testing. To do this, create two new files in your project: index.html and index.js. Add the necessary code to index.html, and use the live-server add-on to start a local web server.
  2. Install and import the SDK into your project. To install the necessary dependencies, run the command “npm install zego-express-engine-webrtc“.

Then, add the following line to your index.js file: “**const ZegoExpressEngine = require('zego-express-engine-webrtc').ZegoExpressEngine;“. This will import the ZegoExpressEngine class and allow you to access the SDK’s features and functionality.

You can use the codes below as starting point in your index.js file:

<html>

<head>
    <meta charset="UTF-8">
    <title>Zego Express Video Call</title>
    <style type="text/css">
        * {
            font-family: sans-serif;
        }

        h1,
        h4 {
            text-align: center;
        }

        #local-video, #remote-video {
            width: 400px;
            height: 300px;
            border: 1px solid #dfdfdf;
        }

        #local-video {
            position: relative;
            margin: 0 auto;
            display: block;
        }

        #remote-video {
            display: flex;
            margin: auto;
            position: relative !important;
        }
    </style>
</head>

<body>
    <h1>
        Zego RTC Video Call
    </h1>
    <h4>Local video</h4>
    <div id="local-video"></div>
    <h4>Remote video</h4>
    <div id="remote-video"></div>
   </body>

</html>

With these steps completed, you’ll be well on integrating the Video Call Kit SDK into your project.

Audio Mute in Video Calls with ZEGOCLOUD

To mute audio in video calls using ZEGOCLOUD’s Express Video SDK on the web, you must follow the following steps:

  1. First, create an instance of the ZegoExpressEngine class and initialize it with your app ID and Server URL.
  2. Call the createStream method to create a new media stream.
  3. Call the useAudioDevice method on the stream object and pass in the “none” device ID to disable the audio input.
  4. Call the replaceTrack method on the stream object and pass in a new MediaStreamTrack object with the audio track disabled.
  5. Call the startPublishingStream method to begin streaming the muted audio.

Here’s some sample code that demonstrates these steps:

// Initialize the ZegoExpressEngine with your app ID and Server URL.
const zg = new ZegoExpressEngine(APP_ID, Server_URL);

// Create a new media stream.
const stream = await zg.createStream();

// Disable the audio input.
await stream.useAudioDevice("none");

// Create a new MediaStreamTrack object with the audio track disabled.
const audioTrack = new MediaStreamTrack(false, "audio");

// Replace the audio track on the stream with the disabled track.
await stream.replaceTrack(audioTrack);

// Start streaming the muted audio.
zg.startPublishingStream("stream1", stream);

With these steps, you should be able to mute audio in video calls using ZEGOCLOUD’s Express Video SDK on the web.

Run a Demo.

Conclusion

Muting audio for video calls in ZEGOCLOUD Express Video SDK is a useful feature that allows users to silence their microphones during a call. This can be useful when the user needs to step away from the call for a moment or if background noise could disrupt the call. It is important to note that muting audio during a video call will not end the call but instead will simply silence the user’s microphone. This feature can be easily turned on and off as needed, making it a convenient and practical tool for video calls in ZEGOCLOUD Express Video SDK.

You’ve decided to start muting video calls and audio and want to know if you’re ready. Using a source code demo as a starting point is a terrific way to get started.

And if you encounter any problems along the way, don’t fret; our technical support team is always ready to answer your questions and help you with our goods.

Read More

ZEGOCLOUD
ZEGOCLOUD With our fully customizable and easy-to-integrate Live SDK, you can quickly build reliable, scalable, and interactive live streaming into your mobile, web, and desktop apps.

Related posts