Веб-камера потоковой передачи и захвата изображения в C# ASP.NET - PullRequest
Новая
       111

Веб-камера потоковой передачи и захвата изображения в C# ASP.NET

0 голосов
/ 04 мая 2020

Я пытаюсь разработать приложение для веб-сервера, в котором внешняя веб-камера транслирует видео, чтобы клиент мог захватывать изображение из видеопотока с помощью кнопки захвата, и, если это возможно, применять некоторые фильтры с помощью инфраструктуры Accord. NET ... Мне просто нужен веб-камера и захват изображения, чтобы я мог преобразовать его в растровое изображение ... Кто-нибудь знает, как я могу это сделать? Я пробовал с jquery плагином, но я не знаю, почему он не работает. Вот код, который у меня есть на странице imageprocessing.aspx: 

<%@ Page Language="C#" MasterPageFile="~/MasterPage.master" AutoEventWireup="true" CodeBehind="imageprocessing.aspx.cs" Inherits="SpaceExplorationWeb.imageprocessing" %>

<asp:Content ID="Content1" ContentPlaceHolderID="head" Runat="Server">
    <title>Image Processing</title>
</asp:Content>
<asp:Content ID="Content2" ContentPlaceHolderID="ContentPlaceHolder1" Runat="Server">
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
<script src='<%=ResolveUrl("~/Webcam_Plugin/jquery.webcam.js") %>' type="text/javascript"></script>
<script type="text/javascript">
        var pageUrl = '<%=ResolveUrl("~/imageprocessing.aspx") %>';
        $(function () {
            jQuery("#webcam").webcam({
                width: 320,
                height: 240,
                mode: "save",
                swffile: '<%=ResolveUrl("~/Webcam_Plugin/jscam.swf") %>',
            debug: function (type, status) {
                $('#camStatus').append(type + ": " + status + '<br /><br />');
            },
            onSave: function (data) {
                $.ajax({
                    type: "POST",
                    url: pageUrl + "/GetCapturedImage",
                    data: '',
                    contentType: "application/json; charset=utf-8",
                    dataType: "json",
                    success: function (r) {
                        $("[id*=imgCapture]").css("visibility", "visible");
                        $("[id*=imgCapture]").attr("src", r.d);
                    },
                    failure: function (response) {
                        alert(response.d);
                    }
                });
            },
            onCapture: function () {
                webcam.save(pageUrl);
            }
        });
    });
        function Capture() {
            webcam.capture();
            return false;
        }
    </script>
    <!--/content -->
<form runat="server">
<div class="news"> 
    <div class="w3lnews-grid">
        <div class="col-md-6 col-sm-6 news-left" > 
            <div id="webcam" style="height:240px; width:320px; "> 
            </div>
        </div>
        <div class="col-md-6 col-sm-6 news-right">
            <h4>Real-Time Processing</h4>
            <asp:DropDownList id="ddlFilters" runat="server"></asp:DropDownList>
            <div class="more">
                <br /><br />
            <!-- <a id="applyRr" onclick="filterApplyR" href="#" class="hvr-shutter-in-vertical" data-toggle="modal" data-target="#myModal">Apply<span class="glyphicon glyphicon-arrow-right"></span></a> -->
                <span id="camStatus"></span>
            <asp:Button ID="applyR" runat="server" class="hvr-shutter-in-vertical" Text="Apply" onClick="applyR_Click"/>
            <a href="#" class="hvr-shutter-in-vertical" data-toggle="modal" data-target="#myModal">Restore<span class="glyphicon glyphicon-arrow-right"></span></a>
            </div>
        </div>
        <div class="clearfix"></div>
    </div> 
    <div class="w3lnews-grid">
        <div class="col-md-6 col-sm-6 news-right">
            <h4>Image Processing</h4>
            <asp:DropDownList id="DropDownList1" runat="server"></asp:DropDownList>
            <div class="more">
                <br /><br />
            <!-- <a id="applyRr" onclick="filterApplyR" href="#" class="hvr-shutter-in-vertical" data-toggle="modal" data-target="#myModal">Apply<span class="glyphicon glyphicon-arrow-right"></span></a> -->
            <asp:Button ID="btnCapture" Text="Capture" class="hvr-shutter-in-vertical" runat="server" OnClientClick="return Capture()" />
            <!-- <asp:Button ID="Button1" runat="server" class="hvr-shutter-in-vertical" Text="Capture" onClick="Button1_Click"/> -->
            <asp:Button ID="btnFiltro" Text="Aplicar Filtro" class="hvr-shutter-in-vertical" runat="server" OnClick="btnFiltro_Click" />
            </div>
        </div>
        <div class="col-md-6 col-sm-6 news-left"> 
            <div class="wthree-almubimg">  
                <asp:Image ID="imgCapture" runat="server"  height="438" style="align-content: center;" />
                <!-- <img runat="server" id="img2" src="" alt=" " height="438" style="align-content: center;"/> -->
            </div>
        </div>
        <div class="clearfix"></div>
    </div> 
</div>
</form>
<!-- //content -->
</asp:Content>
...