JQuery 网络摄像头插件 - 无需 PHP 即可保存图像

Question

我正在使用 JQuery 网络摄像头插件
Here is the home page
它似乎非常有用，但我的问题是我不知道如何使用 asp.net 保存图像（不使用 php）。有人有什么建议吗？

Answer 1

切换到这个库http://code.google.com/p/jpegcam/ 你只需要：

byte[] data = context.Request.BinaryRead(context.Request.TotalBytes);
File.WriteAllBytes(context.Server.MapPath("~/cam.jpg"), data);

Answer 2

我不知道如何使用上面链接中给出的说明存储图像，但我使用了其他链接 webcamjs 使用这个我能够使用 asp.net 服务器代码存储图像

在这个链接中，他们也只给出了 php，但我有 asp.net 服务器代码。 您必须从 webcamjs 下载插件并添加此代码...

这将是您将在其中显示网络摄像头捕获区域的 div

<div>
                    <table border="0" cellpadding="0" cellspacing="5">
                        <tr>
                            <td valign="top">
                                <h3 id="tk_pic" style="margin-left: 30px;">
                                    Take Picture</h3>
                                <div id="pic_area">
                                    <table id="Table2" runat="server">
                                        <tr>
                                            <td>

                                                <script type="text/javascript" language="JavaScript">
                                                    document.write(webcam.get_html(320, 240));
                                                </script>

                                            </td>
                                        </tr>
                                        <tr>
                                            <td>
                                                <input type="button" value="Configure..." onclick="webcam.configure()">
                                                &nbsp;&nbsp;
                                                <input type="button" value="Capture" onclick="webcam.freeze()">
                                                &nbsp;&nbsp;
                                                <input type="button" value="Upload"  onclick="do_upload()">
                                                &nbsp;&nbsp;
                                                <input type="button" value="Reset"  onclick="webcam.reset()">
                                            </td>
                                        </tr>
                                        <tr>
                                            <td>
                                                <div id="upload_results" runat="server" style="background-color: #eee;">
                                                </div>
                                            </td>
                                        </tr>
                                    </table>
                                </div>
                            </td>
                        </tr>
                    </table>
                </div>

而且这个脚本需要添加...

<script type="text/javascript" src="webcam.js"></script>
        <script type="text/javascript">

      webcam.set_api_url('../uploadimges.aspx');
            webcam.set_quality(90); // JPEG quality (1 - 100)
            webcam.set_shutter_sound(true); // play shutter click sound

                webcam.set_hook('onComplete', 'my_completion_handler');

                function do_upload() {
                    // upload to server
                     document.getElementById('<%=upload_results.ClientID%>').innerHTML  = '<h1>Uploading...</h1>';
                    webcam.upload();
                }

                function my_completion_handler(msg) {
                    // extract URL 
                    if (msg.match(/(http\:\/\/\S+)/)) {
                        var image_url = RegExp.$1;
                        // show JPEG image in page
                        document.getElementById('<%=upload_results.ClientID%>').innerHTML =
                        '<h1>Upload Successful!</h1>' +
                        '<img src="' + image_url + '">';

                        // reset camera for another shot
                        webcam.reset();
                    }
                    else alert("Error: " + msg);
                }

            </script>

创建新的uploadimges.aspx 命名文件并在该文件的页面加载时添加此代码....

protected void Page_Load(object sender, EventArgs e)
        {
    System.Drawing.Image originalimg;
                string strFile = DateTime.Now.ToString("dd_MMM_yymmss") + ".jpg";

                FileStream log = new FileStream(Server.MapPath(strFile), FileMode.OpenOrCreate);

                byte[] buffer = new byte[1024];
                int c;
                while ((c = Request.InputStream.Read(buffer, 0, buffer.Length)) > 0)
                {
                    log.Write(buffer, 0, c);
                }
                originalimg = System.Drawing.Image.FromStream(log);
                originalimg = originalimg.GetThumbnailImage(200, 200, new System.Drawing.Image.GetThumbnailImageAbort(ThumbnailCallback), IntPtr.Zero);
                originalimg.Save(Server.MapPath("Images") + "\\" + strFile);
                //Write jpg filename to be picked up by regex and displayed on flash html page.
                log.Close();
                originalimg.Dispose();
                File.Delete(Server.MapPath(strFile));
                Response.Write("../Images/" + strFile);
    }
        public bool ThumbnailCallback() { return false; }

在此代码中，给出您要在其中添加图像的文件夹名称，我已给出 Images。

试试这个，快乐编码

Answer 3

我想投票支持 JP Hellemons 的解决方案（但我不能，因为我还没有代表），因为这对我有很大帮助。一段时间以来，我一直在寻找网络摄像头解决方案，但一直未能想出一个简单直接的解决方案。

结合 sharad 的帖子和 JP hellemons，我设法将一些可行的东西组合在一起。我知道这是一篇旧帖子，但这可能会对某人有所帮助。

我使用了上面的代码、html/aspx 标记和 JavaScript。然后因为我使用的是 VB，所以我在后面的 uploadimages.aspx 代码中使用了以下代码。

  Protected Sub Page_Load(sender As Object, e As System.EventArgs) Handles Me.Load
        Dim data As Byte() = Context.Request.BinaryRead(Context.Request.TotalBytes)
        File.WriteAllBytes(Context.Server.MapPath("ProfileImages/" & DateTime.Now.ToString("dd_MMM_yymmssffff") & ".jpg"), data)
    End Sub

Answer 4

你可以这样做：

webcam.save('/path_to_your_aspx');

而且，服务器端：

var file = Request.Files[0];
//Save file to database or whatever you want to do

希望这会有所帮助。干杯