L'événement Cordova filePluginIsReady ne se déclenche jamais sous iOS en utilisant le fichier cordova-plugin

Question

J'ai commencé à déboguer en travaillant avec des données persistantes pendant des semaines ... et je pense que j'ai finalement trouvé * une partie du problème.

La plupart de mes tests exécutent la plate-forme du navigateur dans Chrome 59 sur Windows 10, mais je construis également mon application avec Phonegap Build, et je l'installe sur mon iPhone (iOS 10.3.2).

Selon le Cordova doc's Chrome querks:

Chrome filesystem is not immediately ready after device ready event. As a workaround you can subscribe to filePluginIsReady event. Example:

window.addEventListener('filePluginIsReady', function(){ console.log('File plugin is ready');}, false);

You can use window.isFilePluginReadyRaised function to check whether event was already raised.

je n'étais pas en mesure d'obtenir l'écouteur d'événement « filePluginIsReady » de travail, donc finalement essayé console.logging window.isFilePluginReadyRaised, et bien sûr, il est faux!

En désespoir de cause, j'ai essayé d'ajouter une minuterie

setTimeout(function(){       
    console.log('filePluginIsReady: ' + window.isFilePluginReadyRaised()); 

    consol.append(document.createElement("br")); 
    consol.append('filePluginIsReady: ', window.isFilePluginReadyRaised()); 
}, 5000); 

Et je reçois vrai! J'ai essayé de l'abaisser à 1000ms et cela fonctionne toujours, mais sans le temps mort, je deviens faux. J'ajoute le journal de la console à un élément dom pour que je puisse déboguer cela sur mon téléphone, ce qui m'amène au problème: je n'ai rien ...

Je reçois le beau vert "l'appareil est prêt", mais après cinq secondes, ma "console" reste vide. Aucun résultat de window.isFilePluginReadyRaised()

Mon HTML

<div class="app"> 
    <h1>Apache Cordova</h1> 
    <div id="deviceready" class="blink"> 
     <p class="event listening">Connecting to Device</p> 
     <p class="event received">Device is Ready</p> 
    </div> 

    <h3>Console:</h3> 
    <pre id='consol'></pre> 
</div> 

<script type="text/javascript" src="cordova.js"></script> 
<script type="text/javascript" src="dist/build.js"></script> 

JS

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

    onDeviceReady: function() { 
     this.receivedEvent('deviceready'); 

     setTimeout(function(){       
      console.log(cordova.file); 

      console.log('filePluginIsReady: ' + window.isFilePluginReadyRaised()); 

      consol.append(document.createElement("br")); 
      consol.append('filePluginIsReady: ', window.isFilePluginReadyRaised()); 
     }, 5000); 
    }, 

    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(); 

config.xml

<?xml version='1.0' encoding='utf-8'?> 
<widget id="io.cordova.hellocordova" version="1.0.0" xmlns="http://www.w3.org/ns/widgets" xmlns:cdv="http://cordova.apache.org/ns/1.0"> 
    <name>HelloCordova</name> 
    <description> 
     A sample Apache Cordova application that responds to the deviceready event. 
    </description> 
    <author email="dev@cordova.apache.org" href="http://cordova.io"> 
     Apache Cordova Team 
    </author> 
    <content src="index.html" /> 
    <preference name="iosPersistentFileLocation" value="Library" /> 
    <access origin="*" /> 
    <allow-intent href="http://*/*" /> 
    <allow-intent href="https://*/*" /> 
    <allow-intent href="tel:*" /> 
    <allow-intent href="sms:*" /> 
    <allow-intent href="mailto:*" /> 
    <allow-intent href="geo:*" /> 
    <platform name="android"> 
     <allow-intent href="market:*" /> 
    </platform> 
    <platform name="ios"> 
     <allow-intent href="itms:*" /> 
     <allow-intent href="itms-apps:*" /> 
    </platform> 
    <engine name="browser" spec="^4.1.0" /> 
    <plugin name="cordova-plugin-file" spec="^4.3.3" /> 
    <plugin name="cordova-plugin-whitelist" spec="^1.3.2" /> 
</widget> 

Edit: Je découvre ma structure de fichier peut avoir été incorrect. Phonegap spécifie que la config devrait être dans le répertoire www, alors que le mien était de niveau supérieur. Corriger cela n'a pas résolu le problème. J'ai aussi vérifié le Phonegap journaux de construction:

-------------------------------------------------------------------------------- 
PLUGIN OUTPUT 
-------------------------------------------------------------------------------- 
Fetching plugin "cordova-plugin-file@^4.3.3" via npm 
Installing "cordova-plugin-file" at "4.3.3" for ios 
Fetching plugin "cordova-plugin-compat" via npm 
Installing "cordova-plugin-compat" at "1.1.0" for ios 
Fetching plugin "cordova-plugin-whitelist@^1.3.2" via npm 
Installing "cordova-plugin-whitelist" at "1.3.2" for ios 

Answer 1

réponse Mise à jour, après avoir lu la question un peu plus :)

Le lien Plugin File mentionne: « système de fichiers Chrome est pas immédiatement prêt après dispositif événement prêt. » Dans votre exemple de code fourni, vous participez à l'événement "deviceready", mais comme les docs le mentionnent, cela ne fonctionnera pas pour Google Chrome, mais pour iOS (navigateur Safari). Pour modifier ma première réponse un peu:

Essayez de vous enregistrer à la fois la méthode de la balise body HTML « filePluginIsReady » et événement « deviceready » le plus tôt possible, l'attacher à la « onload »:

<body onload="initialize();"> 
     <div class="app"> 
      <!-- all other html --> 
     </div> 
     <script type="text/javascript"> 
       function onFilePluginReady() { 
        // use file plugin 
        console.log("onFPReady: " + cordova.file); 
       } 
       function onDeviceReady() { 
        // use file plugin - iOS or other mobile platforms 
        console.log("onDeviceReady: " + cordova.file); 
       } 
       function initialize() { 
        // special event for Google Chrome (Android) 
        document.addEventListener('filePluginIsReady', onFilePluginReady, false); 
        // event for iOS and others 
        document.addEventListener("deviceready", onDeviceReady, false); 

       } 
     </script> 
    </body>