Run the mini program demo

Procedure

1. Download and unzip the SDK and sample code from GitHub Demo or Gitee Demo.

2. In the root directory of the project, run the following commands in your terminal:

   cd MiniProgram/miniprogram
   npm install

3. Build npm

   After importing the project into WeChat DevTools, click "Tools" → "build npm" from the menu bar. Wait for the build process to complete.

4. Configure the token and other join parameters. You can use one of the following three methods:

   For more information about tokens, see Use a token for authentication.

   1. Use a token generated from the console

   In miniprogram/services/service/user_config.js, configure the following parameters:

   export const userConfig = {
     appId: 'your-app-id',      // The AppId obtained from the console.
     userId: 'test-user-001',   // The user ID. This is optional. If left empty, a random ID is generated.
     channelId: 'test-channel', // The channel name. This is optional. If left empty, a default value is used.
     env: 'onertcOnline',       // The environment: 'onertcOnline' (production) or 'onertcPre' (pre-release).
   };

   Log in to the Real-Time Communication (RTC) console. In the left-side navigation pane, choose Tools. On the Tools page, generate a token using the parameters you configured above.

   In miniprogram/services/service/tools.js, return the generated token within the getAppToken function.

   export const getAppToken = async (
     userId,
     appId,
     channelId,
     duration = '',
     delay = '',
     env = 'onertcOnline',
   ) => {
     return {
       token: 'Enter the token generated from the console here',
       gslb: '', // Keep this as an empty string.
     };
   };

   This method is suitable for quick tests. Do not use it in a production environment.

   2. Generate a token within the demo

   In miniprogram/services/service/user_config.js, configure the following parameters:

   export const userConfig = {
     appId: 'your-app-id',      // The AppId obtained from the console.
     userId: 'test-user-001',   // The user ID. This is optional. If left empty, a random ID is generated.
     channelId: 'test-channel', // The channel name. This is optional. If left empty, a default value is used.
     env: 'onertcOnline',       // The environment: 'onertcOnline' (production) or 'onertcPre' (pre-release).
   };

   Refer to the Node.js examples on GitHub or Gitee, and implement the getAppToken function in miniprogram/services/service/tools.js to generate a token based on your AppId and AppKey.

   export const getAppToken = async (
     userId,
     appId,
     channelId,
     duration = '',
     delay = '',
     env = 'onertcOnline',
   ) => {
     // Generate a token here based on the Node.js sample code.
     return {
       token: 'Enter the dynamically generated token here',
       gslb: '', // Keep this as an empty string.
     };
   };

   This method is suitable for quick tests. Do not use it in a production environment.

   3. Implement token generation on your application server

   Implement the getAppToken function in miniprogram/services/service/tools.js to request a token from your application server endpoint.

   export const getAppToken = async (
     userId,
     appId,
     channelId,
     duration = '',
     delay = '',
     env = 'onertcOnline',
   ) => {
     // Send an HTTPS request to your application server to get the token.
     return {
       token: 'Enter the token returned from your server here',
       gslb: '', // Keep this as an empty string.
     };
   };

   This method is suitable for a production environment.

5. Compile and run the demo.

   In WeChat DevTools, click the "Compile" button to run the demo.