2010-04-08 4 views
3

J'ai besoin de pouvoir charger et démarrer une application GWT à tout moment dans un environnement Echo2. Ma première approche a consisté à charger et d'exécuter les nocache.js dans une synchronisation client-serveur à l'aideComment intégrer une application GWT dans un autre Web-Framework?

var script = document.createElement("script"); 
script.setAttribute("src",javascriptURI); 
script.setAttribute("type","text/javascript"); 
document.getElementsByTagName('body')[0].appendChild(script); 

Cet appel fonctionne essentiellement, mais lorsque le script est exécuté, il fonctionne sur un document vide au lieu du document actuel de la Echo2 application. Le script doit-il être initialisé en premier ou y a-t-il un événement requis? L'application/script GWT fonctionne correctement s'il est inclus dans le code HTML de démarrage de l'application, donc je suppose que l'application GWT est correcte. Le HTML autonome original de l'application GWT a également la balise de script HTML dans le corps.

+0

En fonction de ce que fait l'application et de la manière dont vous voulez qu'elle interagisse avec votre environnement Echo2, vous pouvez simplement charger l'application GWT dans un iframe. –

Répondre

1

Le problème est que les appels dowcument.write dans le fichier nocache.js ne fonctionnent que si le chargement des documents n'est pas terminé. Sinon, document.write écrase tout le document.

ainsi tous les appels document.write doivent être remplacées par les méthodes createElement des DOM:

Pour le premier code qui ajoute le script avec l'ID marqueur:

var script = document.createElement("script"); 
script.setAttribute("id", markerId); 
$doc_0.getElementsByTagName("body")[0].appendChild(script); 

Pour la deuxième partie (presque à la fin de nocache.js). Remplacer la « app » avec votre nom de l'application:

try { 
    var script = document.createElement("script"); 
    script.setAttribute("defer", "defer"); 
    script.innerHTML = "app.onInjectionDone('app')"; 
    $doc_0.getElementsByTagName("body")[0].appendChild(script); 
} catch (e) { 
    // Fallback if we want to use the original html page without embedding in IE 
    $doc_0.write('<script defer="defer">app.onInjectionDone(\'app\')<\/script>'); 
} 

Ainsi, ce fut la partie qui doit être patché dans le code généré GWT. Maintenant, la page html qui charge et démarre l'application lorsque l'utilisateur clique sur le bouton:

<html> 
    <head> 
    <!-- base url --> 
    <base href="http://localhost:8080/app/" /> 
    <meta http-equiv="content-type" content="text/html; charset=UTF-8"> 
    <link type="text/css" rel="stylesheet" href="static-gwt.css"> 
    <title>APP</title> 
    <script type="text/javascript"> 

    function startApp() { 
     if (document.createElement && document.getElementsByTagName) { 
      var script = document.createElement('script'); 
      script.type = 'text/javascript'; 
      script.src = 'app/app.nocache.js'; 
      var heads =document.getElementsByTagName('body'); 
      if (heads && heads[0]) { 
      heads[0].appendChild(script); 
      triggerAppStart(); 
      } 
     } 
    } 

    function triggerAppStart(){ 
     try{ 
     app.onInjectionDone('app'); 
     if (!document.createEventObject) { 
      var evt = document.createEvent("HTMLEvents"); 
      evt.initEvent("DOMContentLoaded", true, true); 
      document.dispatchEvent(evt); 
      } 
     } catch (e) { 
     window.setTimeout('triggerAppStart()', 100); 
     } 
    } 

</script> 
    </head> 
    <body> 
    <input type="button" onclick="startApp();return false;"> 
    </body> 
</html> 

Je sais que ce n'est pas la meilleure solution, mais il est la seule façon cela a fonctionné jusqu'à présent.

Questions connexes