Video Conferencing Open Source Web Application Sample - Video Conferencing Open Source Web Application Sample Kode Sumber Download

Video Conferencing Open Source Web Application Sample

Data situs web

1.0.0

Unduh

Aplikasi panggilan video 1-ke-1 dengan wajah AI: Membangun dengan JavaScript dan Enablex Toolkit untuk Web

Ini adalah sampel satu ke satu aplikasi klien panggilan video yang ditulis dalam JavaScript yang memungkinkan pengembang untuk mengimplementasikan kemampuan panggilan video yang diberdayakan dengan wajah AI di situs web mereka. Aplikasi ini berjalan di browser web (disebut titik akhir klien) dan menggunakan Enablex Web SDK untuk melakukan sesi RTC dengan rekan -rekannya melalui Layanan Video Enablex. Aplikasi klien melakukan tugas -tugas berikut untuk memfasilitasi sesi RTC:

Dapatkan token dari server aplikasi terhubung ke ruangan menggunakan stream audio/video Token Publish di kamar berlangganan stream audio/video jarak jauh di ruangan mendengarkan acara terkait sesi apa pun, aplikasi klien ini juga menunjukkan fitur -fitur berikut:

Mute/Unmute Video Mute/Unmute Audio Sesi Rekaman Obrolan Obrolan Wajah AI Share Disconnect

1. Penting!

Saat mengembangkan aplikasi klien dengan enxrtc.js (hadir dalam klien/js), pastikan untuk mengganti enxrtc.js lama dengan enxrtc.js Polyfill yang diperbarui dari https://developer.enablex.io/docs/references/sdks/video-sdk/wer-wb. Kalau tidak, aplikasi Anda tidak akan berfungsi di browser web.

2. Percobaan

Daftar untuk uji coba gratis https://www.enablex.io/free-trial/ atau coba obrolan video multiparty kami https://try.enablex.io/

3. Instalasi

3.1 Prasyarat

3.1.1 ID Aplikasi dan Kunci Aplikasi

Buat akun gratis di enablex [https://www.enablex.io/free-trial/]
Buat proyek Anda
Dapatkan ID Aplikasi dan Kunci Aplikasi yang dihasilkan terhadap proyek
Klone Repositori ini git clone https://github.com/EnableX/Video-Conferencing-Open-Source-Web-Application-Sample.git --recursive & ikuti langkah-langkah lebih lanjut

3.1.2 Sertifikat SSL

Aplikasi perlu dijalankan di HTTPS. Jadi, Anda perlu menggunakan sertifikat SSL yang valid untuk domain Anda dan arahkan aplikasi Anda untuk menggunakannya.

Namun Anda dapat menggunakan sertifikat yang ditandatangani sendiri untuk menjalankan aplikasi ini secara lokal. Ada banyak situs Web untuk mendapatkan sertifikat yang ditandatangani sendiri yang dihasilkan untuk Anda, Google It. Sedikit di antara mereka adalah:

https://letsencrypt.org/
https://www.sslchecker.com/csr/self_signed
https://www.akadia.com/services/ssh_test_certificate.html

Berikut ini di bawah ini juga dapat digunakan untuk membuat sertifikat yang ditandatangani sendiri.

Linux/Mac

  cd Video - Conferencing - Open - Source - Web - Application - Sample
  cd server
  mkdir certs
  sudo openssl req - x509 - newkey rsa: 4096 - keyout . / certs / example . key - out . / certs / example . crt - days 10000 - nodes
  sudo chmod 755 . / certs / example . *
  cd . .

Windows (Gunakan Git Bash)

  cd Video - Conferencing - Open - Source - Web - Application - Sample
  cd server
  mkdir certs
  openssl req - x509 - newkey rsa: 4096 - keyout . / certs / example . key - out . / certs / example . crt - days 10000 - nodes
  chmod 755 . / certs / example . *
  cd . .

3.1.3 Mengkonfigurasi

Sebelum Anda dapat menjalankan aplikasi ini, konfigurasikan layanan. Salin server/example.env sebagai server/.env dan perbarui nilainya. Atau Anda dapat mengatur variabel lingkungan sistem berikut sebagai gantinya:

  SERVICE_PORT - Node port on which your application will run . Default port set is 3000
  ENABLEX_APP_ID - Your EnableX `App ID` - It 's your username for EnableX API and can be found at Dashboard > Projects https://portal.enablex.io/dashboard/
  ENABLEX_APP_KEY - Your EnableX `App Key` - - It 's your password for EnableX API and can be found at Dashboard > Projects https://portal.enablex.io/dashboard/

Untuk Mac dan Linux, buka jendela terminal dan ketik perintah berikut. Catatan - Ganti semua karakter setelah nilai = dengan Nilai dari Akun Enablex Anda:

  export SERVICE_PORT = XXXX
  export ENABLEX_APP_ID = XXXXXXXXXX
  export ENABLEX_APP_KEY = XXXXXXXXX

Di Windows, buka jendela PowerShell / Command dan ketik perintah berikut. Perhatikan bahwa tidak ada = , hanya kunci dan nilai yang dipisahkan oleh ruang:

  setx SERVICE_PORT 'XXXX'
  setx ENABLEX_APP_ID 'XXXXXXXXX'
  setx ENABLEX_APP_KEY 'XXXXXXXXX'

3.2 Build

Jalankan npm install --save untuk membangun proyek dan artefak build akan disimpan di direktori ./node_modules .

3.2.1 Jalankan server

Jalankan node server.js di dalam folder server untuk memulai server Anda.

  cd server
  node server . js

3.2.2 Tes

Buka browser dan buka https: // localhost: 3000/. Browser harus memuat aplikasi.
Izinkan akses ke kamera dan mic AS dan ketika diminta untuk memulai panggilan RTC pertama Anda melalui Enablex
Anda perlu ID kamar untuk bergabung. Kami telah menambahkan tautan "Buat Ruang" di bawah formulir login. Klik untuk mendapatkan kamar-id yang diawali dalam formulir.
Anda dapat berbagi kamar-id dengan siapa saja untuk bergabung dengan konferensi Anda.

4. Server API

Enablex Server API adalah layanan API REST yang dimaksudkan untuk dipanggil dari server aplikasi mitra ke ruang pertemuan yang diaktifkan video. Akses API diberikan kepada setiap aplikasi melalui ID aplikasi dan kunci aplikasi yang ditetapkan. Jadi, ID aplikasi dan kunci aplikasi akan digunakan sebagai nama pengguna dan kata sandi masing -masing untuk dilewati sebagai header otentikasi dasar HTTP untuk mengakses API server.

Untuk aplikasi ini, panggilan API server berikut digunakan:

https://developer.enablex.io/docs/references/apis/video-api/content/api-routes/#create-a-room-untuk membuat kamar
https://developer.enablex.io/docs/references/apis/video-api/content/api-routes/#get-a-list-of-rooms-untuk mendapatkan daftar kamar
https://developer.enablex.io/docs/references/apis/video-api/content/api-routes/#get-room-information-Untuk mendapatkan informasi dari kamar yang diberikan
https://developer.enablex.io/docs/references/apis/video-api/content/api-routes/#create-a-token-untuk membuat token untuk kamar tertentu yang diberikan

Untuk mengetahui lebih banyak tentang API server, kunjungi: https://developer.enablex.io/docs/references/apis/video-api/index/