Verwenden Sie JavaScript- und CSS-Projektdateien in einer Google Apps Script-Webanwendung?

Question

Wenn ich eine einfache HTML-Web-App in Google Apps Script, wie folgt aus:

function doGet() { 
    return HtmlService.createHtmlOutputFromFile("index.html"); 
} 

und index.html sieht wie folgt aus:

<script src="http://code.jquery.com/jquery-1.7.2.min.js"></script> 
<div>Test</div> 

ist es möglich, JS und CSS-Dateien hinzufügen, wie Teil des Projekts und schließen Sie sie mithilfe von Skript- und Link-Tags ein, oder müssen sie an anderer Stelle inline/gehostet werden?

Answer 1

Derzeit ist es nicht möglich, dass Ihr CSS- und JS-Skript Teil Ihres Google Apps Script-Projekts ist. Sie müssen es woanders hosten und die URL in Ihrer Vorlage zeigen.

Answer 2

ist hier eine Abhilfe, die ich nützlich gefunden haben:

1. Fügen Sie diese Funktion, um Ihre Server-Side Javascript:

   function getContent(filename) { 
       return HtmlService.createTemplateFromFile(filename).getRawContent(); 
   } 
   

2. eine zweite 'html' Datei zu Ihrem Projekt hinzufügen, die enthält nur die JS oder CSS umgeben von <script> oder <style> Tags als geeignet.

   <!-- myscript.js.html --> 
   <script> 
       alert("Script included!"); 
   </script> 
   

3. Jetzt können Sie das Skript in Ihrem Haupt-HTML-Template wie folgt umfassen:

   <?!= getContent("myscript.js") ?> 
   

Auf diese Weise können Sie Ihre JS und CSS spaltete sich in so viele Dateien wie Sie wollen und halten Sie sie alle über das Apps Script-Projekt zugänglich.

Answer 3

Google bietet eine ähnliche Lösung here.

Grundsätzlich sie vorschlagen, dass Sie diese Funktion, um Ihre .gs Datei hinzufügen:

function include(filename) { 
    return HtmlService.createHtmlOutputFromFile(filename) 
     .setSandboxMode(HtmlService.SandboxMode.IFRAME) 
     .getContent(); 
} 

und fügen Sie eine oder beide von diesen in Ihre HTML-Datei:

<?!= include('Stylesheet'); ?> 
<?!= include('JavaScript'); ?> 

die Namen in Anführungszeichen von Natürlich verweisen wir auf separate .html-Dateien, die Ihren JS- oder CSS-Code mit <script> oder <style> Tags enthalten.

Answer 4

Sie können eine Datei direkt in ein Scriptlet-Tag rendern.

<?!= HtmlService.createTemplateFromFile("example.js").getRawContent() ?> 

Erstellen Sie die example.js.html Datei in Ihrem Apps Script-Projekt. Beim Rendern im Scriptlet-Tag wird die Erweiterung ".html" nicht erwähnt.