DIBUAT UNTUK REACT

UI Kit Panggilan Video React

Tambahkan panggilan dalam aplikasi dengan React Video Calling UI Kit dari Tencent RTC. Sematkan TUICallKit, hubungkan pengguna, lalu sesuaikan layar panggilan dan jendela mengambang dengan aplikasi React Anda.

SUMBER DAYA DEVELOPER

Dokumentasi & Contoh UI Kit Panggilan Video React

Panggilan Video Satu Lawan Satu di React

Hadirkan percakapan tatap muka di aplikasi React Anda untuk membangun hubungan pribadi atau melakukan konsultasi, lengkap dengan video dan kontrol panggilan dalam satu pengalaman.

Panggilan video grup di React

Hubungkan beberapa peserta dalam komponen panggilan React Anda. Gunakan panduan platform untuk mengonfigurasi alur panggilan dan tata letak grup yang didukung.

KEMAMPUAN REACT CALL

Fitur Panggilan Video React

Hubungkan orang-orang

  • Panggilan suara dan video
  • Penanganan panggilan masuk

Tetap pegang kendali

  • Kontrol kamera dan mikrofon
  • Peristiwa siklus hidup panggilan

Jadikan milik Anda

  • Alur aplikasi Anda
  • Integrasi khusus platform

Jelajahi komponen panggilan video React

Hubungkan TUICallKit ke tata letak komponen Anda, lalu mulai panggilan melalui tindakan dalam aplikasi.

Antarmuka panggilan

Sematkan antarmuka panggilan React Anda

Pasang TUICallKit dalam tata letak komponen Anda dan inisialisasikan dengan pengguna yang telah diautentikasi. Komponen ini menyediakan antarmuka dan kontrol panggilan.

Baca dokumentasi
App.tsx
import { TUICallKit } from '@trtc/calls-uikit-react';

export function CallView() {
  return <TUICallKit />;
}

PENYESUAIAN

Sesuaikan React Call UI Kit Anda

Sesuaikan komponen panggilan React, kontrol, dan alur panggilan masuk dengan produk Anda.

Tata letak & kontrol

Sesuaikan pengalaman panggilan menggunakan opsi penyesuaian dalam panduan platform Anda.

Baca dokumentasi

MULAI

Tambahkan panggilan video ke aplikasi React Anda

  1. 01

    Buat aplikasi Anda

    Aktifkan Call untuk aplikasi dan pengguna uji Anda.

    Buka Konsol Call
  2. 02

    Tambahkan UI Kit Panggilan Video React

    Ikuti panduan platform untuk menghubungkan proyek Anda.

    Ikuti Panduan Integrasi
  3. 03

    Mulai panggilan pertama Anda

    Masuk sebagai dua pengguna uji, lalu lakukan dan jawab panggilan.

    Konfigurasikan autentikasi
React Call UI Kit
Terminal
npm install @trtc/calls-uikit-react
App.tsx
import { TUICallKitAPI } from '@trtc/calls-uikit-react';

await TUICallKitAPI.init({ SDKAppID, userID, userSig });

FAQ UI Kit Panggilan Video React

Apa saja yang disertakan dalam React Video Calling UI Kit?

React Video Calling UI Kit menyediakan layar TUICallKit dan kontrol panggilan. Hubungkan dengan identitas pengguna dan tata letak komponen Anda; layanan Call menghubungkan para peserta.

Haruskah saya menggunakan SDK panggilan React atau UI Kit?

UI Kit menyediakan komponen antarmuka di atas layanan yang mendasarinya. Pilih SDK jika Anda memerlukan kontrol lebih besar atas UI aplikasi Anda sendiri.

Apa yang diperlukan untuk panggilan video React di browser?

Inisialisasi TUICallKit untuk pengguna terautentikasi dengan layanan Call yang telah diaktifkan. Gunakan HTTPS atau localhost dan tangani izin kamera, mikrofon, serta pemutaran browser.

Bagaimana cara mengautentikasi pengguna UI Kit panggilan video React?

Buat UserSig di server Anda dan teruskan ke klien setelah alur login Anda sendiri selesai. Selalu simpan rahasia aplikasi di server Anda.

Apakah UI Kit Panggilan Video React dapat digunakan secara gratis?

Antarmuka dan layanan Call yang di-host memiliki peran berbeda. Aktifkan layanan untuk aplikasi Anda, lalu tinjau paket saat ini, ketersediaan fitur, dan biaya penggunaan.

Bagaimana cara mengintegrasikan UI Kit Panggilan Video React dengan React?

Inisialisasi provider sesuai dokumentasi dan susun komponen yang terhubung. Sesuaikan subscription dan cleanup dengan siklus hidup React, lalu uji navigasi serta mounting berulang pada aplikasi nyata.

Bagaimana cara menguji UI Kit Panggilan Video React sebelum merilis aplikasi?

Uji status undangan, menerima, menolak, dan mengakhiri panggilan antara pengguna terpisah, termasuk penolakan izin.

Bagaimana cara menyesuaikan antarmuka UI Kit Panggilan Video React?

Gunakan TUICallKitAPI dari @trtc/calls-uikit-react untuk perubahan kontrol yang didukung. Misalnya, hideFeatureButton(FeatureButton.Camera) menyembunyikan tombol kamera, sedangkan setLayoutMode(LayoutMode.LocalInLargeView) menempatkan video lokal di tampilan besar. Pengaturan tata letak ini hanya berlaku untuk panggilan video satu lawan satu. Untuk antarmuka yang sepenuhnya berbeda, bangun dengan TUICallEngine tanpa berasumsi bahwa setiap tampilan internal memiliki prop pengganti React.

Dukungan integrasi untuk React Call

Diskusikan aplikasi Anda

Diskusikan produk, perkiraan penggunaan, dan kebutuhan integrasi Anda.

Hubungi Tim Penjualan

Hadirkan Panggilan Video di Aplikasi React Anda

Mulai dengan React Video Calling UI Kit, hubungkan dua pengguna uji, lalu buat panggilan pertama Anda.