-4

I have website exemption system i want when user open website record session and save video to wwwroot and when finish session end video i want in JavaScript or c#

project : asp mvc core

when finish just end recording and save in wwwroot

1 Answer 1

0

You could try below code to capture screen and save the video:

view(index.cshtml):

<button onclick="startRecording()">Start Recording</button>
<button onclick="stopRecording()">Stop Recording</button>
<script>
    let mediaRecorder;
    let recordedBlobs = [];

    function startRecording() {
        recordedBlobs = [];
        navigator.mediaDevices.getDisplayMedia({ video: true }).then(stream => {
            mediaRecorder = new MediaRecorder(stream);
            mediaRecorder.ondataavailable = (event) => {
                if (event.data && event.data.size > 0) {
                    recordedBlobs.push(event.data);
                }
            };
            mediaRecorder.start();
        }).catch((err) => {
            console.error("Error accessing display media: ", err);
        });
    }

    function stopRecording() {
        mediaRecorder.stop();
        const blob = new Blob(recordedBlobs, { type: 'video/webm' });
        uploadVideo(blob);
    }

    function uploadVideo(blob) {
        const formData = new FormData();
        formData.append('video', blob, 'session_recording.webm');

        fetch('/api/upload', {
            method: 'POST',
            body: formData,
        })
            .then(response => response.json())
            .then(data => console.log(data))
            .catch(err => console.error(err));
    }
</script>

UploadController:

[Route("api/[controller]")]
 [ApiController]
 public class UploadController : Controller
 {
     [HttpPost]
     public async Task<IActionResult> Post()
     {
         var video = Request.Form.Files["video"];
         if (video != null && video.Length > 0)
         {
             var filePath = Path.Combine("wwwroot", "uploads", video.FileName);

             Directory.CreateDirectory(Path.GetDirectoryName(filePath));

             using (var stream = new FileStream(filePath, FileMode.Create))
             {
                 await video.CopyToAsync(stream);
             }

             return Ok(new { message = "Video uploaded successfully" });
         }

         return BadRequest(new { message = "No video file found" });
     }
 }

SS

Not the answer you're looking for? Browse other questions tagged or ask your own question.