Question

我正在尝试使用cordova来构建应用程序，但是我将其托管在服务器上，而不是在本地托管Web应用程序。

因此，该部分与白名单和允许导航非常兼容。

当我尝试使用相机时出现问题。似乎需要一些时间才能通过导航器访问照相机。

所以这是我简单的Web应用程序，旨在了解其工作原理。

<!DOCTYPE html>
<head>
    <title>test</title>
    <script src="scripts/cordova.js"></script>
</head>

<body>
<script>

    (function() {

        // camera will be undefined
        var camera = navigator.camera;

    })();


</script>
</body>
</html>

但是当我把整个东西放到setTimeout中时，它是可以访问的。

<!DOCTYPE html>
<head>
    <title>test</title>
    <script src="scripts/cordova.js"></script>
</head>

<body>

<script>

    (function() {
        setTimeout(function() {

            // I can now use it. 
            var camera = navigator.camera;

        }, 10000);
    })();


</script>

</body>

</html>

这是我的index.js文件，它将重定向到服务器上托管的Web应用程序。因此，它在重定向之前会等待设备准备就绪。

var app = {
    // Application Constructor
    initialize: function() {
        document.addEventListener('deviceready', this.onDeviceReady.bind(this), false);
    },

    // deviceready Event Handler
    //
    // Bind any cordova events here. Common events are:
    // 'pause', 'resume', etc.
    onDeviceReady: function() {
        this.receivedEvent('deviceready');
        window.location.replace("http://10.0.0.36:8080/");
    },

    // Update DOM on a Received Event
    receivedEvent: function(id) {
        var parentElement = document.getElementById(id);
        var listeningElement = parentElement.querySelector('.listening');
        var receivedElement = parentElement.querySelector('.received');

        listeningElement.setAttribute('style', 'display:none;');
        receivedElement.setAttribute('style', 'display:block;');

        console.log('Received Event: ' + id);
    }
};

app.initialize();

我想了解为什么？

谢谢

Answer 1

在调用任何插件之前，您需要等待设备准备就绪。

document.addEventListener("deviceready", function(){
  var camera = navigator.camera;
})

Cordova使用相机托管Web应用

1 个答案: