Yes, completely. Your webcam feed and photos never leave your device. Everything is processed locally in your browser. We don't store, upload, or access any of your photos.

Which browsers are supported?

Chrome, Firefox, Edge, and Safari on desktop and mobile (iOS 14.5+) support webcam access. Some older browsers may not have getUserMedia support.

Can I use multiple cameras?

Yes, if your device has multiple cameras (like a laptop and external USB webcam), you can select between them in the Camera dropdown.

What format do my photos download in?

Captured photos download as JPG images. If you take several, they can be downloaded together as a ZIP.

Do my photos stay private?

Yes. Photos are captured from your camera and saved entirely in your browser; nothing is uploaded to a server.

Webcam Photo Booth miễn phí

Chụp ảnh với webcam của bạn trực tiếp trong trình duyệt. Áp dụng bộ lọc, hẹn giờ và lưu ảnh chụp cục bộ.

Ảnh của bạn không bao giờ rời khỏi thiết bị

Thư viện

Cách hoạt động

Cho phép camera: nhấp « Khởi động camera » và cấp quyền truy cập khi trình duyệt yêu cầu.
Điều chỉnh các tùy chọn: chọn một bộ lọc, kích hoạt chế độ phản chiếu và đặt hẹn giờ nếu bạn muốn vào vị trí trước khi chụp.
Chụp và tải xuống: nhấp « Chụp ảnh ». Ảnh tích lũy trong thư viện, sẵn sàng tải xuống riêng lẻ hoặc theo lô.

Câu hỏi thường gặp

Ảnh của tôi có được gửi trực tuyến không?

Không. Tất cả việc xử lý diễn ra trong trình duyệt của bạn qua API MediaDevices; hình ảnh không bao giờ rời khỏi thiết bị của bạn. Không có máy chủ nào nhìn thấy hoặc lưu trữ luồng video của bạn.

Tại sao camera không khởi động?

Kiểm tra rằng bạn đã cho phép truy cập camera trong cài đặt trình duyệt, trang web được phục vụ qua HTTPS (bắt buộc cho truy cập camera) và không có ứng dụng nào khác đang sử dụng nó.

Tôi có thể chọn giữa nhiều webcam không?

Có. Nếu nhiều camera được kết nối, bộ chọn « Camera » liệt kê tất cả: webcam tích hợp, webcam USB ngoài, camera ảo, v.v.

Webcam Trình Duyệt Thực Sự Hoạt Động Như Thế Nào

Quyền truy cập camera của trình duyệt được điều chỉnh bởi đặc tả W3C Media Capture and Streams. Điểm vào là navigator.mediaDevices.getUserMedia(): một hàm mà trang gọi với một đối tượng constraints mô tả loại luồng nó muốn. Trình duyệt hiển thị lời nhắc quyền; nếu bạn cho phép, hàm phân giải với một đối tượng MediaStream chứa một hoặc nhiều track video. Trang liên kết luồng đó với một phần tử <video> qua video.srcObject = stream, luồng trực tiếp hiển thị trên màn hình, và chụp một khung hình là vẽ video lên HTML5 <canvas> tại thời điểm người dùng nhấp Chụp ảnh. Canvas được xuất qua canvas.toBlob('image/jpeg'), trở thành file JPG có thể tải xuống. Không có khung hình nào rời khỏi thiết bị của bạn, toàn bộ pipeline nằm trong tiến trình trình duyệt của bạn.

getUserMedia dựa trên promise được phát hành không có tiền tố trong Chrome 53 (tháng 9 năm 2016) và Firefox 36 (tháng 2 năm 2015). Safari là kẻ trì hoãn: quyền truy cập webcam từ trang web không đến iOS cho đến iOS 11 (tháng 9 năm 2017), và mục tiêu ổn định hiện đại là iOS 14.5 trở lên. Đến năm 2026, API về cơ bản là phổ quát, caniuse đặt hỗ trợ toàn cầu trên 97%.

Tại Sao HTTPS Là Bắt Buộc

getUserMedia bị giới hạn trong «secure contexts», HTTPS, localhost trên desktop, hoặc file:// trong Firefox. Các trang phục vụ qua HTTP không thể truy cập camera chút nào; lời gọi bị từ chối với NotAllowedError. Đây là lỗi triển khai phổ biến nhất cho các biến thể tự lưu trữ của loại công cụ này, và được thực thi đồng nhất bởi mọi trình duyệt hiện đại. Di động còn nghiêm ngặt hơn: không có ngoại lệ localhost trên điện thoại, vì vậy kiểm tra công cụ camera trên máy chủ dev cục bộ yêu cầu công cụ tunneling như ngrok hoặc reverse proxy với TLS.

Constraints, Cách Yêu Cầu Đúng Camera

Đối tượng constraints là phần phức tạp nhất của API. Các tham số phổ biến:

