从该库中的 html 调用库函数答案

【问题标题】：Calling library function from html in that library从该库中的 html 调用库函数
【发布时间】：2020-04-03 22:02:43
【问题描述】：

为了与同事分享我正在开发的 AppsScript 代码，我创建了一个独立项目，用作我们的 Docs 模板中的库。

这个库包含：

服务器端代码的 .gs 文件
客户端侧边栏的 .html 文件

在侧边栏中，我有一个按钮，它通过参数触发库中函数的调用。

javascript 调用如下：

        google.script.run
            .withFailureHandler(
              function(msg, element) {
                showError(msg, $('#button-bar'));
              })
            .test();

我在其他页面上读到库代码未公开，因此测试函数实际上在我的文档的 AppsScript 代码中，并调用了等效的库函数。正如这里建议的那样：Can a Google Spreadsheet Apps Script library contain a user dialog?

Docs AppsScript 中的代码：

function test()
{
  myLibrary.test();
}

myLibrary 库中的代码：

function test()
{
  DocumentApp.getUi().alert('test');
}

问题是来自 javascript 的失败处理程序返回一个 ScriptError 说明我需要获得授权才能执行此操作。

对我做错了什么有任何想法吗？

PS：我知道我可以做一个附加组件，但这不是我在公司内部可以轻松做到的：)

【问题讨论】：

标签： google-apps-script web-applications google-docs

【解决方案1】：

是的，当您使用库中的 html 代码（侧边栏）时，它会在绑定到文档的脚本中调用 test() 函数，而不是库中的函数。

您需要向用户请求权限才能提示 UI 元素，您可以使用自定义菜单 [1] 执行此操作。

此外，用户至少需要对库 [2] 具有读取权限。我添加了withSuccessHandler 函数 [3] 以在侧边栏中显示来自客户端的响应。以下代码对我有用：

脚本绑定到文档：

function onOpen() {
  DocumentApp.getUi() // Or DocumentApp or SlidesApp or FormApp.
      .createMenu('Custom Menu')
      .addItem('Show sidebar', 'showSidebar')
      .addToUi();
}

function showSidebar() {
  myLibrary.showSidebarLibrary();
}

//
function test() {
  myLibrary.test();
}

图书馆：

代码.gs

function showSidebarLibrary() {
  var html = HtmlService.createHtmlOutputFromFile('Page')
      .setTitle('My custom sidebar')
      .setWidth(300);
  DocumentApp.getUi() // Or DocumentApp or SlidesApp or FormApp.
      .showSidebar(html);
}

function test() {
  DocumentApp.getUi().alert('test');
  return "Success";
}

页面.html

<!DOCTYPE html>
<html>
  <head>
    <base target="_top">
  </head>
  <body>
    Hello, world!<br>
    <input type="button" value="Alert" onclick="alert()" /><br>
    <input type="button" value="Close" onclick="google.script.host.close()" />
    <p id="msg">Replace message with response<p>
    </body>
    <script>
        function alert() {
            google.script.run.withFailureHandler(handler).withSuccessHandler(handler).test();
        }
        function handler(msg) {
            document.getElementById("msg").innerHTML = msg;
        }
  </script>
</html>

[1]https://developers.google.com/apps-script/guides/menus

[2]https://developers.google.com/apps-script/guides/libraries#gaining_access_to_a_library_and_including_it_in_your_project

[3]https://developers.google.com/apps-script/guides/html/communication#success_handlers

【讨论】：

这正是我所做的，所以我尝试了你的代码，它也是如此。警报不知道，我收到一个 ScriptError，您必须具有执行此操作的权限。我不是在标准的 google 用户帐户上执行此操作，而是在公司帐户上执行此操作，是否有与此相关的一些限制？
他们有权访问库脚本吗？我按照我的解释测试了代码，它成功运行，与我 G Suite 域中的用户共享库。
我是一个测试者，我使用库和文档，所以我可以访问两者。
成功了吗？如果它有帮助，请考虑接受正确的答案。如果您使用与我相同的代码并且在两个脚本中都更新了库版本，它应该可以工作。
以防万一，以下是步骤： 1) 在文档上，单击“显示边栏”菜单，该菜单将请求所需的权限并打开边栏。 2) 在侧边栏上，单击Alert 按钮。 3) 在警报对话框上单击“确定”。 4) 侧边栏
元素中的文本将更改为success。