Come integrare un'applicazione GWT in un altro Web-quadro?

StackOverflow https://stackoverflow.com/questions/2599166

  •  25-09-2019
  •  | 
  •  

Domanda

Ho bisogno la possibilità di caricare e avviare un'App GWT in qualsiasi momento, in un ambiente Echo2. Il mio primo approccio è stato quello di caricare ed eseguire le nocache.js in una sincronizzazione client-server utilizzando 

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

Questa chiamata funziona praticamente, ma quando viene eseguito lo script opera su un documento vuoto al posto del documento corrente dell'applicazione Echo2. Ha lo script per essere in qualche modo inizializzato prima o c'è comunque necessario?

L'applicazione / script GWT funziona bene se è inclusa in fase di start-up HTML dell'applicazione, quindi immagino che l'App GWT essere corretta. Il codice HTML standalone originale del GWT App ha il tag script HTML nel corpo come bene.

È stato utile?

Soluzione

Il problema è, che le chiamate dowcument.write nel file nocache.js funziona solo se i documenti non ha carico finito. Altrimenti document.write sovrascriverà l'intero documento.

Perciò le chiamate document.write devono essere sostituiti con i metodi createElement di DOM:

Per il primo codice che aggiunge lo script con il marcatore ID: 

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

Per la seconda parte (quasi alla fine nocache.js). Sostituire la "app" con il vostro nome dell'applicazione: 

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

Quindi, che era la parte che deve essere patchato nel codice GWT generato. Ora la pagina html che carica e avvia l'applicazione quando l'utente fa clic sul pulsante: 

<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>

So che questa non è la soluzione migliore, ma è l'unico modo che ha funzionato fino ad ora.

Autorizzato sotto: CC-BY-SA insieme a attribuzione
Non affiliato a StackOverflow
scroll top