width / height: chấp nhận một số trực tiếp hoặc một đối tượng với min, ideal, max, exact. ideal là mặc định thực tế; trình duyệt đến gần nhất có thể mà không từ chối camera không thể khớp chính xác. exact từ chối nếu phần cứng không thể đáp ứng.
facingMode: 'user' cho camera mặt trước (selfie) hoặc 'environment' cho camera mặt sau. Trên laptop chỉ có một camera, constraint bị âm thầm bỏ qua; trên điện thoại đây là cách sạch sẽ nhất để chọn ống kính phù hợp mà không cần liệt kê thiết bị.
frameRate: hầu hết webcam giới hạn ở 30 fps; một số camera USB ngoài đạt 60.
deviceId: để chọn một thiết bị cụ thể sau khi liệt kê bằng navigator.mediaDevices.enumerateDevices(). Điểm tinh tế quan trọng: label là chuỗi rỗng cho đến khi người dùng đã cấp ít nhất một quyền camera trong phiên này, vì vậy danh sách thả xuống «pick your camera» chạy trước bất kỳ lần cấp quyền nào sẽ hiển thị ID không có nhãn. Danh sách thả xuống Camera ở trên tránh vấn đề này bằng cách chỉ điền sau khi Bắt đầu Camera thành công.

Đèn Camera Là Tín Hiệu Tin Tưởng Của Bạn

Trên Mac với webcam từ năm 2008 trở đi, đèn LED xanh lá bên cạnh camera được nối với cùng ray điện như cảm biến. macOS và firmware đảm bảo đèn LED bật bất cứ khi nào cảm biến được cấp điện, Apple đã thiết kế điều này để ngay cả phần mềm độc hại cấp kernel cũng không thể tắt đèn LED trong khi camera đang ghi. iOS triển khai chỉ báo chấm cam ở đầu màn hình từ iOS 14 (phát hành tháng 9 năm 2020), được vẽ bởi một tiến trình hệ thống mà ứng dụng không thể ức chế. Webcam Windows sử dụng cách tiếp cận tương tự trên hầu hết các thiết bị hiện đại, mặc dù việc thực thi ít đồng nhất hơn, một số webcam USB cũ từ năm 2010 có đèn LED được điều khiển bằng phần mềm. Linux thay đổi theo phần cứng.

Bài học rút ra: hãy tin tưởng đèn LED, không phải trang web. Một công cụ thuần trình duyệt như công cụ này có thể thực sự hứa rằng không có gì rời khỏi thiết bị của bạn, và đèn camera cho bạn xác nhận độc lập rằng camera thực sự tắt khi trang nói như vậy. Lỗi phổ biến nhất trong các công cụ webcam là quên gọi stream.getTracks().forEach(t => t.stop()) khi đóng, triệu chứng: đèn camera vẫn sáng sau khi người dùng nghĩ họ đã tắt. Nút Dừng Camera trên trang này gọi điều đó một cách tường minh.

Khi Nào Bạn Sẽ Dùng Công Cụ Webcam Trình Duyệt

Ảnh đại diện nhanh cho Slack, Discord, GitHub, mạng xã hội, mà không cần cài ứng dụng webcam riêng.
Ảnh kiểu hộ chiếu / CMND chụp tại nhà cho các biểu mẫu trực tuyến (gia hạn bằng lái xe, xin visa). Câu chuyện quyền riêng tư trên trình duyệt quan trọng ở đây chính xác vì việc tải ảnh khuôn mặt lên dịch vụ bên thứ ba là không thoải mái.
Xem trước hội nghị video: kiểm tra ánh sáng, khung hình và hậu cảnh ảo trông như thế nào trước khi tham gia cuộc gọi Zoom hoặc Teams.
Điểm danh học đường và làm việc từ xa: khi giáo viên hoặc người sử dụng lao động yêu cầu một selfie nhanh để xác nhận sự hiện diện.
Ảnh tham khảo cho nghệ thuật và thiết kế: tư thế bàn tay, ảnh đối tượng cho mô hình 3D, phác thảo chân dung.
Gian chụp ảnh nhẹ tại sự kiện: chạy laptop với trang captive để khách có thể chụp selfie mà không cần cài ứng dụng.
Mockup và prototype: nhà thiết kế xây dựng quy trình có bước «chụp selfie» muốn có một trang kiểm tra nhanh.
Demo giáo dục: giáo viên cho học sinh thấy cách Camera API web hiện đại hoạt động.

Điểm khác biệt so với Photo Booth trên macOS hay ứng dụng Camera trên Windows là không có gì được cài đặt và không có gì được tải lên, hữu ích trên máy tính công ty bị khóa và kiosk dùng chung nơi bạn không thể cài phần mềm.

Bộ lọc: CSS filter Property Cho Bạn Gì

