สร้างขึ้นเพื่อ VUE

UI Kit การโทรวิดีโอสำหรับ Vue

เพิ่มการโทรด้วยเสียงและวิดีโอด้วย Vue Video Calling UI Kit ของ Tencent RTC เมานต์ TUICallKit ในแอป Vue และเชื่อมส่วนควบคุมการโทรเข้ากับขั้นตอนการใช้งานเดิม

เริ่มสร้าง ทดลองใช้เดโม Call

แหล่งข้อมูลสำหรับนักพัฒนา

เอกสารและตัวอย่าง UI Kit การโทรวิดีโอสำหรับ Vue

ข้อมูลอ้างอิงคอมโพเนนต์

สำรวจคอมโพเนนต์ UI Kit การโทรวิดีโอสำหรับ Vue

สำรวจคอมโพเนนต์การยืนยันตัวตนผู้ใช้

คู่มือการผสานรวม

ติดตั้ง UI Kit การโทรวิดีโอสำหรับ Vue และเชื่อมต่อผู้ใช้ของคุณ

การผสานรวม Vue เริ่มต้นอย่างรวดเร็ว

ตัวอย่างและซอร์สโค้ด

ดูการทำงานจริงของผลิตภัณฑ์และสำรวจวิธีการนำไปใช้

ทดลองใช้เดโม Call ดู ซอร์สโค้ด ของ Vue

วิดีโอคอลแบบตัวต่อตัวบน Vue

นำการสนทนาแบบเห็นหน้ามาสู่แอป Vue ของคุณสำหรับการเชื่อมต่อส่วนบุคคลหรือการให้คำปรึกษา พร้อมส่วนควบคุมวิดีโอและการโทรในประสบการณ์เดียวกัน

สำรวจการให้คำปรึกษาผ่านวิดีโอ

การโทรวิดีโอแบบกลุ่มใน Vue

เชื่อมต่อผู้เข้าร่วมหลายคนในคอมโพเนนต์การโทร Vue ของคุณ ใช้คู่มือแพลตฟอร์มเพื่อกำหนดค่าขั้นตอนการโทรและเลย์เอาต์กลุ่มที่รองรับ

สำรวจการโทรแบบกลุ่ม

ความสามารถของ VUE CALL

ฟีเจอร์การโทรผ่านวิดีโอสำหรับ Vue

เชื่อมโยงผู้คน

การโทรด้วยเสียงและวิดีโอ
การจัดการสายเรียกเข้า

ควบคุมประสบการณ์การโทรได้อย่างมั่นใจ

ส่วนควบคุมกล้องและไมโครโฟน
เหตุการณ์ในวงจรชีวิตของการโทร

ทำให้เป็นของคุณเอง

ขั้นตอนการทำงานของแอปพลิเคชัน
การผสานรวมเฉพาะแพลตฟอร์ม

สำรวจคอมโพเนนต์การโทรวิดีโอ Vue

เชื่อมต่อ TUICallKit กับเค้าโครงคอมโพเนนต์ แล้วเริ่มการโทรผ่านการดำเนินการภายในแอปของคุณ

อินเทอร์เฟซการโทร

ฝังอินเทอร์เฟซการโทร Vue ของคุณ

เมานต์ TUICallKit ในเลย์เอาต์คอมโพเนนต์และเริ่มต้นด้วยผู้ใช้ที่ผ่านการยืนยันตัวตน คอมโพเนนต์นี้มีอินเทอร์เฟซและส่วนควบคุมการโทรให้

อ่านเอกสาร

<script setup>
import { TUICallKit } from "@trtc/calls-uikit-vue";
</script>

<template>
  <TUICallKit />
</template>

เริ่มการโทร

เริ่มวิดีโอคอลใน Vue

ส่ง ID ผู้รับจากแอปพลิเคชันของคุณไปยัง API การโทร เชื่อมโยงการดำเนินการนี้กับรายชื่อติดต่อ การสนทนา หรือปุ่มโทรในอินเทอร์เฟซ Vue

อ่านเอกสาร

import { TUICallKitAPI, CallMediaType } from
  '@trtc/calls-uikit-vue';

await TUICallKitAPI.calls({
  userIDList: [recipientID],
  type: CallMediaType.VIDEO,
});

หน้าต่างลอย

แสดงการสนทนาไว้อย่างต่อเนื่องขณะที่ผู้ใช้ไปยังส่วนต่าง ๆ ในแอปของคุณ

อ่านเอกสาร

TUICallKitAPI.enableFloatWindow(true);

การปรับแต่ง

ปรับแต่ง UI Kit การโทร Vue

