CODEWITHSUNDEEP
htmlhtml5-videogetusermedia
Dinesh Singh
Dinesh Singh

Reputation: 837

HTML5 Video recording and automatically uploading video on server

I am trying to develop a test taking website for students. In this website, students should be able to answer the questions(displayed in text format) by using webcam in one go. Currently I have implemented this feature using Flash, it captures the frames and simultaneously sends it to the server. The problem with this technique is that the quality(FPS) of my video is restricted and is dependent on the bandwidth of the internet connection. Also I am not in favor of using flash.

I want that as soon as student clicks on the start button, a timer should start to record the video. The video should get saved on the client's machine (without asking the client to mention the path) and on completion of video, it should automatically get uploaded on the server and when uploading gets completed, the video should be automatically deleted from the client's machine.

In short can anyone give me a starting point, so as to I can proceed with the work. Any helo will be highly appreciated.Thanks!

Upvotes: 3

Views: 4113

Answers (2)

octavn
octavn

Reputation: 3285

Currently I have implemented this feature using Flash, it captures the frames and simultaneously sends it to the server. The problem with this technique is that the quality(FPS) of my video is restricted and is dependent on the bandwidth of the internet connection.

That is actually incorrect.

The fps you're getting depends 100% on:

  1. the webcam quality
  2. the light available in the room (the more light the better)
  3. The resolution you're recording at (lower res results in higher fps even with low quality webcams in low light)

The video should get saved on the client's machine (without asking the client to mention the path) and on completion of video, it should automatically get uploaded on the server and when uploading gets completed, the video should be automatically deleted from the client's machine.

Flash records by streaming (through rtmp) the audio/video data to a media server (Red5, AMS, Wowza). After the recording is stopped you could move the file to a web server and trigger a http download.

In what regards HTML the Media Recording API has been implemented by Firefox and Chrome 49 and it allows you to record to local RAM and download the file as .webm (the audio video codecs might differ btwn browsers).

Disclaimer: I work at Pipe which handles video recording.

Upvotes: 0

Hese
Hese

Reputation: 290

Here is a good example how to get webcam working on html5:

http://blog.teamtreehouse.com/accessing-the-device-camera-with-getusermedia

It doesnt tell how to upload the video to the server.

Upvotes: 2

Related Questions