รันวิดีโอและการถ่ายทอดสดจากเว็บไซต์ของคุณเองผ่าน DCAST API

หากผลิตภัณฑ์ของคุณมีหน้าเว็บ ผู้ใช้ และฐานข้อมูลของตัวเองอยู่แล้ว การส่งผู้คนไปยังแดชบอร์ดวิดีโอแยกต่างหากถือเป็นการถอยหลัง คุณต้องการให้โค้ดของคุณเองเพิ่มวิดีโอ แสดงรายการวิดีโอ และเริ่มการถ่ายทอดสด ขณะที่ผู้เข้าชมยังอยู่บนเว็บไซต์ของคุณ บทความนี้จะพาคุณผ่านการตั้งค่าดังกล่าวด้วย DCAST API สิ่งที่ต้องตัดสินใจก่อน และข้อผิดพลาดที่ควรตรวจสอบก่อนเปิดใช้งานจริง

เชื่อมต่อเว็บไซต์ของคุณกับ DCAST ผ่าน API เพียงครั้งเดียว หลังจากนั้นโค้ดของคุณเองจะเพิ่มวิดีโอใหม่และสร้างการถ่ายทอดสดได้ โดยไม่ต้องเข้าแดชบอร์ดของ DCAST

เก็บคีย์ไว้บนเซิร์ฟเวอร์ของคุณและกำหนดว่าใครเป็นเจ้าของอะไร

ก่อนจะเขียนโค้ดอัปโหลดใด ๆ ให้ตัดสินใจก่อนว่าจะเก็บ API key ไว้ที่ใด เก็บ API key ไว้บนเซิร์ฟเวอร์ของคุณ และอย่าใส่ไว้ในหน้าเว็บที่ผู้เข้าชมโหลด ใครก็ตามที่เปิดซอร์สของหน้าเว็บหรือบันทึกเครือข่ายสามารถคัดลอกคีย์ที่ส่งไปยังเบราว์เซอร์ได้ และจากนั้นจะสามารถทำการแทนบัญชีของคุณได้ ให้เก็บคีย์ไว้ในตัวแปรสภาพแวดล้อม ไม่ให้อยู่ในระบบควบคุมเวอร์ชัน และให้เบราว์เซอร์ของคุณสื่อสารกับเส้นทางบนแบ็กเอนด์ของคุณเองเท่านั้น เส้นทางเหล่านั้นควรตรวจสอบว่าผู้เข้าชมได้รับอนุญาตให้อัปโหลดก่อนที่จะเรียกใช้ API วิดีโอ

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

อัปโหลดวิดีโอจากโค้ดของคุณเอง

เมื่อคุณเพิ่มวิดีโอผ่าน API คุณจะระบุชื่อเรื่อง ชื่อไฟล์ ขนาดไฟล์ และการมองเห็น เช่น public

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

ตัวไฟล์จะถูกส่งไปยังที่อยู่อัปโหลดที่ได้รับกลับมาด้วยคำขอ PUT

ตัดสินใจว่าใครเป็นผู้ส่งไบต์ การส่งจากเซิร์ฟเวอร์ของคุณเป็นทางที่ง่ายที่สุดในการบันทึกล็อกและลองใหม่ การส่งตรงจากเบราว์เซอร์ของผู้เข้าชมช่วยให้แบ็กเอนด์ของคุณไม่ต้องส่งต่อไฟล์ขนาดใหญ่ แต่คุณต้องแน่ใจว่าที่อยู่อัปโหลดปลอดภัยพอที่จะเปิดเผยให้ผู้เข้าชมคนนั้น และต้องจัดการกรณีที่แท็บถูกปิดไปกลางคัน เลือกวิธีเดียวต่อหนึ่งโปรเจกต์ จดบันทึกเหตุผลที่เลือก และทดสอบด้วยการเชื่อมต่อที่ถูกจำกัดความเร็ว

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

อ่านคำตอบของคำขออัปโหลดก่อนเริ่มส่งไบต์ และหยุดหากเป็นข้อผิดพลาด การส่งไฟล์ขนาดใหญ่ไปยังที่อยู่ที่คุณไม่เคยยืนยันเป็นการเสียเวลาของผู้เข้าชมและเสียแบนด์วิดท์ของคุณ แสดงข้อความที่เข้าใจง่ายเมื่อคำขอถูกปฏิเสธ และหลีกเลี่ยงการลองใหม่เป็นลูปถี่ ๆ ซึ่งจะทำให้ถูกปฏิเสธซ้ำเดิมเท่านั้น

