Trang này được dịch bởi Cloud Translation API.

chrome.tabCapture

Nội dung mô tả

Dùng API chrome.tabCapture để tương tác với các luồng nội dung nghe nhìn trên thẻ.

Quyền

tabCapture

Khái niệm và cách sử dụng

API chrome.tabCapture cho phép bạn truy cập vào MediaStream chứa video và âm thanh của thẻ hiện tại. Người dùng chỉ có thể gọi tiện ích sau khi gọi một tiện ích, chẳng hạn như bằng cách nhấp vào nút hành động của tiện ích. Điều này tương tự như hành vi của quyền "activeTab".

Duy trì âm thanh của hệ thống

Khi lấy MediaStream cho một thẻ, âm thanh trong thẻ đó sẽ không được phát cho người dùng nữa. Điều này tương tự như hành vi của hàm getDisplayMedia() khi cờ suppressLocalAudioPlayback được đặt thành true.

Để tiếp tục phát âm thanh cho người dùng, hãy sử dụng:

const output = new AudioContext();
const source = output.createMediaStreamSource(stream);
source.connect(output.destination);

Thao tác này sẽ tạo một AudioContext mới và kết nối âm thanh của MediaStream của thẻ với đích đến mặc định.

Mã luồng

Việc gọi chrome.tabCapture.getMediaStreamId() sẽ trả về một mã luồng. Để truy cập vào MediaStream sau này từ mã nhận dạng, hãy sử dụng các mục sau:

navigator.mediaDevices.getUserMedia({
  audio: {
    mandatory: {
      chromeMediaSource: "tab",
      chromeMediaSourceId: id,
    },
  },
  video: {
    mandatory: {
      chromeMediaSource: "tab",
      chromeMediaSourceId: id,
    },
  },
});

Giới hạn mức sử dụng

Sau khi gọi getMediaStreamId(), có một số hạn chế về vị trí có thể dùng mã luồng được trả về:

Nếu consumerTabId được chỉ định, thì lệnh gọi getUserMedia() có thể sử dụng mã nhận dạng này trong bất kỳ khung nào trong thẻ nhất định có cùng nguồn gốc bảo mật.
Nếu bạn không chỉ định thuộc tính này, thì kể từ Chrome 116, mã nhận dạng có thể được dùng trong bất kỳ khung nào có cùng nguồn gốc bảo mật trong cùng một quy trình kết xuất với phương thức gọi. Điều này có nghĩa là bạn có thể sử dụng mã luồng có được trong một trình chạy dịch vụ trong tài liệu ngoài màn hình.

Trước Chrome 116, khi consumerTabId không được chỉ định, mã luồng bị giới hạn ở cả nguồn gốc bảo mật, quy trình kết xuất và khung kết xuất của phương thức gọi.

Tìm hiểu thêm

Để tìm hiểu thêm về cách sử dụng API chrome.tabCapture, vui lòng xem bài viết Ghi âm và chụp ảnh màn hình. Hình này minh hoạ cách dùng tabCapture và các API liên quan để giải quyết một số trường hợp sử dụng phổ biến.

Loại

CaptureInfo

Thuộc tính

toàn màn hình

boolean

Liệu một phần tử trong thẻ đang được chụp có ở chế độ toàn màn hình hay không.
status

TabCaptureState

Trạng thái chụp mới của thẻ.
tabId

number

Mã của thẻ có trạng thái đã thay đổi.

CaptureOptions

Thuộc tính

âm thanh

boolean không bắt buộc
audioConstraints

MediaStreamConstraint không bắt buộc
video

boolean không bắt buộc
videoConstraints

MediaStreamConstraint không bắt buộc

GetMediaStreamOptions

Chrome 71 trở lên

Thuộc tính

consumerTabId

số không bắt buộc

Mã thẻ (không bắt buộc) của thẻ này sau đó sẽ gọi getUserMedia() để sử dụng luồng. Nếu bạn không chỉ định thì chỉ tiện ích gọi mới có thể sử dụng luồng thu được. Chỉ các khung trong thẻ nhất định có nguồn gốc bảo mật khớp với nguồn gốc của thẻ tiêu thụ mới dùng được luồng. Nguồn gốc của thẻ phải là một nguồn gốc bảo mật, ví dụ: HTTPS.
targetTabId

