ความสามารถของ REACT ROOM
ห้องที่สร้างเพื่อแอปของคุณ
วงจรชีวิตห้อง
- สร้างและเข้าร่วมห้อง
- จัดการการออกและสิ้นสุด
สนทนาสด
- เชื่อมวิดีโอผู้เข้าร่วม
- ควบคุมกล้องและไมโครโฟน
ประสบการณ์ผู้เข้าร่วม
- แสดงสมาชิกห้อง
- สะท้อนการเปลี่ยนสถานะห้อง
ตัวตนแอป
- เชื่อม ID ผู้ใช้ของคุณ
- ยืนยันตัวตนด้วย UserSig ที่ออกโดยเซิร์ฟเวอร์
การผสานรวมแพลตฟอร์ม
- พื้นที่ทำงานเบราว์เซอร์
- ปฏิบัติตามสิทธิ์เนทีฟหรือเบราว์เซอร์
ขั้นตอนผลิตภัณฑ์ของคุณ
- เชื่อมห้องกับการนำทาง
- เก็บข้อมูลธุรกิจในแอป
สำรวจคอมโพเนนต์ประชุม React
ดูประสบการณ์ห้องและโค้ดเบื้องหลัง
พื้นที่สำหรับทุกคน
ติดตั้งหน้าประชุมด้วย UI Kit การประชุมผ่านวิดีโอ React แอปจัดเตรียมผู้ใช้ที่ยืนยันตัวตนและ ID ห้อง
import { UIKitProvider } from '@tencentcloud/uikit-base-component-react';
import { ConferenceMainView } from '@tencentcloud/roomkit-web-react';
export default function App() {
return (
<UIKitProvider theme="light" language="en-US">
<ConferenceMainView />
</UIKitProvider>
);
}เชื่อมตัวตนของแอป
เข้าสู่ระบบด้วย ID แอป ID ผู้ใช้ และ UserSig ที่ออกโดยเซิร์ฟเวอร์ เข้าห้องหลังเข้าสู่ระบบสำเร็จ
import { conference } from '@tencentcloud/roomkit-web-react';
await conference.login({ sdkAppId: SDKAppID, userId, userSig });
await conference.createAndJoinRoom({
roomId, options: { roomName: 'Design review' },
});เชื่อมผู้เข้าร่วม
ใช้ ID ห้องที่มีอยู่เพื่อให้ผู้ใช้เข้าร่วมเซสชันเดียวกัน
import { conference } from '@tencentcloud/roomkit-web-react';
// After login, join an existing room.
await conference.joinRoom({ roomId });
// Leave without ending the room for everyone.
await conference.leaveRoom();เริ่มต้นใช้งาน
เริ่มใช้งานห้องแรกของคุณ
- 01
- 02
- 03
npm install @tencentcloud/roomkit-web-react tuikit-atomicx-react @tencentcloud/uikit-base-component-react @tencentcloud/universal-apiimport { UIKitProvider } from '@tencentcloud/uikit-base-component-react';
import { ConferenceMainView } from '@tencentcloud/roomkit-web-react';
export default function App() {
return (
<UIKitProvider theme="light" language="en-US">
<ConferenceMainView />
</UIKitProvider>
);
}คำถามที่พบบ่อยเกี่ยวกับ UI Kit การประชุมผ่านวิดีโอ React
UI Kit การประชุมผ่านวิดีโอ React มีอะไรบ้าง
UI Kit การประชุมผ่านวิดีโอ React มีหน้าประชุมสำเร็จรูปพร้อมทางเข้าห้อง หน้าวิดีโอ และการควบคุมผู้เข้าร่วม แอปจัดการตัวตนและขั้นตอนธุรกิจ
ผสานรวม UI Kit การประชุมผ่านวิดีโอ React อย่างไร
ผู้ใช้เข้าสู่ระบบ UI Kit การประชุมผ่านวิดีโอ React อย่างไร
ใช้ SDKAppID ID ผู้ใช้ และ UserSig ที่สร้างบนเซิร์ฟเวอร์ อย่าใส่ข้อมูลลับของแอปในโค้ดเบราว์เซอร์หรือมือถือ จัดการการยืนยันตัวตนที่ล้มเหลวก่อนเข้าห้อง
ปรับแต่งประสบการณ์ประชุมได้ไหม
ปรับคอมโพเนนต์และการตั้งค่าตามเอกสาร ซอร์ส UI Kit เนทีฟมีหน้าห้องและแถบเครื่องมือ ตรวจตัวเลือกที่รองรับในคู่มือแพลตฟอร์ม
Room คิดราคาอย่างไร
แทนระบบหลักสูตรหรือพื้นที่ทำงานของฉันไหม
แอปยังจัดการเนื้อหาหลักสูตร สิทธิ์พื้นที่ทำงาน การชำระเงิน และบันทึกธุรกิจ คอมโพเนนต์ประชุมเพิ่มการสื่อสารแบบเรียลไทม์
ผสาน UI Kit การประชุมผ่านวิดีโอ React ด้วย React อย่างไร
ทดสอบ UI Kit การประชุมผ่านวิดีโอ React ก่อนเผยแพร่แอปอย่างไร
ปรับแต่งอินเทอร์เฟซ UI Kit การประชุมผ่านวิดีโอ React อย่างไร
ตั้งค่า theme และ language บน UIKitProvider จาก @tencentcloud/uikit-base-component-react หากต้องการเปลี่ยนการจัดวางวิดีโอ ให้เรียก conference.setFeatureConfig({ layoutTemplate: RoomLayoutTemplate.SidebarLayout }) โดยใช้ RoomLayoutTemplate จาก tuikit-atomicx-react/room วิธีนี้เป็นการเลือกเลย์เอาต์ที่รองรับ ไม่ได้เปิดให้แทนที่ทุกคอมโพเนนต์ของห้องได้อย่างอิสระ ตัวเลือกผู้รับคำเชิญที่มีมาให้ใช้ความสัมพันธ์เพื่อนใน IM หากจำเป็น ให้ซิงก์รายชื่อติดต่อทางธุรกิจผ่าน API ฝั่งเซิร์ฟเวอร์ตามเอกสาร