Problème de l'injection de script externe avec executeScript méthode de Cordoue

Je suis en train d'écrire un mannequin application pour tester la façon dont fonctionne le executeScript() la méthode à l'intérieur de Cordoue est InAppBrowser plugin. En particulier, je suis en train d'injecter un code javascript à l'intérieur d'une webview.

Ici, il y a ma index.html fichier:

<!DOCTYPE html>
<html>
    <head>

        <meta charset="utf-8" />
        <meta name="format-detection" content="telephone=no" />
        <meta name="viewport" content="user-scalable=no, initial-scale=1, maximum-scale=1, minimum-scale=1, width=device-width, height=device-height, target-densitydpi=device-dpi" />
        <link rel="stylesheet" type="text/css" href="css/style.css" />
        <script type="text/javascript" src="phonegap.js"></script>
        <script type="text/javascript" src="js/index.js"></script>
        <title>InAppBrowser Injection Test</title>
    </head>
    <body>
        <div class="app">
            <h1>Testing Injection</h1>
            <div id="deviceready" class="blink">
                <p class="event listening">Starting Mother WebView</p>
                <div class="event received">
                  <p>Device is Ready</p>
                </div>
            </div>
        </div>
        <script type="text/javascript">
            app.initialize();
        </script>
    </body>
</html>

Et la index.js fichier

