2016-11-16 3 views
0

Я пытаюсь использовать Crosswalk для отображения камеры пользователя. Проблема, с которой я сталкиваюсь, заключается в том, что она не отображается, и я не знаю, почему. Консоль также не отображает никаких ошибок.Камера не отображается на устройстве Android

<!doctype html> 
<html> 

<head> 
    <title>Camera</title> 
    <meta http-equiv="Content-Security-Policy" content="default-src * data: gap: https://ssl.gstatic.com 'unsafe-inline'; style-src * 'unsafe-eval'; media-src 'self' blob:"> 
    <meta name="viewport" content="width=device-width, initial-scale=1"> 
</head> 

<body> 
    <div class="container"> 
     <video id="monitor" autoplay></video> 
     <canvas id="photo"></canvas> 
     <input type=button value="&#x1F4F7;" onclick="snapshot()"> 
    </div> 
    <script type="text/javascript" src="js/plugins/jquery.min.js"></script> 
    <script type="text/javascript" src="js/dist/pages/camera.js"></script> 
</body> 

</html> 

Я использую этот JavaScript, чтобы запустить его:

$(window).on('load', event => { 
    var video = document.getElementById('monitor'); 
    var canvas = document.getElementById('photo'); 

    navigator.getUserMedia({ 
     video: true 
    }, stream => { 
     video.src = URL.createObjectURL(stream); 
     video.onloadedmetadata = function() { 
      canvas.width = video.videoWidth; 
      canvas.height = video.videoHeight; 
     }; 
    }, error => { 
     console.log('Could not load media'); 
    }); 

    function snapshot() { 
     canvas.getContext('2d').drawImage(video, 0, 0); 
    } 
}); 

Я также попробовал JavaScript этот путь, а также:

$(window).on('load', event => { 
    var video = document.getElementById('monitor'); 
    var canvas = document.getElementById('photo'); 

    navigator.mediaDevices.getUserMedia({ video: true }).then(stream => { 
     video.src = URL.createObjectURL(stream); 
     video.onloadedmetadata =() => { 
      canvas.width = video.videoWidth; 
      canvas.height = video.videoHeight; 
     } 
    }); 
}); 

ответ

0

мне пришлось добавить разрешения во время выполнения в Java чтобы это заработало:

@Override 
protected void onCreate(Bundle savedInstanceState) { 
    if(ContextCompat.checkSelfPermission(this, Manifest.permission.CAMERA) != PackageManager.PERMISSION_GRANTED){ 
     if(ActivityCompat.shouldShowRequestPermissionRationale(this, Manifest.permission.CAMERA)){ 
      Snackbar.make(xWalkWebView, "Camera access is required to attach pictures to tasks.", Snackbar.LENGTH_INDEFINITE) 
      .setAction("OK", new View.OnClickListener() { 
       @Override 
       public void onClick(View view) { 
        // Request the permission 
        ActivityCompat.requestPermissions(GenericActivity.this, 
          new String[]{android.Manifest.permission.CAMERA}, 
          159); 
       } 
      }).show(); 
     }else { 

      // No explanation needed, we can request the permission. 

      ActivityCompat.requestPermissions(this, 
        new String[]{android.Manifest.permission.CAMERA}, 
        159); 

      // 159 is an app-defined int constant. The callback method gets the 
      // result of the request. 
     } 
    } 
} 
Смежные вопросы