Tencent Cloud

Recent Pages

Web

Last updated: 2024-09-06 15:37:02

This article will introduce how to quickly implement an audio and video call demo. You will complete the following key steps within 10 minutes and ultimately obtain a video call feature with a full user interface.
﻿
﻿
﻿
Environment preparations
﻿Node.js version 16+.
Modern browser, supporting WebRTC API.
Step 1: Download the demo
1. Open the terminal and clone the repository.
git clone https://github.com/Tencent-RTC/TUICallKit.git﻿
2. Install dependencies.
React
Vue3
 cd ./TUICallKit/Web/basic-react
 cd ./TUICallKit/Web/basic-vue3
 npm install
Step 2: Configure the demo
﻿Go to the Activate Service page and get the SDKAppID and SDKSecretKey, then fill them in the GenerateTestUserSig-es.js file.
React
Vue3
File path: TUICallKit/Web/basic-react/src/debug/GenerateTestUserSig-es.js
﻿
﻿
﻿
File path: TUICallKit/Web/basic-vue3/src/debug/GenerateTestUserSig-es.js
﻿
﻿
﻿
Step 3: Run the demo
Open the terminal, copy the sample command to run the demo.
TUICallKit/Web/basic-react
TUICallKit/Web/basic-vue3
npm run dev
npm run dev
Warning:
For local environments, access under the localhost protocol. For public network experience, access under the HTTPS protocol. For details, refer to Network Access Protocol Instructions.
Step 4: Make your first call
1. Open the browser page, enter the project run address, and log in to userID (defined by you).
﻿
﻿
﻿
2. Input the callee's userID and click all to experience your first call.
﻿
﻿
﻿