Documentation
Documentation
Demo APP
SDK 中心
API 中心
FAQ
代码市场
Console
Sign Up
Log In
中文站 English
Video Call
Product

ZEGO UIKits

  • In-app Chat Kit
  • Call Kit
  • Live Streaming Kit
  • Video Conference Kit
  • Live Audio Room Kit New

Cloud Communications Products

  • Video Call
  • Voice Call
  • Live Streaming
  • In-app Chat

Low-Code Products

  • RoomKit

AIGC

  • Virtual Avatar
  • Digital Human PaaS New

Supporting Services

  • Super Board
  • AI Effects
  • Cloud Recording
  • Admin Console
  • Mini Game Engine New
  • iOS
  • Android
  • Web : JavaScript
  • Flutter
  • React Native
  • Electron
  • Unity3D
  • Cocos Creator
  • Windows
  • macOS
  • Linux
Expand All
  • Overview
  • Develop your app
    • Integrate the SDK
    • Implement a basic video call
    • Enhance basic feature
      • Use Tokens for authentication
      • Check the room connection status
      • Set up common video config
      • Set up common audio config
  • Best practices
    • Implement a video call for multiple users
  • Upgrade using advanced features
    • Advanced features
      • Configure the video
        • Improve your appearance in the video
        • Configure video codec
      • Improve video quality
        • Visualize the sound level
        • Monitor streaming quality
      • Message signaling
        • Broadcast real-time messages to a room
        • Quotas and limits
      • Share the screen
      • Mix the video streams
      • Publish multiple video streams
      • Replace the audio/video track
    • Distincitve features
      • Join multiple rooms
      • Customize the video and audio
      • Set the voice hearing range
      • Render the audio and video
      • Autoplay policy
      • Restrictions on playing multiple videos simultaneously in Safari
      • Play streams via URL
      • Browser compatibility
      • Audio mixing
      • Vitrual Background and Blur
    • Implement a video call using frameworks
      • Implement a video call using Vue
      • Implement a video call using Angular
      • Implement a video call using React
  • Resources & Reference
    • SDK
    • Sample codes
    • API reference
      • Client APIs
      • Server APIs
    • Debugging
      • Error codes
      • Logging/Version number
    • FAQs
    • Key concepts
  • Documentation
  • Video Call
  • Resources & Reference
  • Sample codes
Sample Code
GitHub
  • GitHub
Description
Experience the Features
GitHub
  • GitHub

Guidelines for Running Sample Codes

This article describes how to quickly run the sample source code and experience basic audio and video calling services.

Prerequisites

Before starting to integrate the ZEGO Express SDK, please install a browser supported by ZEGO SDK has been installed, as shown in the following table:

Browser Windows 7 or later MacOS 10 or later Android 4.4 or later iOS 11 or later
Chrome 58 or later ✔️ ✔️ ✔️ Stream Playing only
FireFox 56 or later ✔️ ✔️ ✔️ Stream Playing only
Safari 11 or later N/A ✔️ N/A ✔️
Opera 45 or later ✔️ ✔️ Supported on some models only ✖️
WebView N/A N/A ✔️
  • iOS 14.3 or above supports push-pull streaming
  • iOS 14.3 and below only support push-pull streaming

Only support SSL web server (https), localhost, 127.0.0.1 is equivalent to https.

Then go to ZEGOCLOUD Admin Console to create a project, apply for a valid AppID, and obtain the access server address Server URL.

Run the Sample Codes

  1. Open the ./src/Examples/DebugAndConfig/InitSettings/index.html file with a supported browser, and enter the AppID and Server URL you get in the previous step, and then click Set.

/Pics/Web/ExpressSDK/SampleRunningGuide/epxress_demo_new_en.png

  1. After the supplement is complete, you can start to experience the Demo function. Please use a supported browser to open the HTML file of each scene function in the "./src/Examples" folder. For example, open the "index.html" under the "QuickStart/CommonUsage" folder, and the interface will be displayed as shown in the figure below.

/Pics/Web/ExpressSDK/SampleRunningGuide/UI_interface_new_en.png

If the local path where the page is stored contains Chinese characters, when the page is opened, some browsers may fail to load CSS and other style files, and the page will display abnormally. It is recommended that developers set all the path names of source files to "English characters".

Experience Real-time Audio and Video Functions

We recommend you run your project on a real device. If your app runs successfully, you should hear the sound and see the video captured locally from your device.

To test out the real-time audio and video features, visit the ZEGO Express Web Demo, and enter the same AppID, Server and RoomID to join the same room. If it runs successfully, you should be able to view the video from both the local side and the remote side, and hear the sound from both sides as well.

In audio-only scenarios, no video will be captured and displayed.

Page Directory
  • Free trial