Canvas HTML5 có thể áp dụng cú pháp CSS filter thông qua thuộc tính ctx.filter. Các bộ lọc có ở trên sử dụng cùng các nguyên thủy mà bất kỳ quy tắc CSS nào cũng có thể áp dụng: grayscale(1) (giảm bão hòa hoàn toàn, tương đương với phép chiếu độ chói), sepia(1) (tông nâu ấm bắt chước ảnh cũ), invert(1) (âm bản màu), blur(5px) (làm mờ Gaussian), brightness(1.4) (nhân cường độ pixel) và contrast(1.4) (xoay quanh xám trung). Chúng đã được tăng tốc phần cứng trong mọi trình duyệt kể từ Chrome 53 / Firefox 35 / Safari 9.1.

Một chi tiết tinh tế nhưng quan trọng: các bộ lọc CSS áp dụng cho phần tử <video> không lan truyền sang canvas. Để ghi bộ lọc vào file JPG đã lưu, cùng bộ lọc phải được đặt trên ctx.filter trước drawImage. Trang này làm điều đó, vì vậy xem trước trên màn hình khớp với file đã lưu từng pixel một.

Lỗi Phổ Biến và Ý Nghĩa Của Chúng

Nếu Bắt đầu Camera thất bại, lỗi trả về là DOMException với một trong những tên này:

NotAllowedError: bạn (hoặc phiên trước) đã từ chối quyền, hoặc trang không ở HTTPS. Nhìn vào menu quyền trang web trên thanh địa chỉ và đảm bảo Camera được đặt là Cho phép hoặc Hỏi.
NotFoundError: không tìm thấy thiết bị phù hợp. Thường xảy ra nhất khi yêu cầu facingMode: 'environment' với exact trên desktop không có camera mặt sau.
NotReadableError: phần cứng đang được ứng dụng khác sử dụng. Zoom, Teams, OBS hoặc tab trình duyệt khác đang mở camera. Đóng chúng lại và thử lại.
OverconstrainedError: các constraint không thể được thỏa mãn. Bỏ các yêu cầu exact hoặc nới lỏng độ phân giải.
TypeError: đối tượng constraints trống. Lời gọi phải yêu cầu ít nhất một trong audio hoặc video.

Câu hỏi thêm

Tại sao ảnh của tôi bị lộn ngược hoặc xoay ngang?

Một số camera Android báo cáo thông tin xoay không chính xác trong metadata EXIF của chúng. Trình duyệt thường áp dụng phép xoay tự động trước khi khung video đến canvas, nhưng các phiên bản Samsung Internet cũ và một số WebView nhúng bỏ qua bước này. Nếu ảnh chụp ra bị xoay ngang, hãy thử xoay thiết bị của bạn 90° trước khi chụp, hoặc dùng công cụ Rotate Image sau đó.

Tại sao danh sách thả xuống hiển thị «Camera 1, Camera 2» thay vì tên?

Vì trình duyệt chưa được cấp quyền camera. enumerateDevices() trả về nhãn (ví dụ: «FaceTime HD Camera») chỉ sau khi người dùng đã phê duyệt quyền truy cập camera ít nhất một lần trong phiên hiện tại, cho đến lúc đó, chỉ các ID mờ đục được trả về. Nhấp Bắt đầu Camera một lần, cho phép truy cập và danh sách thả xuống sẽ làm mới với tên thực.

Đèn camera có tiếp tục sáng sau khi tôi đóng trang không?

Không. Nút Dừng Camera dừng rõ ràng mọi track trong luồng, và các trình duyệt hiện đại cũng dừng các track khi tab bị ẩn hoặc trang được dỡ tải. Nếu bạn thấy đèn LED camera tiếp tục sáng sau khi đóng tab, đó là lỗi đáng báo cáo, thường có nghĩa là trang đã không gọi hàm dọn dẹp. Trên công cụ này, nhấp Dừng Camera hoặc đóng tab giải phóng phần cứng ngay lập tức.

Tôi có thể quay video không, không chỉ ảnh tĩnh?

Không có trên công cụ này, nó chỉ là chụp ảnh tĩnh. Quay video yêu cầu MediaRecorder API và tạo ra các file WebM, MP4 hoặc MKV tùy thuộc vào trình duyệt. Quay phim cũng có những tác động quyền riêng tư riêng (bạn đang lưu trữ lượng lớn hơn cảnh quay có thể nhận dạng) vì vậy đó là một trường hợp sử dụng riêng biệt đáng được xử lý bằng công cụ chuyên dụng riêng.

Có dữ liệu nào được gửi đến máy chủ không?

Không. Luồng video được cung cấp trực tiếp từ hệ điều hành đến trình duyệt; việc chụp canvas và xuất JPG xảy ra qua JavaScript cục bộ; gallery sống trong bộ nhớ trình duyệt và được tải xuống trực tiếp đến thiết bị của bạn. Không có gì về camera, khuôn mặt hoặc ảnh của bạn rời khỏi trang.