tencent cloud

Feedback

RoomKit API

Last updated: 2024-10-15 17:23:26

    API Introduction

    The TUIRoomKit API is a multi-person meeting component with an Including UI Interface. By using the TUIRoomKit API, you can quickly implement a meeting-like scenario through a simple interface. For more detailed integration steps, see: Rapid Integration with TUIRoomKit.

    API Overview

    <ConferenceMainView />: The component body of TUIRoomkit UI.
    Conference: dependencies ConferenceMainView provided API.
    API
    Description
    Access the roomEngine instance. If roomEngine does not exist, it will return null.
    on
    Listen to specified types of apid Integration with TUIRoomKit .Event. When the event occurs, the callback function will be called.
    off
    Cancel listening for events of a specified type.
    login
    Log in to the conference system.
    logout
    Log out of the meeting system.
    start
    Start a new meeting.
    join
    Join an existing meeting.
    leave
    Leave the current meeting.
    dismiss
    Dismiss the current meeting.
    Set your user information.
    Set the interface language.
    setTheme
    Set the interface topic.
    Enable the text watermark feature in the application. For details, see: Text Watermark.
    Disable the screen sharing feature in the application. After invoking this function, users will not be able to share their screen with others.
    Disable the text messaging feature in the application. After invoking this function, users will not be able to send or receive text messages.
    Hide specific feature buttons in the application. By invoking this function and passing in the appropriate FeatureButton enumerated values, the corresponding buttons will be hidden from the user interface.

    Introduction to ConferenceMainView attributes

    Attribute Overview

    Attribute
    Description
    Type
    Required
    Default Value
    displayMode
    Control of component display pattern:
    permanent: Permanent mode. The component is always displayed; internal control of the component's visibility is not exerted. If not controlled by the business end, the component will always remain visible.
    wake-up: Wake-up mode. The component is activated only after calling the conference start/join interface and officially joining the conference; it will not be displayed beforehand.
    'permanent' | 'wake-up'
    No
    permanent

    Sample code

    Vue3
    Vue2
    <template>
    <ConferenceMainView display-mode="permanent"></ConferenceMainView>
    </template>
    <script setup>
    import { ConferenceMainView, conference } from '@tencentcloud/roomkit-electron-vue3';
    const init = async () => {
    await conference.login({
    sdkAppId: 0,
    userId: '',
    userSig: '',
    });
    await conference.start('123456', {
    isSeatEnable: false,
    isOpenCamera: true,
    isOpenMicrophone: true,
    });
    }
    init();
    </script>
    <template>
    <ConferenceMainView display-mode="permanent"></ConferenceMainView>
    </template>
    <script>
    import { ConferenceMainView, conference } from '@tencentcloud/roomkit-electron-vue2.7';
    export default {
    components: {
    ConferenceMainView,
    },
    async created() {
    await conference.login({
    sdkAppId: 0,
    userId: '',
    userSig: '',
    });
    await conference.start('123456', {
    isSeatEnable: false,
    isOpenCamera: true,
    isOpenMicrophone: true,
    });
    },
    };
    </script>

    Conference API Details

    Conference provides a series of methods for managing and controlling online meeting features. By implementing this interface, developers can easily integrate online meeting features into their applications.

    getRoomEngine

    Access the roomEngine instance. If roomEngine does not exist, it will return null.
    // Note the package name. If you are using the vue2 version, please change the package name to @tencentcloud/roomkit-electron-vue2.7
    import { conference, TUIRoomEngine } from '@tencentcloud/roomkit-electron-vue3';
    TUIRoomEngine.once('ready', () => {
    const roomEngine = conference.getRoomEngine();
    });
    Returns:TUIRoomEngine | null

    on

    Listen for a specified type of event. When the event occurs, the callback function will be called.
    The parameters are described as follows:
    Parameter
    Type
    Default Value
    Meaning
    eventType
    RoomEvent
    -
    Event Type to Listen For
    callback
    () => void
    -
    Callback Function Called When the Event Occurs
    // Note the package name. If you are using the vue2 version, please change the package name to @tencentcloud/roomkit-electron-vue2.7
    import { conference, RoomEvent } from '@tencentcloud/roomkit-electron-vue3';
    conference.on(RoomEvent.RoomStart, () => {
    console.log('[conference] The meeting has already started.')
    });
    conference.on(RoomEvent.ROOM_DISMISS, () => {
    console.log('[conference] The meeting has been dismissed')
    });
    Returns:void

    off

    Cancel listening for events of a specified type.
    The parameters are described as follows:
    Parameter
    Type
    Default Value
    Meaning
    eventType
    RoomEvent
    -
    The type of event to cancel listening for
    callback
    () => void
    -
    The callback function added previously
    // Note the package name. If you are using the vue2 version, please change the package name to @tencentcloud/roomkit-electron-vue2.7
    import { conference } from '@tencentcloud/roomkit-electron-vue3';
    conference.off('event', callback);
    Returns:void

    login

    Log in to the conference system.
    The parameters are described as follows:
    Parameter
    Type
    Default Value
    Meaning
    params
    {sdkAppId: number; userId: string; userSig: string; tim?: ChatSDK}
    -
    Log in to the parameter object
    sdkAppId
    number
    -
    In the Real-time Audio and Video Console click Application Management > create an application. After creating a new application, you can access the sdkAppId information in Application Information.
    userId
    string
    -
    It's advised to limit the User ID length to 32 bytes, allowing only uppercase and lowercase letters (a-zA-Z), digits (0-9), underscores, and hyphens.
    userSig
    string
    -
    userSig Signature For the method of calculating userSig, please refer to UserSig Related.
    tim
    ChatSDK (optional)
    -
    If you want to leverage more capabilities of the Instant Messaging SDK while integrating roomEngine, you can pass the created tim instance into TUIRoomEngine. For how to create a tim instance, please refer to TIM.create.
    // Note the package name. If you are using the vue2 version, please change the package name to @tencentcloud/roomkit-electron-vue2.7
    import { conference } from '@tencentcloud/roomkit-electron-vue3';
    conference.login({
    sdkAppId: 123456,
    userId: 'testUser',
    userSig: 'testSig'
    });
    Returns:Promise<void>

    logout

    Log out of the meeting system.
    // Note the package name. If you are using the vue2 version, please change the package name to @tencentcloud/roomkit-electron-vue2.7
    import { conference } from '@tencentcloud/roomkit-electron-vue3';
    conference.logout();
    Returns:Promise<void>

    start

    Start a new meeting.
    The parameters are described as follows:
    Parameter
    Type
    Default Value
    Meaning
    roomId
    string
    -
    Meeting Room ID
    params
    -
    Parameters for starting a meeting
    // Note the package name. If you are using the vue2 version, please change the package name to @tencentcloud/roomkit-electron-vue2.7
    import { conference } from '@tencentcloud/roomkit-electron-vue3';
    conference.start('123456', {
    roomName: 'TestRoom',
    isSeatEnabled: false,
    isOpenCamera: false,
    isOpenMicrophone: false,
    });
    Returns:Promise<void>

    join

    Join an existing meeting.
    The parameters are described as follows:
    Parameter
    Type
    Default Value
    Meaning
    roomId
    string
    -
    Meeting Room ID
    params
    -
    Parameters for joining the meeting
    // Note the package name. If you are using the vue2 version, please change the package name to @tencentcloud/roomkit-electron-vue2.7
    import { conference } from '@tencentcloud/roomkit-electron-vue3';
    conference.join('123456', {
    isOpenCamera: false,
    isOpenMicrophone: false,
    });
    Returns:Promise<void>

    leave

    Leave the current meeting.
    // Note the package name. If you are using the vue2 version, please change the package name to @tencentcloud/roomkit-electron-vue2.7
    import { conference } from '@tencentcloud/roomkit-electron-vue3';
    conference.leave();
    Returns:Promise<void>

    dismiss

    Dismiss the current meeting.
    // Note the package name. If you are using the vue2 version, please change the package name to @tencentcloud/roomkit-electron-vue2.7
    import { conference } from '@tencentcloud/roomkit-electron-vue3';
    conference.dismiss();
    Returns:Promise<void>

    setSelfInfo

    Set your user information.
    The parameters are described as follows:
    Parameter
    Type
    Default Value
    Meaning
    options
    {userName: string; avatarUrl: string}
    -
    User information object
    userName
    string (Optional)
    -
    User's nickname
    avatarUrl
    string (Optional)
    -
    User profile photo
    // Note the package name. If you are using the vue2 version, please change the package name to @tencentcloud/roomkit-electron-vue2.7
    import { conference } from '@tencentcloud/roomkit-electron-vue3';
    conference.setSelfInfo({
    userName: 'test-name',
    avatarUlr: 'https://avatar.png'
    });
    Returns:Promise<void>

    setLanguage

    Set the interface language.
    The parameters are described as follows:
    Parameter
    Type
    Default Value
    Meaning
    language
    'zh-CN' | 'en-US'
    -
    Language
    // Note the package name. If you are using the vue2 version, please change the package name to @tencentcloud/roomkit-electron-vue2.7
    import { conference } from '@tencentcloud/roomkit-electron-vue3';
    conference.setLanguage('en-US');
    Returns:void

    setTheme

    Set the interface topic.
    The parameters are described as follows:
    Parameter
    Type
    Default Value
    Meaning
    theme
    'LIGHT' | 'DARK'
    -
    Topic Type
    // Note the package name. If you are using the vue2 version, please change the package name to @tencentcloud/roomkit-electron-vue2.7
    import { conference } from '@tencentcloud/roomkit-electron-vue3';
    conference.setTheme('DARK');
    Returns:void

    enableWatermark

    Enable the text messaging feature in the application. For details, see: Text Watermark.
    // Note the package name. If you are using the vue2 version, please change the package name to @tencentcloud/roomkit-electron-vue2.7
    import { conference } from '@tencentcloud/roomkit-electron-vue3';
    conference.enableWatermark();
    Returns:void

    disableTextMessaging

    Disable the text messaging feature in the application. After invoking this function, users will not be able to send or receive text messages.
    // Note the package name. If you are using the vue2 version, please change the package name to @tencentcloud/roomkit-electron-vue2.7
    import { conference } from '@tencentcloud/roomkit-electron-vue3';
    conference.disableTextMessaging();
    Returns:void

    disableScreenSharing

    Disable the screen sharing feature in the application. After invoking this function, users will not be able to share their screen with others.
    // Note the package name. If you are using the vue2 version, please change the package name to @tencentcloud/roomkit-electron-vue2.7
    import { conference } from '@tencentcloud/roomkit-electron-vue3';
    conference.disableScreenSharing();
    Returns:void

    hideFeatureButton

    Hide specific feature buttons in the application. By invoking this function and passing in the appropriate FeatureButton enumerated values, the corresponding buttons will be hidden from the user interface.
    The parameters are described as follows:
    Parameter
    Type
    Default Value
    Meaning
    name
    -
    Names of Buttons to be Hidden
    // Note the package name. If you are using the vue2 version, please change the package name to @tencentcloud/roomkit-electron-vue2.7
    import { conference, FeatureButton } from '@tencentcloud/roomkit-electron-vue3';
    conference.hideFeatureButton(FeatureButton.SwitchTheme);
    Returns:void

    Type Definition

    RoomEvent (enumeration)

    Parameter
    Type
    Description
    ROOM_START
    string
    Creating a Meeting
    ROOM_JOIN
    string
    Joining a Meeting
    ROOM_LEAVE
    string
    Leave Meeting
    ROOM_DISMISS
    string
    Meeting Dismissed
    KICKED_OFFLINE
    string
    User kicked offline
    KICKED_OUT
    string
    Participant removed from meeting
    USER_LOGOUT
    string
    User logged out
    ROOM_ERROR
    string
    Meeting error
    ROOM_NEED_PASSWORD
    string
    Meeting password

    FeatureButton (enumerated values)

    Parameter
    Type
    Description
    SwitchTheme
    string
    Switch Topic Feature Button
    SwitchLayout
    string
    Switch Layout Feature Button
    SwitchLanguage
    string
    Switch Language Feature Button
    FullScreen
    string
    Fullscreen Feature Button
    Invitation
    string
    Invite Feature Button
    BasicBeauty
    string
    Basic Beauty Button

    StartParams

    Parameter
    Type
    Description
    Default Value
    roomName
    string (Optional)
    Room Name
    -
    isSeatEnabled
    boolean (optional)
    Enable Seats
    false
    isOpenCamera
    boolean (optional)
    Whether to enable the camera
    false
    isOpenMicrophone
    boolean (optional)
    Whether to enable the microphone
    false
    defaultCameraId
    string (Optional)
    Default Camera ID
    -
    defaultMicrophoneId
    string (Optional)
    Default Microphone ID
    -
    defaultSpeakerId
    string (Optional)
    Default Speaker ID
    -
    password
    string (Optional)
    Meeting password
    -

    JoinParams

    Parameter
    Type
    Description
    Default Value
    isOpenCamera
    boolean (optional)
    Whether to enable the camera
    false
    isOpenMicrophone
    boolean (optional)
    Whether to enable the microphone
    false
    defaultCameraId
    string (Optional)
    Default Camera ID
    -
    defaultMicrophoneId
    string (Optional)
    Default Microphone ID
    -
    defaultSpeakerId
    string (Optional)
    Default Speaker ID
    -
    password
    string (Optional)
    Meeting password
    -
    Contact Us

    Contact our sales team or business advisors to help your business.

    Technical Support

    Open a ticket if you're looking for further assistance. Our Ticket is 7x24 avaliable.

    7x24 Phone Support