var app = {

    initialize: function() {
        this.bindEvents();
    },

    bindEvents: function() {
        document.addEventListener('deviceready', this.onDeviceReady, false);
    },

    onDeviceReady: function() {
        app.receivedEvent('deviceready');
        var ref = window.open('http://www.example.net', '_blank', 'location=yes ,toolbar=yes, EnableViewPortScale=yes');
        ref.addEventListener('loadstart', function(event) { alert('start: ' + event.url); });
        ref.addEventListener('loadstop', function() {

        //ref.executeScript({ code: "alert('Injected Code')" });

        ref.executeScript({ file: "externaljavascriptfile.js" });
        showalert();

        });
       ref.addEventListener('loaderror', function(event) { alert('error: ' + event.message); });
       ref.addEventListener('exit', function(event) { alert(event.type); });      
    },


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

et, enfin, le externaljavascriptfile.js

 alert('External Injected Code');

Si j'essaie d'injecter du code javascript directement (c'est à dire de décommenter la ligne "réf.executeScript({ code: "alert('le Code Injecté')" });"), tout fonctionne bien et que l'alerte est déclenchée après le chargement de la page, mais si j'essaie d'injecter du javascript externe (c'est à dire à l'aide de la ligne "réf.executeScript({ fichier: "externaljavascriptfile.js" });", rien ne se passe.

Suis-je raté quelque chose?

stackoverflow.com/questions/5649111/...
Merci pour la réponse, mais aussi vous manquez le point. La discussion lié par vous est propos de l'injection de code javascript à travers une application native, qui est fondamentalement un programme Java. J'ai besoin de faire la même chose, mais à travers Phonegap/cordova.

OriginalL'auteur Antonio Giovanni Schiavone | 2014-04-03

8

Avez-vous installé le inappbrowser plugin?

J'ai ce travail dans android comme suit:

EDIT: mis à Jour pour cordova 7

Créer le projet phonegap
```
> cordova create JsExec

> cd JsExec

> cordova platform add android

> cordova plugin add cordova-plugin-inappbrowser
```
Mise à jour index.js -voici mon onDeviceReady fonction:
```
onDeviceReady: function() {
    this.receivedEvent('deviceready');

    var w = window.open('http://www.example.net','_blank','location=yes');
    w.addEventListener('loadstop', function(event) {
      w.executeScript({file: "https://s3.amazonaws.com/avvi00/externaljavascriptfile.js"});
    });
},
```
Déployer pour mon HTC
```
> cordova run --device
```
fichier de script externe est ici

l'intégralité de la copie de travail de ce projet est ici

ce qui concerne,

Av

vos liens pointent vers des liens morts.. s'il vous plaît mettre à jour.
mise à jour pour cordova 7 avec de nouveaux liens. Merci de me laisser savoir.
np merci vais jeter un oeil.

OriginalL'auteur Avner
10

En fait, je pense que vous connaissez déjà la réponse.

executeScript() méthode run de l'enfant WebView.
```
ref.executeScript({ file: "externaljavascriptfile.js" });
```
Dans votre code, executeScript() méthode est référencé http://www.example.net/externaljavascriptfile.js, pas dans votre fichier de script dans /www/js cordova répertoire. Parce que executeScript() méthode injecte JavaScript dans childview comme vous le savez.

Vous pouvez tester le code ci-dessous. J'ai mis le fichier dans mon site web.
```
//...
onDeviceReady: function() {
  var ref = window.open('http://www.haruair.com/', '_blank', 'location=yes, toolbar=yes, EnableViewPortScale=yes');
  ref.addEventListener('loadstop', function() {
    ref.executeScript({ file: "externaljavascriptfile.js" });
  });
},
//...
```
FYI, si vous avez besoin d'obtenir les données de childview, vous pouvez utiliser le callback.
```
//...
var ref = window.open('http://www.haruair.com/', '_blank', 'location=yes, toolbar=yes, EnableViewPortScale=yes');
ref.addEventListener( "loadstop", function() {
  ref.executeScript(
    { file:'http://haruair.com/externaljavascriptfile.js' },
    function() {
      ref.executeScript(
        { code:'getSomething()' },
        function(values){
          var data = values[0];
          alert(data.name);
        });
    }
  );
});
//...
```
Dans externaljavascriptfile.js:
```
var getSomething = function(){
  //do something and get the result from childview webpage
  return { name : 'foo', age : 12 };
};
```
Bonne réponse, "externaljavascriptfile.js" se réfère à la racine de la childview qui ne peuvent pas accéder à l'app actifs (qui sont sur un autre serveur). Donc, la meilleure estimation, c'est de charger le js contenu dans une variable, et de l'envoyer devant le "code:" de la déclaration.
Pour le bien de la fin : ... getAsset: function(theUrl) { var xmlHttp = new XMLHttpRequest(); xmlHttp.open( "GET", theUrl, false ); xmlHttp.send( null ); return xmlHttp.responseText; } ... feront l'affaire !
Bon appel Edward. Génie solution!
Cette solution ne fonctionne pas lorsque _self option est utilisée.
Comment est-ce lié? Est-il possible de créer un getWindow() fonction qui renvoie la window objet donc on ne peut addEventListener, par exemple?

OriginalL'auteur Edward

Utiliser Ajax pour obtenir JS fichier de données puis à l'injecter à l'aide d'exécuter le script

$.ajax({
    type: "GET",
    url: cordova.file.applicationDirectory + "www/js/externalScript.js",
    dataType: "text",   
    success: function (jsCode) {
        ref.executeScript({code: jsCode}, function () {
            console.log("Code Inserted Succesfully");
        });
    },
    error: function () {
       console.log("Ajax Error");
    }
});

//ref is reference of inappbrowser
//i.e. var ref = window.open();
//url is url of your local javascript file

Avec cette méthode, vous pouvez ajouter un fichier de script qui se trouve dans le local de l'APPLICATION de la sandbox, et non pas autour de l'Internet.

Note, vous devez cordova-plugin-fichier:
cordova plugin ajouter cordova-plugin-fichier

ce doit être la accepté de répondre, parce que vous pouvez ajouter un fichier de script qui est dans le local de l'APPLICATION sandbox, et non pas autour de l'Internet

OriginalL'auteur Aman Uppal

3

externaljavscriptfile.js n'est pas lié à votre fichier html.
Vous avez besoin de l'inclure avec l'
```
<script type="text/javascript" src="path/externaljavascriptfile.js"></script>
```
balise ou de le charger dynamiquement avec:
```
var script = document.createElement('script');
script.async = "async";
script.src = "path/externaljavascriptfile.js";
document.getElementsByTagName("head")[0].appendChild( script );
```
REMARQUE: vous devrez peut-être mettre votre code dans une fonction à exécuter.

Espère que cela fonctionne.

Merci pour la réponse, mais vous manquez le point. Ce dont j'ai besoin est d'être capable d'injecter du javascript dans CHAQUE page je navigateur via une application. Daveloping une application native est très simple (créer une webview navigateur et d'injecter de l' .fichiers js). J'aimerais faire la même chose avec phonegap. Le fichier html est utile juest pour créer une "mère Webview", qui va générer un "Enfant WebView" à travers index.js. L'enfant doit être la navigation sur les pages web, et la mère doivent s'injecter .fichier js dans l'enfant sur tous les pageload. Pour le moment je peut injecter du code javascript (alert('le Code Injecté')), mais de ne pas injecter .js fichiers.
Désolé pour le retard. Je ne sais pas...essayez d'utiliser le chemin d'accès complet à l' .fichier js au lieu de le raccourcir...

OriginalL'auteur IlToro

Vous devez vous connecter pour publier un commentaire.