2016-12-12 28 views
0

我的Web應用程序目標是允許用戶從攝像頭上傳圖片並保證圖片沒有從用戶檔案中選擇。如何執行攝像頭的上傳照片

以下代碼正常工作,但用戶可以選擇「拍照」或「選擇圖片」。是否有可能只強制「拍照」選項?

<input id="myFileInput" type="file" accept="image/*" capture="camera"> 
<script> 
var myInput = document.getElementById('myFileInput'); 

function sendPic() { 
    var file = myInput.files[0]; 

    // Send file here 

} 

myInput.addEventListener('change', sendPic, false); 
</script> 

還有其他想法嗎?

回答

3

有一種方法可以通過navigator.getUserMedia() API來做到這一點,但有可能會被棄用,並且在Safari和Webkit中不支持。

這樣做有一個新標準,與navigator.mediaDevices.getUserMedia(myConstraints),但它還沒有廣泛支持(在IE和Safari中不支持)。

直到我們有一個貫徹實現的API,JavaScript才能完成這個任務。你需要的是一個可以訪問手機功能的原生應用程序,JavaScript不能這樣做。

-1

自2012年以來,使用JavaScript從瀏覽器訪問攝像機已成爲可能。請參見caniuse getUserMedia():70%的使用過的瀏覽器支持此功能。你只對移動設備感興趣嗎?然後百分比更高。

該方法首先定義爲navigator.getUserMedia(),但之後移至MediaDevices.getUserMedia()。

要使用getUserMedia()來生成只有一個圖片(相對於視頻流) 遵循這個Tutorial on mdn和它的demo,它確實你問什麼了。

+1

請參閱:https://developer.mozilla.org/en-US/docs/Web/API/Navigator/getUserMedia這已被棄用。這是新標準:https://developer.mozilla.org/en-US/docs/Web/API/MediaDevices/getUserMedia,但它不被廣泛支持。 –

+0

navigator.getUserMedia已被棄用。新方法是MediaDevices.getUserMedia()。您可以通過試用包含在教程中的演示來檢查它 – bjelli

+0

IE和Safari不支持這種新方法,所以它不太實用。 –

相關問題