從相機捕捉圖像到窗體或html5畫布

我需要從網絡攝像頭（連接相機等）捕捉圖像到窗體或html5畫布，以便我可以將圖像保存到服務器。另外，我希望能夠在頁面中預覽圖像。從相機捕捉圖像到窗體或html5畫布

例如，我有一個瀏覽器運行在註冊檢查站。我想爲當前站在桌前的與會者拍一張照片，並將該圖像提交到數據庫中。然後，我可以使用該圖像將其圖片打印在與會者的徽章上。

我正在使用導軌和回形針，但我懷疑這個問題。

任何人之前做過這個，或者有一些想法如何做到這一點？

2010-09-23 Karl

對於來自Google的其他人：純HTML5解決方案現在適用於所有當前瀏覽器。請參閱http://www.html5rocks.com/en/tutorials/getusermedia/intro/。 – 2013-10-09 19:06:42

@HubertOG http://www.html5rocks.com/en/tutorials/getusermedia/intro/#toc-screenshot不適用於我 – 2014-03-10 01:51:11

有一個名爲「jQuery網絡攝像頭插件」的jQuery插件，它提供了一種友好而簡單的方法來與網絡攝像頭交互。它實際上依賴於一個小型閃存組件（不幸的是），但它使交互變得非常簡單 - 同時提供了將圖像直接複製到HTML5畫布中的功能。

再一次，它不幸的是它依賴於Flash，但我認爲任何可靠的解決方案都需要在這個時候閃光。

2010-09-23 20:20:39

優秀的解決方案。同意閃光要求是必要的罪惡。 – Karl 2010-09-23 20:31:40

目前，如果你想從網頁上與網絡攝像頭進行交互，你需要使用插件來看看.Flash有一個成熟的網絡攝像頭界面，所以它將成爲我的首選工具。

曾經有一個規範支持HTML 5中的原生網絡攝像頭，但它已被分解爲its own, independent, specification。目前there is no browser support在experimental Opera builds之外。

2010-09-23 20:12:04 Quentin

不幸的是，我同意閃光燈是您最好的選擇。 – Peter 2010-09-23 20:13:34

現在Chrome 18+支持此功能。請參閱www.html5rocks.com中的示例 – Spiff 2012-05-09 07:54:46

的Android> = 3.0（上大量片和一個電話很快）應該支持這一點。搜索「html媒體捕獲」和「設備API」將爲您提供更多信息。

在不平衡alpha出血邊，有像webrtc和mozilla彩虹插件的東西。

2011-11-10 11:07:50

回答