ปรับคอมโพเนนต์การโทร Vue ส่วนควบคุม และขั้นตอนสายเรียกเข้าให้เหมาะกับผลิตภัณฑ์ของคุณ

เลย์เอาต์และการควบคุม

ปรับประสบการณ์การโทรด้วยตัวเลือกการปรับแต่งในคู่มือแพลตฟอร์ม

อ่านเอกสาร

เริ่มต้นใช้งาน

เพิ่มวิดีโอคอลในแอป Vue ของคุณ

01
สร้างแอปของคุณ
เปิดใช้งาน Call สำหรับแอปพลิเคชันและผู้ใช้ทดสอบ
เปิดคอนโซล Call
02
เพิ่ม UI Kit การโทรวิดีโอสำหรับ Vue
ทำตามคู่มือแพลตฟอร์มเพื่อเชื่อมต่อโปรเจกต์ของคุณ
ทำตามคู่มือการผสานรวม
03
เริ่มการโทรครั้งแรกของคุณ
ลงชื่อเข้าใช้ด้วยผู้ใช้ทดสอบสองคน จากนั้นโทรออกและรับสาย
ตั้งค่าการยืนยันตัวตน

Vue Call UI Kit

npm install @trtc/calls-uikit-vue

import { TUICallKitAPI } from '@trtc/calls-uikit-vue';

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

คำถามที่พบบ่อยเกี่ยวกับ UI Kit การโทรวิดีโอสำหรับ Vue

Vue Video Calling UI Kit มีอะไรบ้าง

UI Kit การโทรผ่านวิดีโอสำหรับ Vue มีหน้าจอ TUICallKit และส่วนควบคุมการโทร เชื่อมต่อเข้ากับข้อมูลประจำตัวผู้ใช้และเลย์เอาต์คอมโพเนนต์ของคุณ แล้วบริการ Call จะเชื่อมต่อผู้เข้าร่วมเข้าด้วยกัน

ฉันควรใช้ SDK การโทรสำหรับ Vue หรือ UI Kit

UI Kit มีคอมโพเนนต์อินเทอร์เฟซอยู่บนบริการพื้นฐาน เลือก SDK เมื่อต้องการควบคุม UI ของแอปพลิเคชันคุณเองได้มากขึ้น

SDK การโทรวิดีโอบน Web

วิดีโอคอลด้วย Vue ต้องใช้อะไรบ้างในเบราว์เซอร์

เริ่มต้น TUICallKit สำหรับผู้ใช้ที่ผ่านการยืนยันตัวตนและเปิดใช้บริการ Call ใช้ HTTPS หรือ localhost และจัดการสิทธิ์ของกล้อง ไมโครโฟน และการเล่นสื่อบนเบราว์เซอร์

คู่มือการผสานรวม Vue Call

ฉันจะยืนยันตัวตนผู้ใช้ Vue Video Calling UI Kit ได้อย่างไร

สร้าง UserSig บนเซิร์ฟเวอร์ของคุณและส่งให้ไคลเอนต์หลังจากขั้นตอนการลงชื่อเข้าใช้ของคุณเองเสร็จสมบูรณ์ เก็บข้อมูลลับของแอปพลิเคชันไว้บนเซิร์ฟเวอร์เสมอ

อ่านคู่มือการยืนยันตัวตน

UI Kit การโทรผ่านวิดีโอสำหรับ Vue ใช้งานได้ฟรีหรือไม่

อินเทอร์เฟซและบริการ Call แบบโฮสต์มีบทบาทต่างกัน เปิดใช้บริการสำหรับแอปพลิเคชันของคุณ แล้วตรวจสอบแพ็กเกจปัจจุบัน ความพร้อมใช้งานของฟีเจอร์ และค่าบริการตามการใช้งาน

ดูราคาของ Call

จะผสานรวม UI Kit การโทรวิดีโอ Vue กับ Vue ได้อย่างไร?

ใช้การผสานรวม Vue และ API คอมโพเนนต์ตามเอกสาร เริ่มต้นบริการก่อนมุมมองที่เชื่อมต่อ และนำ listener ออกหรือปล่อยทรัพยากรเมื่อมุมมอง unmount

อ่านคู่มือแพลตฟอร์ม

จะทดสอบ UI Kit การโทรวิดีโอ Vue ก่อนเผยแพร่แอปได้อย่างไร?

ทดสอบสถานะเชิญ รับสาย ปฏิเสธ และวางสายระหว่างผู้ใช้แยกกัน รวมถึงกรณีปฏิเสธสิทธิ์

อ่านคู่มือแพลตฟอร์ม

