簡體   English   中英

相機未在Android設備上顯示

[英]Camera not showing on android device

我正在嘗試使用Crosswalk來顯示用戶的相機。 我遇到的問題是它沒有顯示,我也不知道為什么。 控制台也不顯示任何錯誤。

<!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;
        }
    });
});

我必須在應用程序的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.
        }
    }
}

暫無
暫無

聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.

 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM