Updated on 2023-03-23 GMT+08:00

Building the Electron Demo

This section describes how to quickly compile and run the Electron demo of the client SDK.

Environment Requirements

Ensure that the following environment requirements are met during the compilation and running of the Electron demo.

Table 1 Windows Environment Requirements

Environment and Tool

Version

Description

OS

Windows 10 Professional

Hardware requirements

  • CPU: i5-2400 quad-core, 3.1 GHz or above
  • Memory: 4 GB or above

Python

3.x

Optional. This tool is required only when add-ons need to be recompiled.

Microsoft Visual Studio

Visual Studio 2017

Optional. This tool is required only when add-ons need to be recompiled.

Node.js

14.16.0 or later

N/A

Electron

13.6.7 or later

N/A

Requesting test resources and app IDs

N/A

For details, see Preparations.

For details about the version mapping between Node.js and Electron, see https://www.electronjs.org/docs/latest/tutorial/electron-timelines.

Table 2 macOS environment requirements

Environment and Tool

Version

Description

OS

macOS 10.15

N/A

Xcode

12.0 or later

N/A

Node.js

14.16.0 or later

N/A

Electron

13.6.7 or later

N/A

node-gyp

8.1.4 or later

Used for compiling the JavaScript bridge dynamic library.

bindings

1.5.0

Used for compiling the JavaScript bridge dynamic library.

Requesting test resources and app IDs

N/A

For details, see Preparations.

Procedure

  1. Download the SDK and demo source code.

    1. Download the Electron SDK ZIP package (for example, hwmsdk-electron-70.16.5.zip) by referring to Table 1.
    2. Decompress the ZIP package to obtain the following files and directories:
      Figure 1 Directory structure of the SDK package

  2. Prepare for the environment.

    1. When compiling add-ons, ensure that the corresponding compilation environment is available. Otherwise, an error is reported due to compilation failure.

    Windows:

    • Node.js
    • Python 3.x: Configure environment variables.
    • Visual C++: Visual C++ build tools or Visual Studio Community (Select Desktop environment with C++.)
    • Electron: Take 13.6.7 as an example. Run the npm install electron@13.6.7 -g command.

    macOS:

    • Node.js
    • Xcode
    • Electron: Take 13.6.7 as an example. Run the npm install -electron@13.6.7 –g command.
    • node-gyp: Run the npm install node-gyp -g command.
    • bindings: Run the npm install bindings -g command.

    2. If Node.js has been installed, configure the npm image first.

    Before installing the dependency, run the following commands to configure the npm image to improve the installation speed:

    npm config set registry http://registry.npm.taobao.org/
    npm config set electron_mirror https://npm.taobao.org/mirrors/electron/

  3. Request an app ID and change the app ID in the demo to the requested one.

    For details about how to request an app ID, see Introduction to App ID Authentication.

    Set appId in hwmsdk-electron\demo\src\UIDemo\login\Init\index.js to the obtained app ID.

    Figure 2 Replacing the app ID

  4. Compile add-ons.

    1. If Node.js has been installed, run the following command to check whether the Node.js version is 32-bit or 64-bit. The result x64 indicates 64-bit and ia32 indicates 32-bit.

    $ node -p "process.arch"

    2. If Node.js is not installed, download the required version from the Node.js website.

    1. Run the .bat or .sh script in the hwmsdk-electron directory to compile the add-on project. The script installs the corresponding environment and triggers compilation. The corresponding HwmUisdk.node file is generated in the build\Release directory.

    • To compile Windows 32-bit add-ons when the Node.js version is 32-bit, run build_nodeaddon_win32.bat in the directory generated after decompression in step 1.
    • To compile Windows 64-bit add-ons when the Node.js version is 64-bit, run build_nodeaddon_x64.bat in the directory generated after decompression in step 1.
    • To compile macOS add-ons, run build_nodeaddon_mac.sh in the directory generated after decompression in step 1.

      The .bat or .sh script can perform the following operations:

      • Compile add-ons, generate the HwmUisdk.node file, and copy the file to the corresponding platform directories (sdk/win32, sdk/x64, or sdk/mac).

  5. Run the Electron demo.

    1. Run the .bat or .sh script in the hwmsdk-electron directory to compile the demo project. The script installs the corresponding environment, copies the SDK library and HwmUisdk.node, converts TS files to JS files, triggers compilation, and runs the demo.
    • To run the Windows 32-bit demo when the Node.js version is 32-bit, run run_demo_win32.bat.
    • To run the Windows 64-bit demo when the node version is 64-bit, run run_demo_x64.bat.
    • To run the macOS demo, run run_demo_mac.sh.

      The .bat or .sh script can perform the following operations:

      • Compile TS APIs and generate JS and types files.
      • Copy the SDK files of the corresponding platform to the corresponding directory (sdk/win32, sdk/x64, or sdk/mac).
      • Run the demo.
      Figure 3 Electron demo main screen

  6. Use the Electron demo.

    • Click Init to initialize the SDK. (If you use the 32-bit, leave ExePath blank.)
      Figure 4 SDK initialization

    ExePath is the absolute path of HwmSdk of the Windows SDK, for example, D:\path\to\hwmsdk-electron-70.16.5-src\hwmsdk-electron\sdk\x64\HwmSdk\HwmSdk.exe.

    Figure 5 Login
    Figure 6 Creating a meeting