หน้านี้แสดงวิธีตั้งค่าสภาพแวดล้อมการพัฒนาเพื่อใช้ MediaPipe Tasks ในเว็บแอปพลิเคชัน JavaScript
แพลตฟอร์มและเวอร์ชันที่รองรับ
ในการสร้างเว็บแอปพลิเคชันด้วย MediaPipe Tasks สภาพแวดล้อมในการพัฒนาซอฟต์แวร์ของคุณ ต้องการสิ่งต่อไปนี้
- เบราว์เซอร์ Chrome หรือ Safari
- เว็บแอปพลิเคชันที่ใช้ Node.js และ NPM อีกวิธีหนึ่งคือ แท็กสคริปต์เพื่อเข้าถึงงาน MediaPipe ผ่านเครือข่ายนำส่งข้อมูล (CDN)
ทรัพยากร Dependency ของ MediaPipe Tasks
MediaPipe Tasks มีไลบรารีที่สร้างไว้ล่วงหน้า 3 รายการสำหรับการมองเห็น ข้อความ และเสียง นำเข้าวิสัยทัศน์ ข้อความ หรือ คลังเพลงและเสียงลงในโปรเจ็กต์พัฒนา
งานของ Generative AI
โมดูล Generative AI ของ MediaPipe Tasks มีงานที่จัดการกับรูปภาพหรือ การสร้างข้อความ หากต้องการนำเข้าไลบรารี MediaPipe Tasks Generative AI ให้นำเข้าลิงก์ ทรัพยากร Dependency ต่อไปนี้ในโปรเจ็กต์การพัฒนาของคุณ
API การอนุมานของ LLM
งาน MediaPipe LLM Inference อยู่ในไลบรารี tasks-genai
npm install @mediapipe/tasks-genai
หากต้องการปรับใช้กับเซิร์ฟเวอร์ คุณก็ใช้เครือข่ายนำส่งข้อมูล (CDN) ได้ เช่น jsDelivr เพื่อเพิ่มโค้ดโดยตรงลงใน หน้า HTML ของคุณ
<head>
<script src="https://cdn.jsdelivr.net/npm/@mediapipe/tasks-genai/genai_bundle.cjs"
crossorigin="anonymous"></script>
</head>
งานด้านการมองเห็น
โมดูลวิสัยทัศน์ของ MediaPipe Tasks มีงานที่จัดการรูปภาพหรือวิดีโอ อินพุต หากต้องการนำเข้าไลบรารีวิสัยทัศน์ของ MediaPipe Tasks ให้นำเข้าคำสั่งต่อไปนี้ ที่พึ่งพิงของคุณในโครงการพัฒนา
npm install @mediapipe/tasks-vision
หากต้องการปรับใช้กับเซิร์ฟเวอร์ คุณก็ใช้เครือข่ายนำส่งข้อมูล (CDN) ได้ เช่น jsDelivr เพื่อเพิ่มโค้ดโดยตรงลงใน หน้า HTML ของคุณ
<head>
<script src="https://cdn.jsdelivr.net/npm/@mediapipe/tasks-vision/vision_bundle.js"
crossorigin="anonymous"></script>
</head>
งานด้านข้อความ
โมดูลข้อความ MediaPipe Tasks มีงานที่จัดการอินพุตสตริง ถึง นำเข้าไลบรารีข้อความ MediaPipe Tasks แล้วนำเข้าการอ้างอิงต่อไปนี้ไปยัง ในโครงการพัฒนาของคุณ
npm install @mediapipe/tasks-text
หากต้องการปรับใช้กับเซิร์ฟเวอร์ คุณก็ใช้เครือข่ายนำส่งข้อมูล (CDN) ได้ เช่น jsDelivr เพื่อเพิ่มโค้ดโดยตรงลงใน หน้า HTML ของคุณ
<head>
<script src="https://cdn.jsdelivr.net/npm/@mediapipe/tasks-text/text_bundle.js"
crossorigin="anonymous"></script>
</head>
งานเกี่ยวกับเสียง
โมดูลเสียงของ MediaPipe Tasks มีงานที่จัดการอินพุตเสียง ถึง นำเข้าไลบรารีเสียงของ MediaPipe Tasks แล้วนำเข้าการอ้างอิงต่อไปนี้ไปยัง ของคุณลงในโครงการพัฒนา
npm install @mediapipe/tasks-audio
หากต้องการปรับใช้กับเซิร์ฟเวอร์ คุณก็ใช้เครือข่ายนำส่งข้อมูล (CDN) ได้ เช่น jsDelivr เพื่อเพิ่มโค้ดโดยตรงลงใน หน้า HTML ของคุณ
<head>
<script src="https://cdn.jsdelivr.net/npm/@mediapipe/tasks-audio/audio_bundle.js"
crossorigin="anonymous"></script>
</head>
การกำหนดค่า BaseOptions
BaseOptions ช่วยให้กำหนดค่าทั่วไปของ MediaPipe Task API ได้
ชื่อตัวเลือก | คำอธิบาย | ค่าที่ยอมรับ |
---|---|---|
modelAssetBuffer |
เนื้อหาไฟล์เนื้อหาโมเดลเป็นอาร์เรย์ที่พิมพ์ Uint8Array |
Uint8Array |
modelAssetPath |
เส้นทางของเนื้อหาโมเดลที่จะเปิดและแมปในหน่วยความจำ | TrustedResourceUrl |
Delegate |
เปิดใช้การเร่งฮาร์ดแวร์ผ่านผู้รับมอบสิทธิ์อุปกรณ์เพื่อเรียกใช้ไปป์ไลน์ MediaPipe ค่าเริ่มต้น: CPU |
[CPU ,GPU ] |
การแก้ปัญหา
สำหรับความช่วยเหลือสำหรับคำถามด้านเทคนิคที่เกี่ยวข้องกับ MediaPipe โปรดไปที่การอภิปราย group หรือ Stack รายการเพิ่มเติมสำหรับการสนับสนุนจาก กับชุมชน หากต้องการรายงานข้อบกพร่องหรือส่งคำขอฟีเจอร์ ให้แจ้งปัญหาใน GitHub