วัดขนาดไฟล์ในฝั่งของคุณและส่งตัวเลขที่ตรงกันเป๊ะ ขนาดที่แจ้งไม่ตรงกับไฟล์จริงเป็นบั๊กประเภทที่จะปรากฏเฉพาะกับการอัปโหลดไฟล์ใหญ่ ดังนั้นให้ลองไฟล์เล็กหนึ่งไฟล์และไฟล์ขนาดหลายกิกะไบต์หนึ่งไฟล์ก่อนไว้ใจขั้นตอนนี้

รอที่อยู่สถานะก่อนแสดงวิดีโอ

เว็บไซต์ของคุณไม่ควรแสดงเพลเยอร์ทันทีที่ PUT เสร็จ ที่อยู่สถานะจากคำขออัปโหลดคือวิธีที่เว็บไซต์ของคุณจะรู้ว่าวิดีโอพร้อมแสดงแล้ว ดังนั้นให้เก็บไว้ถัดจากระเบียนวิดีโอในฐานข้อมูลของคุณเอง

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

วิดีโอแต่ละรายการในรายการจะแสดงสถานะ เช่น ready พร้อมกับที่อยู่ของหน้าเพลเยอร์

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

สร้างแกลเลอรีจากไลบรารีของคุณ

เว็บไซต์ของคุณอ่านรายการวิดีโอพร้อมสถานะของแต่ละรายการ และดึงโค้ดเพลเยอร์ที่พร้อมใช้ของรายการใดก็ได้ เพื่อให้สร้างแกลเลอรีวิดีโอของตัวเองจากไลบรารี DCAST ของคุณได้

รายการวิดีโอของคุณมีเฉพาะวิดีโอของบัญชีที่เป็นเจ้าของคีย์ และไม่มีวิดีโอของบัญชีอื่นเลย

รายการแบ่งเป็นหน้าและบอกจำนวนวิดีโอทั้งหมดของคุณ เว็บไซต์ของคุณจึงเปิดดูทีละหน้าในไลบรารีขนาดใหญ่ได้

อย่าดึงไลบรารีทั้งหมดทุกครั้งที่มีการเปิดหน้า แคชรายการไว้บนเซิร์ฟเวอร์ของคุณช่วงสั้น ๆ แสดงให้ผู้เข้าชมเห็นเฉพาะวิดีโอที่มีสถานะ ready และใช้จำนวนทั้งหมดเพื่อวาดลิงก์หน้า ล้างแคชเมื่อโค้ดของคุณเองเพิ่มวิดีโอ เพื่อให้รายการใหม่ปรากฏทันที

การขอโค้ดเพลเยอร์ของวิดีโอที่เป็นของบัญชีอื่นจะได้รับคำตอบว่าไม่พบ ให้ถือคำตอบนั้นเป็นกรณีปกติในโค้ดของคุณ เมื่อมันปรากฏกับตัวระบุที่คุณเก็บไว้เอง ให้ตรวจสอบก่อนว่าสภาพแวดล้อมของคุณใช้คีย์ใดอยู่ เพราะคีย์ผิดมีโอกาสเป็นสาเหตุมากกว่าระบบล่ม

วางเพลเยอร์บนหน้าเว็บของคุณ

โค้ดเพลเยอร์มาในรูปแบบที่อยู่ธรรมดา ตัวอย่างโค้ด iframe และเวอร์ชันแบบปรับขนาดได้ที่ย่อขยายตามหน้าเว็บ

โค้ดเพลเยอร์คือ iframe ที่คุณวางบนหน้าเว็บของคุณเอง

เลือกตามเลย์เอาต์ ใช้เวอร์ชันแบบปรับขนาดได้ในหน้าบทความและตารางการ์ด ซึ่งความกว้างเปลี่ยนไปตามหน้าจอ ใช้ที่อยู่ธรรมดาเมื่อคุณต้องการสร้าง iframe เอง เช่น เพื่อเพิ่มแอตทริบิวต์ title ที่ช่วยโปรแกรมอ่านหน้าจอ ตรวจสอบหน้าเว็บบนโทรศัพท์จริงก่อนเปิดใช้งาน เพราะเฟรมขนาดคงที่เป็นสาเหตุที่พบบ่อยที่สุดที่ทำให้วิดีโอที่ฝังดูเสียบนมือถือ

คุณสามารถวางเพลเยอร์ของวิดีโอและการถ่ายทอดสดของคุณบนเว็บไซต์ของตัวเองได้ด้วยโค้ดฝังสั้น ๆ

