Webcam Image Capturing but image not getting...

Jul 31 2020 3:19 AM

Here is my Asp.Net C# Web code for image capture from webcame using jquery. But when i'm going to take image webcam access but image not getting on image control please suggest me whats the issue in this code....?

<head runat="server">
<title>Crop Image</title>
<script src="FinalJquery/jquery-1.8.3.min.js"></script>
<script src="FinalJquery/jquery.webcam.js"></script>
<script src="FinalJquery/webcam.min.js"></script>
</head>
<body>
<form id="form1" runat="server">
<div>
<table border="1" align="center">
<tr>
<th colspan="2">Croped Image</th>
</tr>
<tr>
<th>Live Camera</th>
<th>Captured Image</th>
</tr>
<tr>
<td id="my_camera"></td>
<td>
<asp:Image ID="imgCapture" runat="server" Height="250" Width="200" />
</td>
</tr>
<tr>
<td colspan="2" align="center">
<asp:Button ID="btnCapture" runat="server" Text="Take Pic" OnClientClick=" return Capture()" /></td>
</tr>
</table>
</div>
</form>
<script type="text/javascript">
var pageUrl = '<%=ResolveUrl("~/Default2.aspx") %>';
Webcam.set({
width: 400,
height: 400,
image_format: 'jpeg',
jpeg_quality: 100
});
Webcam.attach('#my_camera');
function take_snapshot() {
Webcam.snap(function (data_uri) {
$(".image-tag").val(data_uri);
document.getElementById('imgCaputre');
},
{
onSave: function (data) {
$.ajax({
type: "POST",
url: pageUrl + "/GetCapturedImage",
data: '',
contentType: "application/json; charset=utf-8",
dataType: "json",
success: function (r) {
$("[id*=imgCaputre]").css("visibility", "visible");
$("[id*=imgCaputre]").attr("src", r.d);
},
failure: function (response) {
alert(response.d);
}
});
},
onCapture: function () {
webcam.save(pageUrl);
}
});
};
function Capture() {
webcam.capture();
return false;
};
</script>
</body>

Answers (2)

send image one page to another page in c#

Capture image crop image using jquery