谷歌應用程序：在同一個應用程序項目中的多個HTML或腳本文件？

我是一位相當經驗豐富的網頁開發人員，因此帶Google App腳本的Google Web框架看起來適合我。不幸的是，在我撞牆之前我並沒有走得太遠。這是最大的一個（現在）。谷歌應用程序：在同一個應用程序項目中的多個HTML或腳本文件？

場景：開發一個簡單的應用程序來解決我在處理新語言時總是使用的一些編程問題。把每個問題放在一個單獨的頁面上。將CSS和JavaScript放在單獨的文件中。

這最初工作正常。第一個問題是手段問題的統計意義。我發現他們的初學者模板用於從電子表格中讀取數據，修改模板以顯示數據，然後從那裏開始。 CSS很簡單，幷包含在文件中。它只需要最初的index.html和code.gs.

但是現在，我想修改index.html來添加鏈接以調用其他HTML文件，App項目可以幫助我添加這些文件。我也可以添加更多的.gs文件。太好了，我想。但是我怎麼稱呼他們呢？一個鏈接需要一個URL，但我唯一擁有的是該項目。據我所知，無法引用包含在同一個項目中的文件。我可以在其他庫中調用函數，但不能在另一個頁面上調用函數。 .gs腳本看起來是服務器端代碼。我該怎麼做和訪問客戶端JavaScript文件。還是CSS文件？

我在您的網站上發現了這個，但我不知道如何實際使用它。 Use project Javascript and CSS files in a Google Apps Script web app?。

我已經搜索並搜索了這些問題的答案，並且發現很少有真正的工作項目示例。

感謝任何幫助，您可以給我。

來源

2013-06-02 Mona Everett

有關如何在Google Apps腳本中使用多個HTML頁面的示例，請參閱this answer。

來源

2013-06-02 02:53:04 Mogsdad

我認爲你正在嘗試對我做類似的事情。基本上我需要一個允許你登錄的系統，然後在你登錄後提供額外的數據。所以我開始使用一個基本的表單，然後打開你正在談論的牆，看起來不可能加載HTML頁面。

然後我注意到您可以發回字符串，因此您可以將該字符串放入div（請參閱loadPage()），因此會顯示不同的頁面。下面是一個簡單的例子，包括處理失敗。然後，您可以按照預期繼續書寫頁面。所以你可以將值傳遞給下一個表單，下一個表單產生一個應用程序。

要使用此功能，您可以輸入任何用戶名，並且會失敗，並顯示拋出的錯誤消息。如果您輸入fuzzyjulz作爲用戶名，則會顯示下一頁，其中包含登錄過程中的其他信息。

Code.gs

function doGet() { 
    return HtmlService.createTemplateFromFile('Main') 
    .evaluate() 
    .setSandboxMode(HtmlService.SandboxMode.NATIVE); 
} 

function onLogin(form) { 
    if (form.username == "fuzzyjulz") { 
    var template = HtmlService.createTemplateFromFile('Response'); 

    //Setup any variables that should be used in the page 
    template.firstName = "Fuzzy"; 
    template.username = form.username; 

    return template.evaluate() 
     .setSandboxMode(HtmlService.SandboxMode.NATIVE) 
     .getContent(); 
    } else { 
    throw "You could not be found in the database please try again."; 
    } 
} 

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

main.html中

<?!= include('CSS'); ?> 
<script> 
    function loadPage(htmlOut) { 
    var div = document.getElementById('content'); 
    div.innerHTML = htmlOut; 
    document.getElementById('errors').innerHTML = ""; 
    } 
    function onFailure(error) { 
    var errors = document.getElementById('errors'); 
    errors.innerHTML = error.message; 
    } 
</script> 
<div id="errors"></div> 
<div id="content"> 
    <?!= include('Login'); ?> 
</div>

CSS.html

<style> 
    p b { 
    width: 100px; 
    display: inline-block; 
    } 
</style>

登錄。HTML

<script> 
    function onLoginFailure(error) { 
    var loginBtn = document.getElementById('loginBtn'); 
    loginBtn.disabled = false; 
    loginBtn.value = 'Login'; 
    onFailure(error); 
    } 
</script> 
<div class="loginPanel"> 
    <form> 
    <p> 
     <b>Username: </b> 
     <input type="text" name="username"/> 
    </p> 
    <input type="button" id="loginBtn" value="Login" onclick="this.disabled = true; this.value = 'Loading...';google.script.run 
     .withSuccessHandler(loadPage) 
     .withFailureHandler(onLoginFailure) 
     .onLogin(this.parentNode)"/> 
    </form> 
</div>

Response.html

<div class="text"> 
    Hi <?= firstName ?>,<br/> 
    Thanks for logging in as <?= username ?> 
</div>

來源

2015-05-26 00:38:36 FuzzyJulz

谷歌應用程序：在同一個應用程序項目中的多個HTML或腳本文件？

回答

相關問題