Web integration

Updated at:

This topic describes how to integrate audio and video calls into a web client.

Prerequisites

The development environment must meet the following requirements:

Supported platforms

Browser

Browser version

Mac

Chrome

At least 67

Windows

Chrome

At least 67

Note
  • You must use the HTTPS protocol to integrate the web software development kit (SDK).

  • Upgrade to the latest SDK version, 1.5.4. Click here to download the package.

Procedure

  1. Download artvc-web-sdk.

  2. Save the artvc-web-sdk package to your local project.

  3. Import the required dependency files for your project based on the following table.

    Dependency type

    Dependency file

    Description

    Required dependency

    • meeting_api.js

    • adapter.js

    -

    Optional dependency

    remote_record.js

    For server-side recording.

    • client_record.js

    • RecordRTC.min.js (https://gw.alipayobjects.com/os/lib/recordrtc/5.5.9/RecordRTC.min.js)

    • EBML.js

    For browser-based recording.

    meeting_camera_stream.js

    To use the camera or microphone.

    meeting_desk_stream.js

    For the desktop screen sharing feature.

    Important

    If you want to use the desktop screen sharing feature, upgrade Chrome to version 72 or later.

    • meeting_file_stream.js

    • pdf.js

    • pdf.worker.js (must be in the ./lib/pdf.worker.js path relative to meeting_api.js)

    For file screen sharing. If the file is in PDF format, you must also import the pdf.js and pdf.worker.js files.

    meeting_html_stream.js

    For custom area screen sharing.

    meeting_im.js

    To use the instant messaging (IM) feature.

    meeting_invite.js

    To use the invitation feature. Only online agents can be invited.

    • dialogue.css

    • getMediaInfo.js

    • jquery.min.js (https://gw.alipayobjects.com/os/lib/jquery/3.5.1/dist/jquery.min.js)

    • iconfont.js

    • eruda.js

    Do not import the dependencies for the demo into your application.

  4. Add the following code to instantiate the SDK.

    let test_controller = new MeetingController();  // Instantiate the SDK

API reference

The entire API is encapsulated in the MeetingController class. The APIs are divided into the following two types:

  • Calling APIs: APIs that are actively called by your service.

  • Callback APIs: Callbacks that are triggered by API calls and provide service notifications.

Workflow

flowchart