capture-video-frame
A micro-library for taking screenshots from a running HTML5 video. Built to work together with getUserMedia.js
Installation
$ npm install --save capture-video-frame
Example
HTML:
JavaScript:
; // When you want to record the imageconst frame = ; // Show the imageconst img = document;img; // Upload the image...const formData = ;formData; // ...with plain JSconst request = ;request;request;request; // ...or with jQuery$;
Browser support
Tested on current Chrome and Firefox.
API
captureVideoFrame(source, format, quality)
Parameters
source
(element or string, mandatory) Source video. If string, id of the element.
format
(string, optional) Output image format. Can be either png
or jpeg
. png
is the default.
quality
(number, optional) A Number between 0 and 1 indicating image quality if the requested type is image/jpeg or image/webp. The default value is 0.92.
Return value
- Object with
blob
,dataUri
, andformat
properties if the capture succeeded false
if the capture failed.
Image blob can be easily uploaded to the server using XHR2 FormData API.
Image data URI can be easily set as <img>
src
attribute to show the captured image.
License
MIT