title: How to fix cannot access video stream (NotAllowedError) in flutter webview to use html5+webRTC camera api?
body: <p>I am using instascan.min js library to scan QR Codes in my web angular js application. but in my flutter web view, I got an error - Cannot access video stream (NotAllowedError), And I am unable to fix it. I don't have too much knowledge of flutter.</p>
  
  <p>I have tried to give permission to camera access but it's not working.</p>
  
  <p>//# My Flutter Code</p>
  
  <pre><code>import 'package:flutter/material.dart';
  import 'package:flutter_webview_plugin/flutter_webview_plugin.dart';
  
  
  void main () =&gt; runApp(MyApp());
  class MyApp extends StatelessWidget{
  @override
  Widget build(BuildContext context) {
  return MaterialApp(
    title: 'FOTOFACE WALLET',
    debugShowCheckedModeBanner: false,
    home: Home(),
  );
  }
  }
  
  class Home extends StatefulWidget{
  @override
   _HomeState createState() =&gt; _HomeState();
  }
  
  
  
  class _HomeState extends State&lt;Home&gt;{
  @override
  Widget build(BuildContext context) {
   return WebviewScaffold(
    appBar: PreferredSize(
        preferredSize: Size.fromHeight(0),
        child: AppBar(
          automaticallyImplyLeading: true, // hides leading widget
          backgroundColor: new Color(0xFF404E67),
        )
    ),
  
    url: "https://fotofacewallet.com",
    initialChild: Center(
      child: CircularProgressIndicator(),
    ),
  );
  }
  }
  </code></pre>
  
  <p>//# this is my scanner code in angular js controller</p>
  
  <pre><code>$scope.scan = () =&gt; {
  var overlay = $('.overlay'),
  close = $('&lt;div class="close" id="closescanbtn"&gt;close&lt;/div&gt;');
  overlay.append(close);
  let scanner = new Instascan.Scanner({
     video: document.getElementById('preview')
  });
  
  scanner.addListener('scan', function (content) {
  scanner.stop();
  $('.overlay').fadeOut();
  $('.overlay').hide();
  $scope.scanpayProcess(content);
  });
  Instascan.Camera.getCameras().then(function (cameras) {
  
  if (cameras.length &gt; 0) {
      if(cameras[1]){
          scanner.start(cameras[1]);
      } else {
          scanner.start(cameras[0]);
      } 
  } else {
    alert('No cameras found.');
  }
  
  
  }).catch(function (e) {
  alert(e);
  });
  $('.overlay').show();
  }
  </code></pre>
  
  <p>I am expecting a camera view in a flutter web view.</p>