How to capture the video from webcam in asp.net,C#

Question

I need to capture video from webcam in asp.net and save the file in sql 2005 database,

How to capture the video from webcam from browser and save to database, pls send any sample project or article or link regarding this in asp.net,C#.

Answer 1

You want to use DirectShow. Check out DirectShow.NET at SourceForge.

If you're working on Vista, you should check out the future platform: Microsoft Media Foundation, which also has a .NET library at SourceForge.

Good luck!

Answer 2

To get this sort of thing working cross browser, you'd probably need to look at a combination of a Flash object (which has tools to hook into a users webcam), and a Flash Communication Server to capture the stream from the capture and convert it into a .flv that you can save somewhere.

Answer 3

## Yes , we can capture video / image in asp.net c# using bootstrap and html 5...

Also we can save video in server folder or project folder .

This article will run at chrome / firebox / Opera browser .

And for saving this blob video take a new button and write click event in c# ..

its working properly ,

Use below code and capture your video .......

Thanks. ##

    
         $(document).ready(function () {
                  
                   
                    let preview = document.getElementById("preview");
                    let recording = document.getElementById("recording");
                    let startButton = document.getElementById("startButton");
                    let stopButton = document.getElementById("stopButton");
                    let downloadButton = document.getElementById("downloadButton");
                    let logElement = document.getElementById("log");
    
    
                    let recordingTimeMS = 30000;
                    function log(msg) {
                        logElement.innerHTML += msg + "\n";
                    }
                    function wait(delayInMS) {
    
                        return new Promise(resolve => setTimeout(resolve, delayInMS));
    
                    }
                    function startRecording(stream, lengthInMS) {
                        let recorder = new MediaRecorder(stream);
                        let data = [];
    
                        recorder.ondataavailable = event => data.push(event.data);
                        recorder.start();
                        log(recorder.state + " for " + (lengthInMS / 1000) + " seconds...");
                       
    
                        $('#startButton').attr('disabled', true);
                        $('#stopButton').attr('disabled', false);
                         $('#downloadButton').attr('disabled', true);
                        $('#<%=btnsaven.ClientID%>').attr('disabled', true);
                
                     
    
                        let stopped = new Promise((resolve, reject) => {
                            recorder.onstop = resolve;
                            recorder.onerror = event => reject(event.name);
                        });
    
                        let recorded = wait(lengthInMS).then(
                            () => recorder.state == "recording" && recorder.stop()
                                           
                        );
    
                        return Promise.all([
                            stopped,
                            recorded
                        ])
                            .then(() => data);
                    }
                    function stop(stream) {
                        stream.getTracks().forEach(track => track.stop());
    
                    }
                    startButton.addEventListener("click", function () {
                      
                        navigator.mediaDevices.getUserMedia({
                            video: true,
                            audio: true
                        }).then(stream => {
                            preview.srcObject = stream;
                            downloadButton.href = stream;
                            preview.captureStream = preview.captureStream || preview.mozCaptureStream;
                            return new Promise(resolve => preview.onplaying = resolve);
                        }).then(() => startRecording(preview.captureStream(), recordingTimeMS))
                            .then(recordedChunks => {
                                let recordedBlob = new Blob(recordedChunks, { type: "video/mp4" });
                                recording.src = URL.createObjectURL(recordedBlob);
                                downloadButton.href = recording.src;
                                downloadButton.download = "RecordedVideo.mp4";
                              
    
                                   $('#startButton').attr('disabled', false);
                                    $('#stopButton').attr('disabled', true);
                                    $('#downloadButton').attr('disabled', false);
                                $('#<%=btnsaven.ClientID%>').attr('disabled', false);
    
                              
    
                                var reader = new FileReader();
                                reader.readAsDataURL(recordedBlob);
                                reader.onloadend = function () {
                                    var base64data = reader.result;
    
                                    document.getElementById("<%=hfName.ClientID %>").value = base64data;
    
                                }
    
    
                                stop(preview.srcObject);
    
                                log("Successfully recorded " + recordedBlob.size + " bytes of " +
                                    recordedBlob.type + " media.");
    
    
                            })
                            .catch(log);
                    }, false); stopButton.addEventListener("click", function () {
    
                       
    
                        stop(preview.srcObject);
    
                    
    
                        $('#startButton').attr('disabled', false);
                                    $('#stopButton').attr('disabled', true);
                                    $('#downloadButton').attr('disabled', false);
                                $('#<%=btnsaven.ClientID%>').attr('disabled', false);
    
                    }, false);
    
                });
    
    

    
        <link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.4.0/css/bootstrap.min.css" rel="stylesheet"/>
        <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/1.12.0/jquery.min.js"></script>
        <div class="panel-body">
                      
                        <div class="col-md-1">
                        </div>
    
                        <div class="col-md-3">
                            <h2>Live Preview</h2>
                            <video id="preview" controls width="260" height="150" autoplay muted style="border: solid 2px green; background-color: black"></video>
                            <br />
                            &nbsp;&nbsp;   &nbsp;&nbsp;
                                    <div id="startButton"  class="button btn btn-success btn-sm">&nbsp; &nbsp; &nbsp;Start  &nbsp; &nbsp; &nbsp; </div>
                            &nbsp;&nbsp;
    
                                    <div id="stopButton" disabled class="button btn btn-warning btn-sm">&nbsp; &nbsp; &nbsp;Stop &nbsp; &nbsp; &nbsp;  </div>
                            <br />
    
                        
    
    
                        </div>
                        <div class="col-md-2">
                            <br /><br /> <br /><br />
                           
                        </div>
                        <div class="col-md-4">
                            <h2>Recorded Video</h2>
                            <video id="recording" width="260" height="150" controls style="border: solid 2px green"></video>
                            <br />
                           
    
                            &nbsp;&nbsp;
                                  <a id="downloadButton" disabled class="button btn btn-primary btn-sm">&nbsp; &nbsp; &nbsp;Download &nbsp; &nbsp; &nbsp;</a>
    
                            <asp:HiddenField ID="hfName" runat="server" />
                        </div>
    
    
                        <div class="col-md-12">
                            <br />
                            <pre id="log"></pre>
                        </div>
                    </div>