Capture Webcam Video and Audio with Meteor

Meteor is a unique open-source multi-platform full-stack JavaScript platform. To put all these in one sentence may not seem that unique, but comparing it to other JavaScript frameworks and platforms it offers unique more than building web apps.

The Meteor app is consisting of a server and a client as it makes a use of client's (browser) database and sync data between clients and server.

With Meteor, developers can build web apps, mobile apps (iOS, Android), server apps, bot apps,  or use it as a backend with its powerful DDP (Distributed Data Protocol) for mobile, web or desktop apps.

I have been using Meteor for years, with different frameworks, Blaze, Angular, React and recently Vue. I have a seamless experience using it as a backend for Flutter app.

In this quick tutorial, we will learn how to access and use the webcam through a Meteor client (browser).

Meteor Camera package

As Meteor is using Cordova for mobile development (iOS and Android), It can access the mobile camera easily through a Meteor package or Cordova package.

Meteor Developer Group (MDG) created a special package to access  the web browser's camera API, which does not require much for setup.

Meteor and HTML Camera Video and Audio

However, in this tutorial we will use HTML-5 which works seamlessly with BlazeJS the first client-side template-ready framework.

getUserMedia() has been available since Chrome 21, Opera 18, and Firefox 17. With getUserMedia(), you can finally tap into webcam and microphone input without a plugin.

Later, I will publish some tutorials about how to do the same with React, Angular and Vue.