fix(QrcodeStream): wrong error for insecure context

For insecure context (HTTP rather than HTTPS) the component fails with
the throws the *Stream API not supported error* even when the API is
actually supported.

fix #110

Author: gruhn

src/misc/camera.js

@@ -1,5 +1,5 @@
 import adapterFactory from "webrtc-adapter/src/js/adapter_factory.js";
-import { StreamApiNotSupportedError } from "./errors.js";
+import { StreamApiNotSupportedError, InsecureContextError } from "./errors.js";
 import { imageDataFromVideo } from "./image-data.js";
 import { eventOn } from "callforth";
 
@@ -18,15 +18,28 @@ class Camera {
   }
 }
 
-const STREAM_API_SUPPORTED =
+const INSECURE_CONTEXT = window.isSecureContext !== true;
+
+const STREAM_API_NOT_SUPPORTED = !(
   navigator &&
   (navigator.getUserMedia ||
-    (navigator.mediaDevices && navigator.mediaDevices.getUserMedia));
+    (navigator.mediaDevices && navigator.mediaDevices.getUserMedia))
+);
 
 let streamApiShimApplied = false;
 
 export default async function(constraints, videoEl) {
-  if (!STREAM_API_SUPPORTED) {
+  // At least in Chrome `navigator.mediaDevices` is undefined when the page is
+  // loaded using HTTP rather than HTTPS. Thus `STREAM_API_NOT_SUPPORTED` is
+  // initialized with `false` although the API might actually be supported.
+  // So although `getUserMedia` already should have a build-in mechanism to
+  // detect insecure context (by throwing `NotAllowedError`), we have to do a
+  // manual check before even calling `getUserMedia`.
+  if (INSECURE_CONTEXT) {
+    throw new InsecureContextError();
+  }
+
+  if (STREAM_API_NOT_SUPPORTED) {
     throw new StreamApiNotSupportedError();
   }
 

src/misc/errors.js

@@ -21,3 +21,13 @@ export class StreamApiNotSupportedError extends Error {
     this.name = "StreamApiNotSupportedError";
   }
 }
+
+export class InsecureContextError extends Error {
+  constructor() {
+    super(
+      "camera access is only permitted in secure context. Use HTTPS or localhost rather than HTTP."
+    );
+
+    this.name = "InsecureContextError";
+  }
+}