จะปรับแต่งอินเทอร์เฟซของ UI Kit การโทรวิดีโอ Vue ได้อย่างไร?

ใช้ TUICallKitAPI จาก @trtc/calls-uikit-vue เพื่อตั้งค่าพื้นหลังเมื่อปิดกล้องด้วย setLocalViewBackgroundImage และ setRemoteViewBackgroundImage พื้นหลังเหล่านี้จะแสดงในการโทรด้วยเสียงหรือเมื่อปิดวิดีโอ หากต้องการใช้ SVG ของปุ่มที่ปรับแต่งเอง ขั้นตอนการคัดลอกซอร์สโค้ดตามเอกสารกำหนดให้ใช้ Vue 3 ร่วมกับ TypeScript และเวอร์ชัน 3.2.2 ขึ้นไป อัปเดตคำสั่ง import ให้ชี้ไปยังสำเนาคอมโพเนนต์ภายในโปรเจกต์ และดูแลการแก้ไขเหล่านั้นเมื่ออัปเกรด

อ่านคู่มือการปรับแต่ง

การสนับสนุนด้านการผสานรวมสำหรับ Vue Call

คำถามเกี่ยวกับการผสานรวม

รับความช่วยเหลือในการตั้งค่า UI Kit การโทรวิดีโอสำหรับ Vue

ดูเอกสารสำหรับนักพัฒนา

พูดคุยเกี่ยวกับแอปพลิเคชันของคุณ

พูดคุยเกี่ยวกับผลิตภัณฑ์ ปริมาณการใช้งานที่คาดการณ์ และความต้องการด้านการผสานรวมของคุณ

ติดต่อฝ่ายขาย

เพิ่มวิดีโอคอลลงในแอป Vue ของคุณ

เริ่มต้นด้วย Vue Video Calling UI Kit เชื่อมต่อผู้ใช้ทดสอบสองคน แล้วสร้างการโทรครั้งแรกของคุณ

เริ่มต้นใช้งานฟรี ดูคู่มือ UI Kit

UI Kit การโทรวิดีโอสำหรับ Vue

เอกสารและตัวอย่าง UI Kit การโทรวิดีโอสำหรับ Vue

ข้อมูลอ้างอิงคอมโพเนนต์

คู่มือการผสานรวม

ตัวอย่างและซอร์สโค้ด

วิดีโอคอลแบบตัวต่อตัวบน Vue

การโทรวิดีโอแบบกลุ่มใน Vue

ฟีเจอร์การโทรผ่านวิดีโอสำหรับ Vue

เชื่อมโยงผู้คน

ควบคุมประสบการณ์การโทรได้อย่างมั่นใจ

ทำให้เป็นของคุณเอง

สำรวจคอมโพเนนต์การโทรวิดีโอ Vue

ฝังอินเทอร์เฟซการโทร Vue ของคุณ

เริ่มวิดีโอคอลใน Vue

หน้าต่างลอย

ปรับแต่ง UI Kit การโทร Vue

เลย์เอาต์และการควบคุม

เสียงเรียกเข้าและข้อมูลระบุตัวตน

เพิ่มวิดีโอคอลในแอป Vue ของคุณ

สร้างแอปของคุณ

เพิ่ม UI Kit การโทรวิดีโอสำหรับ Vue

เริ่มการโทรครั้งแรกของคุณ

คำถามที่พบบ่อยเกี่ยวกับ UI Kit การโทรวิดีโอสำหรับ Vue

Vue Video Calling UI Kit มีอะไรบ้าง

ฉันควรใช้ SDK การโทรสำหรับ Vue หรือ UI Kit

วิดีโอคอลด้วย Vue ต้องใช้อะไรบ้างในเบราว์เซอร์

ฉันจะยืนยันตัวตนผู้ใช้ Vue Video Calling UI Kit ได้อย่างไร

UI Kit การโทรผ่านวิดีโอสำหรับ Vue ใช้งานได้ฟรีหรือไม่

จะผสานรวม UI Kit การโทรวิดีโอ Vue กับ Vue ได้อย่างไร?

จะทดสอบ UI Kit การโทรวิดีโอ Vue ก่อนเผยแพร่แอปได้อย่างไร?

จะปรับแต่งอินเทอร์เฟซของ UI Kit การโทรวิดีโอ Vue ได้อย่างไร?

การสนับสนุนด้านการผสานรวมสำหรับ Vue Call

คำถามเกี่ยวกับการผสานรวม

พูดคุยเกี่ยวกับแอปพลิเคชันของคุณ

เพิ่มวิดีโอคอลลงในแอป Vue ของคุณ