โดยค่าเริ่มต้น เพลเยอร์ที่ฝังทำงานได้บนทุกเว็บไซต์ ดังนั้นพันธมิตรหรือแฟน ๆ จึงแชร์เนื้อหาของคุณได้โดยไม่ต้องขออนุญาตคุณก่อน

หากต้องการควบคุม ให้ระบุรายการโดเมนที่เพลเยอร์ของคุณจะปรากฏได้ แล้วเว็บไซต์อื่นทั้งหมดจะถูกปฏิเสธ

กำหนดรายการตามเป้าหมายของคุณ จำกัดรายการเมื่อคุณขายสิทธิ์เข้าชมผ่านเว็บไซต์ของตัวเองและต้องการให้เพลเยอร์ปรากฏที่นั่นเท่านั้น ปล่อยรายการว่างไว้เมื่อเป้าหมายของคุณคือการเข้าถึงผู้ชมให้กว้าง เพราะโค้ดฝังทุกสำเนาจะใช้งานได้สำหรับใครก็ตามที่นำไปวาง

เริ่มการถ่ายทอดสดจากโค้ดของคุณ

เว็บไซต์ของคุณสร้างการถ่ายทอดสดผ่าน API และได้รับที่อยู่สำหรับเผยแพร่สัญญาณ พร้อมโค้ดเพลเยอร์สำหรับหน้าที่แสดงการถ่ายทอดสดนั้น

การถ่ายทอดสดใหม่มาพร้อมที่อยู่ RTMP ที่อยู่ SRT และที่อยู่ HTTPS สำหรับ WHIP ในกรณีที่ใช้งานได้

การถ่ายทอดสดที่สร้างผ่าน API จะถูกจัดเก็บไว้ให้บัญชีของคุณและมีที่อยู่ฝังสำหรับเพลเยอร์เป็นของตัวเอง

เลือกที่อยู่เผยแพร่ที่ตรงกับเอนโค้ดเดอร์ของคุณ เอนโค้ดเดอร์บนเดสก์ท็อปและกล่องฮาร์ดแวร์เกือบทั้งหมดรองรับ RTMP, SRT รับมือกับเครือข่ายที่สูญเสียแพ็กเก็ตได้ดีกว่าเมื่อเอนโค้ดเดอร์ของคุณรองรับ และ WHIP ช่วยให้เบราว์เซอร์เผยแพร่สัญญาณได้โดยไม่ต้องใช้ซอฟต์แวร์เพิ่มเติม หากไม่มีเหตุผลหนักแน่นที่จะเลือกอย่างอื่น ให้เริ่มด้วย RTMP และค่อยเปลี่ยนไปใช้แบบอื่นเมื่อการถ่ายทอดสดครั้งแรกของคุณทำงานได้แล้ว

ก่อนงานจริง ให้ซ้อมสิบนาทีที่สร้างขึ้นด้วยเส้นทางโค้ดเดียวกับที่คุณจะใช้ในวันงาน ตรวจสอบว่าเพลเยอร์บนหน้าเว็บของคุณแสดงภาพ มีเสียง และเอนโค้ดเดอร์ของคุณเชื่อมต่อใหม่ได้หลังจากที่คุณถอดสายเครือข่ายออกสองสามวินาที จากนั้นเก็บตัวระบุของการถ่ายทอดสดไว้ เพื่อให้ทีมซัพพอร์ตของคุณหาเจอในภายหลัง

รันการตรวจสอบเหล่านี้ก่อนเปิดใช้งานจริง

ทำตามรายการสั้น ๆ นี้ตามลำดับ ข้อแรก ค้นหา API key ในหน้าเว็บที่บิลด์แล้วและในบันทึกเครือข่ายของเบราว์เซอร์ ต้องไม่พบที่ใดเลย ข้อสอง อัปโหลดไฟล์เล็ก ไฟล์ใหญ่ และไฟล์ที่ไม่รองรับ แล้วยืนยันว่าแต่ละกรณีจบในสถานะที่อินเทอร์เฟซของคุณอธิบายได้ ข้อสาม เปิดแกลเลอรีในฐานะผู้เข้าชมที่ไม่ได้ล็อกอิน และตรวจสอบว่าวิดีโอที่ยังไม่เสร็จถูกซ่อนไว้ ข้อสี่ ขอเพลเยอร์สำหรับตัวระบุที่ไม่มีอยู่จริง และยืนยันว่าหน้าเว็บของคุณรับมือได้อย่างเหมาะสมแทนที่จะแสดงเฟรมว่าง

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