Calling library function from html in that library

问题

In order to share with my colleagues the AppsScript code I am developing, I created a standalone project used as a library in our Docs template.

This library contains:

a .gs file for the server side code
a .html file for the client side sidebar

In the sidebar, I have a button which triggers a call to a function from the library with a parameter.

The javascript call is the following:

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

I read on other pages that the library code wasn't exposed so the test function is in fact in the AppsScript code of my Docs and calls the equivalent library function. As it was suggested here: Can a Google Spreadsheet Apps Script library contain a user dialog?

Code in the Docs AppsScript:

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

Code in myLibrary library:

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

The problem is that the failure handler from the javascript returns a ScriptError stating that I need to have the authorization to perform this action.

Any ideas of what I am doing wrong?

PS: I know I could make an add-on but this is not something I can easily do inside my company :)

回答1:

Yes, when you use the html code (sidebar) from your library it'll call the test() function inside the script bound to the document rather that the one in the library.

You need to request permission to the user to be able to prompt UI elements, you can do this with a custom menu [1].

Also, the users need to have at least read access on the library [2]. I add the withSuccessHandler function [3] to show the response from client-side in the sidebar. The following code worked for me:

Script bound to the document:

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

Library:

code.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";
}

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

来源：https://stackoverflow.com/questions/59271952/calling-library-function-from-html-in-that-library

标签

google-apps-script

google-docs

google-apps-script-libraries

google-apps-script-html-service