số không bắt buộc

Mã thẻ không bắt buộc của thẻ cần được ghi lại. Nếu bạn không chỉ định, thì thẻ đang hoạt động hiện tại sẽ được chọn. Bạn chỉ có thể dùng các thẻ mà tiện ích đã được cấp quyền activeTab làm thẻ mục tiêu.

MediaStreamConstraint

Thuộc tính

bắt buộc

đối tượng
không bắt buộc

đối tượng không bắt buộc

TabCaptureState

Liệt kê

Phương thức

capture()

Chỉ nền trước

chrome.tabCapture.capture(
  options: CaptureOptions,
  callback: function,
)

Chụp khu vực hiển thị của thẻ hiện đang hoạt động. Bạn chỉ có thể bắt đầu chụp trên thẻ hiện đang hoạt động sau khi tiện ích đã được gọi, tương tự như cách activeTab hoạt động. Quá trình chụp được duy trì trong các lần điều hướng trang trong thẻ và dừng khi thẻ được đóng hoặc luồng nội dung nghe nhìn bị tiện ích đóng.

Tham số

tùy chọn

CaptureOptions

Định cấu hình luồng nội dung nghe nhìn được trả về.
số gọi lại

hàm

Tham số callback sẽ có dạng như sau:
```
(stream: LocalMediaStream)=>void
```
- luồng
  
  LocalMediaStream

getCapturedTabs()

Cam kết

chrome.tabCapture.getCapturedTabs(
  callback?: function,
)

Trả về danh sách thẻ đã yêu cầu chụp hoặc đang được chụp, tức là trạng thái != đã dừng và trạng thái != lỗi. Điều này cho phép tiện ích thông báo cho người dùng rằng hiện đang có một thẻ được chụp và sẽ ngăn việc chụp thẻ mới thành công (hoặc để ngăn các yêu cầu thừa cho cùng một thẻ).

Tham số

số gọi lại

hàm không bắt buộc

Tham số callback sẽ có dạng như sau:
```
(result: CaptureInfo[])=>void
```
- kết quả
  
  CaptureInfo[]

Giá trị trả về

Promise<CaptureInfo[]>

Chrome 116 trở lên

Lời hứa được hỗ trợ trong Manifest V3 trở lên nhưng lệnh gọi lại được cung cấp để có khả năng tương thích ngược. Bạn không thể sử dụng cả hai trong cùng một lệnh gọi hàm. Lời hứa sẽ được phân giải bằng cùng một loại được truyền đến lệnh gọi lại.

getMediaStreamId()

Cam kết Chrome 71 trở lên

chrome.tabCapture.getMediaStreamId(
  options?: GetMediaStreamOptions,
  callback?: function,
)

Tạo mã luồng để chụp thẻ đích. Tương tự như phương thức chrome.tabCapture.capture(), nhưng trả về mã luồng nội dung nghe nhìn (thay vì mã luồng nội dung nghe nhìn) cho thẻ người dùng thông thường.

Tham số

tùy chọn

GetMediaStreamOptions không bắt buộc
số gọi lại

hàm không bắt buộc

Tham số callback sẽ có dạng như sau:
```
(streamId: string)=>void
```
- streamId
  
  string

Giá trị trả về

Hứa hẹn<string>

Chrome 116 trở lên

Lời hứa được hỗ trợ trong Manifest V3 trở lên nhưng lệnh gọi lại được cung cấp để có khả năng tương thích ngược. Bạn không thể sử dụng cả hai trong cùng một lệnh gọi hàm. Lời hứa sẽ được phân giải bằng cùng một loại được truyền đến lệnh gọi lại.

Sự kiện

onStatusChanged

chrome.tabCapture.onStatusChanged.addListener(
  callback: function,
)

Sự kiện được kích hoạt khi trạng thái chụp của một thẻ thay đổi. Việc này cho phép tác giả tiện ích theo dõi trạng thái chụp của các thẻ để đồng bộ hoá các thành phần trên giao diện người dùng như thao tác trên trang.

Tham số

số gọi lại

hàm

Tham số callback sẽ có dạng như sau:
```
(info: CaptureInfo)=>void
```
- info
  
  CaptureInfo