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

时间:2011-07-05 07:48:25

标签: jquery asp.net webcam

我正在使用JQuery网络摄像头插件
Here is the home page
它似乎非常有用,但我的问题是我不知道如何使用asp.net保存图像(不使用PHP)。有没有人有任何建议?

4 个答案:

答案 0 :(得分:1)

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

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

答案 1 :(得分:1)

我不知道如何使用上面链接中给出的指令存储图像,但是我使用了其他链接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; }

此代码中提供了您要添加图片的文件夹名称,我已经图片

试试这个,Happy Coding

答案 2 :(得分:0)

我想投票给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

答案 3 :(得分:-1)

你可以这样做:

webcam.save('/path_to_your_aspx');

而且,服务器端:

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

希望这会有所帮助。干杯