Webカメラを使用してイメージをキャプチャし、MS SQL Serverデータベースに保存します。JSPでのみWebカメラを使用してイメージをキャプチャする方法(サーブレットを使用せずに)MS SQL Serverに保存する方法
ウェブカメラを使用してイメージをキャプチャできますが、今はイメージを次のページに渡そうとしていますが、次のjspでイメージを処理できませんでした。
コード画像
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Web camera - Testing</title>
<script>
// Put event listeners into place
window.addEventListener("DOMContentLoaded", function() {
// Grab elements, create settings, etc.
var canvas = document.getElementById("canvas"),
context = canvas.getContext("2d"),
video = document.getElementById("video"),
videoObj = {"video": true},
errBack = function (error) {
console.log("Video capture error: ", error.code);
};
// Put video listeners into place
if (navigator.getUserMedia) { // Standard
navigator.getUserMedia(videoObj, function (stream) {
video.src = stream;
video.play();
}, errBack);
} else if (navigator.webkitGetUserMedia) { // WebKit-prefixed
navigator.webkitGetUserMedia(videoObj, function (stream) {
video.src = window.webkitURL.createObjectURL(stream);
video.play();
}, errBack);
} else if (navigator.mozGetUserMedia) { // WebKit-prefixed
navigator.mozGetUserMedia(videoObj, function (stream) {
video.src = window.URL.createObjectURL(stream);
video.play();
}, errBack);
}
// Trigger photo take
document.getElementById("snap").addEventListener("click", function() {
context.drawImage(video, 0, 0, 213, 160);
document.getElementById('canvasImg').src = canvas.toDataURL("image/png");
// document.getElementById('video').style.display = "none"; // hide the live image video portin after click on take picture
});
}, false);
</script>
</head>
<body>
<h1>Capture Image using Camera!</h1>
<!--
Ideally these elements aren't created until it's confirmed that the
client supports video/camera, but for the sake of illustrating the
elements involved, they are created with markup (not JavaScript)
-->
<video id="video" width="213" height="160" autoplay></video>
<button id="snap">Capture Photo</button>
<form action="savetesting.jsp" method="post">
<canvas id="canvas" width="213" height="160" name="ImageFile1" style="display: none;"></canvas>
<img id="canvasImg" name="ImageFile"><img>
<input type="reset" value="Reset"/>
<input type="submit" value="Submit"/>
</form>
</body>
</html>
をキャプチャするが、今、私は
request.getParameter("ImageFile");
を使用して撮影した画像を取得しようとしていますが、成功することができませんでした。
この問題で私を助けてください。次のページでイメージを取得するには、MS SQL Serverデータベースにイメージを保存しようとしますが、サーブレットを使用せずにJSPを使用します。
名=「をimagefile1」で説明したように
javax.xml.bind.DatatypeConverter
を使用してそれらを処理するが、あなたは取得request.getParameter( "ImageFile");両方が統一されている必要があります! –ImageFileとImageFile1の両方を使用してイメージソースを取得しようとしましたが、イメージソースを取得できませんでした –
上記のコードをファイルで使用すると、空白のページが開きます。ウェブカメラではありませんか? –