ImageCapture: takePhoto() method

Phương thức takePhoto() của giao diện ImageCapture chụp một ảnh đơn lẻ từ thiết bị quay video cung cấp MediaStreamTrack và trả về một Promise phân giải thành một Blob chứa dữ liệu ảnh.

Cú pháp

js
takePhoto()
takePhoto(photoSettings)

Tham số

photoSettings Optional

Một đối tượng thiết lập các tùy chọn cho ảnh được chụp. Các tùy chọn có sẵn bao gồm:

fillLightMode

Chế độ đèn flash của thiết bị chụp, một trong các giá trị "auto", "off", hoặc "flash".

imageHeight

Chiều cao hình ảnh mong muốn dưới dạng số nguyên. Tác nhân người dùng chọn giá trị chiều cao gần nhất với cài đặt này nếu chỉ hỗ trợ các chiều cao rời rạc.

imageWidth

Chiều rộng hình ảnh mong muốn dưới dạng số nguyên. Tác nhân người dùng chọn giá trị chiều rộng gần nhất với cài đặt này nếu chỉ hỗ trợ các chiều rộng rời rạc.

redEyeReduction

Giá trị boolean cho biết liệu có nên sử dụng tính năng giảm mắt đỏ nếu có hay không.

Giá trị trả về

Một Promise phân giải thành một Blob.

Ngoại lệ

InvalidStateError DOMException

Được ném ra nếu thuộc tính readyState của MediaStreamTrack được truyền vào hàm khởi tạo không phải là live.

UnknownError DOMException

Được ném ra nếu thao tác không thể hoàn thành vì bất kỳ lý do nào.

Ví dụ

Ví dụ này được trích xuất từ Simple Image Capture demo. Nó minh họa cách dùng Promise được trả về bởi takePhoto() để sao chép Blob trả về vào phần tử <img>. Để đơn giản, ví dụ không hiển thị cách tạo đối tượng ImageCapture.

js
let takePhotoButton = document.querySelector("button#takePhoto");
let canvas = document.querySelector("canvas");

takePhotoButton.onclick = takePhoto;

function takePhoto() {
  imageCapture
    .takePhoto()
    .then((blob) => {
      console.log("Took photo:", blob);
      img.classList.remove("hidden");
      img.src = URL.createObjectURL(blob);
    })
    .catch((error) => {
      console.error("takePhoto() error: ", error);
    });
}

Thông số kỹ thuật

Thông số kỹ thuật
MediaStream Image Capture
# dom-imagecapture-takephoto

Tương thích trình duyệt