Hướng dẫn thiết lập dành cho web

Trang này cho bạn biết cách thiết lập môi trường phát triển để sử dụng MediaPipe Tasks trong các ứng dụng web JavaScript.

Nền tảng và phiên bản được hỗ trợ

Để tạo ứng dụng web bằng MediaPipe Tasks, môi trường phát triển của bạn cần có:

Trình duyệt Chrome hoặc Safari
Ứng dụng web sử dụng Node.js và ALIAS. Ngoài ra, bạn có thể dùng thẻ tập lệnh để truy cập vào Tác vụ của MediaPipe thông qua mạng phân phối nội dung (CDN).

Các phần phụ thuộc MediaPipe Tasks

MediaPipe Tasks cung cấp 3 thư viện tạo sẵn dành cho thị giác, văn bản và âm thanh. Tuỳ thuộc vào Tác vụ MediaPipe mà ứng dụng sử dụng, hãy nhập thư viện tầm nhìn, văn bản hoặc âm thanh vào dự án phát triển của bạn.

Nhiệm vụ dựa trên AI tạo sinh

Mô-đun AI tạo sinh của MediaPipe Tasks chứa các nhiệm vụ xử lý việc tạo hình ảnh hoặc văn bản. Để nhập các thư viện AI tạo sinh của MediaPipe Tasks, hãy nhập các phần phụ thuộc sau đây vào dự án phát triển của bạn.

API suy luận LLM

Tác vụ Dự đoán LLM của MediaPipe nằm trong thư viện tasks-genai.

npm install @mediapipe/tasks-genai

Nếu muốn triển khai cho một máy chủ, bạn có thể sử dụng dịch vụ mạng phân phối nội dung (CDN), chẳng hạn như jsDelivr, để thêm mã trực tiếp vào trang HTML của mình.

<head>
  <script src="https://cdn.jsdelivr.net/npm/@mediapipe/tasks-genai/genai_bundle.cjs"
    crossorigin="anonymous"></script>
</head>

Nhiệm vụ liên quan đến thị giác

Mô-đun thị giác của MediaPipe Tasks chứa các nhiệm vụ xử lý đầu vào là hình ảnh hoặc video. Để nhập thư viện thị giác MediaPipe Tasks, hãy nhập phần phụ thuộc sau đây vào dự án phát triển của bạn.

npm install @mediapipe/tasks-vision

<head>
  <script src="https://cdn.jsdelivr.net/npm/@mediapipe/tasks-vision/vision_bundle.js"
    crossorigin="anonymous"></script>
</head>

Việc cần làm liên quan đến văn bản

Mô-đun văn bản MediaPipe Tasks chứa các tác vụ xử lý thông tin đầu vào dạng chuỗi. Để nhập thư viện văn bản MediaPipe Tasks, hãy nhập phần phụ thuộc sau vào dự án phát triển của bạn.

npm install @mediapipe/tasks-text

<head>
  <script src="https://cdn.jsdelivr.net/npm/@mediapipe/tasks-text/text_bundle.js"
    crossorigin="anonymous"></script>
</head>

Việc cần làm về âm thanh

Mô-đun âm thanh MediaPipe Tasks chứa các tác vụ xử lý đầu vào âm thanh. Để nhập thư viện âm thanh MediaPipe Tasks, hãy nhập phần phụ thuộc sau vào dự án phát triển của bạn.

npm install @mediapipe/tasks-audio

<head>
  <script src="https://cdn.jsdelivr.net/npm/@mediapipe/tasks-audio/audio_bundle.js"
    crossorigin="anonymous"></script>
</head>

Cấu hình BaseOptions

BaseOptions cho phép cấu hình chung của MediaPipe Task API.

Tên tùy chọn	Nội dung mô tả	Giá trị được chấp nhận
`modelAssetBuffer`	Nội dung tệp thành phần mô hình dưới dạng một mảng đã nhập `Uint8Array`.	`Uint8Array`
`modelAssetPath`	Đường dẫn của thành phần mô hình để mở và ánh xạ vào bộ nhớ.	`TrustedResourceUrl`
`Delegate`	Bật tính năng tăng tốc phần cứng thông qua tính năng uỷ quyền thiết bị để chạy quy trình MediaPipe. Giá trị mặc định: `CPU`.	[`CPU`, `GPU`]

Khắc phục sự cố

Để được trợ giúp về các câu hỏi kỹ thuật liên quan đến MediaPipe, hãy truy cập vào nhóm thảo luận hoặc StackOverflow để được cộng đồng hỗ trợ. Để báo cáo lỗi hoặc đưa ra yêu cầu về tính năng, hãy gửi vấn đề trên GitHub.