繁体   English   中英

Google Apps Script Webapp 异步加载

[英]Google Apps Script Webapp async loading

我正在使用 Google Apps Script 编写一个网络应用程序。

为了减少加载时间,我让doGet(e)加载一个带有一些 javascript 的小文件来异步加载其他 JS 和 CSS。

加载外部资源当然可以正常工作:

<head>
  <!-- loading external resources works fine of course -->
  <script src="https://cdnjs.cloudflare.c[...]/jquery.min.js"></script>
  <link rel="stylesheet" href="https://cdnjs.clou[...].1/jquery-ui.min.css">
</head>

但据我所知,这不能用我的应用程序脚本项目中的代码来完成,因为我无法提供指向该文件的直接链接。 这就是我添加一点<script>

function loadScript(filePath) {
  google.script.run.withSuccessHandler(function(returnedValueFromGAS) {
    $('body').append(returnedValueFromGAS);
  }).loadScript(filePath);

  loadScript('someScriptFilepath');
  loadScript('someStyleFilepath')
}

通过这种方式,我将<script><style>标签添加到我的 HTML 中。 而且我不希望每个加载的文件都有一个回调,而是在加载我的所有(脚本)文件时有一个回调。

到目前为止,这工作正常,但有一个主要缺点: Window-Load-Event不再有任何用处。

如何像在其他环境中那样在<head>加载 JS 和 CSS 文件,以便load-event仍然对我有用?

而且我不希望每个加载的文件都有一个回调,而是在加载我的所有(脚本)文件时有一个回调。

问题/解决方案:

  • 该脚本正在一个接一个地调用服务器功能,而不是一个接一个(或一个在另一个内部)。 您应该嵌套回调('回调地狱')或使用 promises/async/await。

片段:

/**
 * Create a promise around old callback api
 * @param {String} func The server function to call
 * @param {Object} args The arguments to the server function 
 * @return Promise 
 */
const GSR = (func,...args) => 
  new Promise((resolve,reject)=>
    google.script.run
        .withSuccessHandler(resolve)
        .withFailureHandler(reject)[func](...args)
  );

const bodyAppend = function(returnedValueFromGAS) {
    $('body').append(returnedValueFromGAS);
}

//call GSR and append 
const GSRa = (func, ...args) => 
    GSR(func, ...args)
      .then(bodyAppend)
      .catch(e=>console.error(e.message));

function loadScriptClient() {//modified
  //Can also use async/await here
  Promise.all([GSRa('loadScript','someScriptFilepath'), GSRa('loadScript','someStyleFilepath')])
    .then(/*All Files loaded and appended at this point; Provide a final callback function here*/)
    .catch(e=>console.error(e.message));
}

参考:

暂无
暂无

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM