ブラウザからカメラへのアクセスについて質問があります。 (AndroidおよびiOSブラウザー)
GoogleとAppleは1年前に発表されましたが、ブラウザからカメラへのアクセスが間もなく利用可能になるはずです。
モバイルWebアプリケーションにこの機能が必要です。
この機能は現在利用できますか?
以下を試してください:
<html>
<body>
<form>
<input type="file" accept="image/*;capture=camera"/>
<input type="submit"/>
</form>
</body>
</html>
彼らがここで言ったように、私は入力を使用しました、そしてiOで本当にうまく働きました。カメラやフォトアルバムから写真を取得し、img要素を設定できます。
これがコードです: http://jsfiddle.net/2wZgv/
Js:
<script>
oFReader = new FileReader();
oFReader.onload = function (oFREvent) {
document.getElementById("fotoImg").src = oFREvent.target.result;
document.getElementById("fotoImg").style.visibility = "visible";
var screenHeight = screen.availHeight;
screenHeight = screenHeight - 220;
document.getElementById("fotoImg").style.height = screenHeight;
};
$(function() {
$("input:file").change(function (){
var input = document.querySelector('input[type=file]');
var oFile = input.files[0];
oFReader.readAsDataURL(oFile);
});
});
</script>
これを試してみてください。
<video id="Video" autoplay="autoplay" audio="muted" width="100%" height ="100%"> </video>
<script type="text/javascript">
if (navigator.getUserMedia) {
var video = document.getElementById('Video');
video.src = null;
navigator.getUserMedia('video', successCallback, errorCallback);
//if everything if good then set the source of the video element to the mediastream
function successCallback(stream) {
video.src = stream;
}
//If everything isn't ok then say so
function errorCallback(error) {
alert("An error occurred: [CODE " + error.code + "]");
}
}
else {
//show no support for getUserMedia
alert("Native camera is not supported in this browser!");
}
</script>
ただし、これはOpera Android for Mobileでのみ機能します。現在カメラアクセスでサポートされている他のブラウザーはありません。私の知る限り、iOSは現在この機能をサポートしていないため、将来的にはサポートされる可能性があります。
ありがとうございました。