ASP.NET网络摄像头显示

ASP.NET Webcam Display

本文关键字:显示 摄像头 网络 NET ASP      更新时间:2023-09-26

我正在用VB编写一个asp.net网站,并试图通过javascript集成网络摄像头功能。我正在使用webcam.js(可在此处找到:https://github.com/jhuckaby/webcamjs)。当我创建了一个新项目来测试这一点并解决问题时,它运行得很好。然而,当我试图将其集成到我的主要项目中时,视频没有加载,我只剩下一个空白屏幕。我可以确认,它确实适用于IE、firefox和chrome中的副项目,但在将其集成到我的主项目中后,它们都不适用。集成过程并不复杂,主要是复制粘贴和添加必要的引用。起初,我遇到了它无法识别"Webcam"的问题,但在我编码到Webcam.js文件的确切位置后,这种问题就消失了(我知道这稍后会成为一个问题,但我现在更担心的是让它在调试模式下工作,所以没关系)。我的代码如下:

<%@ Page Language="vb" AutoEventWireup="false" CodeBehind="WebcamPart.aspx.vb" Inherits="IMHmfgb_VerJon.WebCamPart" %>
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title></title>
</head>
<body>
    <form id="form1" runat="server">
        <asp:ScriptManager EnablePageMethods="true" runat="server" />
        <asp:UpdatePanel ID="UpdatePanel1" runat="server">
        <ContentTemplate>
        <script src="location of webcam.js"></script>
    <div id="my_camera" style="width:640px; height:480px"></div>
    <asp:Label ID="Label1" runat="server" Font-Size="12"></asp:Label>
    <script type="text/javascript">
        function showCam() {
            Webcam.attach('my_camera');
        }
    </script>
    <asp:Button ID="Button2" runat="server" OnClientClick="showCam();return false" Text="Show Cam" /><asp:Button ID="Button1" runat="server" OnClientClick="take_snapshot();return false" Text="Scan" />
    <script type="text/javascript">
        function take_snapshot() {
            Webcam.snap(function (data_uri) {
                PageMethods.BarcodeScan(data_uri, onSuccess, onFailure);
            })
        };
        function onSuccess(result) {
            document.getElementById('<%=Label1.ClientID%>').innerHTML = result;
        };
        function onFailure(result) {
        document.getElementById('<%=Label1.ClientID%>').innerHTML = result;
        };
    </script>
            </ContentTemplate>
            </asp:UpdatePanel>
            <asp:UpdateProgress ID="UpdateProgress1" runat="server" AssociatedUpdatePanelID="UpdatePanel1" DisplayAfter="500">
        <ProgressTemplate>
            <asp:Image ImageUrl="~'Pictures'Loading.gif" runat="server" ImageAlign="Middle" />
        </ProgressTemplate>
    </asp:UpdateProgress>
    </form>
</body>
</html>

我不认为上面的代码是问题所在,因为如上所述,它本身运行良好。这让我相信,在我的主要项目中,有一些设置或代码干扰了加载视频,但我不知道该在哪里查找或查找什么。

经过大量的故障排除,我解决了自己的问题。显然,仅仅在以下代码块中说明webcam.js文件的位置是不够的:

<script src="location of webcam.js"></script>

您需要将webcam.js和webcam.swf文件与使用它们的页面放在同一文件夹中。我通过查看chrome中的错误控制台发现了这一点。我认为IE中的错误是一样的,因为我的网站是在IE中运行的,所以我先检查了一下。