如何从加载项轮询Google文档

对文档和工作表加载项的文档限制是,应用程序脚本无法知道用户在加载项之外做了什么。 这诱人的技巧是:

虽然总会有一些延迟,但是可以从侧栏的客户端代码轮询文件内容的变化。 该技术还可以提醒您的脚本更改用户所选单元格(表格)和光标或select(文档)中的更改。

不幸的是,这并没有显示在任何演示代码中。 我该怎么做?

轮询是通过附加组件的用户界面中的html代码完成的,使用google.script.run调用服务器端的Apps脚本函数。

使用jQuery简化了这一点,我们甚至可以从jQuery的简单轮询示例开始 。

 function doPoll(){ $.post('ajax/test.html', function(data) { alert(data); // process results here setTimeout(doPoll,5000); }); } 

如果我们用等价的GAS代替ajax调用,基本思想可以用于Google Apps脚本。

以下是您将在html文件中使用的轮询函数的框架:

  /** * On document load, assign click handlers to button(s), add * elements that should start hidden (avoids "flashing"), and * start polling for document updates. */ $(function() { // assign click handler(s) // Add elements that should start hidden // Start polling for updates poll(); }); /** * Poll a server-side function 'serverFunction' at the given interval * and update DOM elements with results. * * @param {Number} interval (optional) Time in ms between polls. * Default is 2s (2000ms) */ function poll(interval){ interval = interval || 2000; setTimeout(function(){ google.script.run .withSuccessHandler( function(results) { $('#some-element').updateWith(results); //Setup the next poll recursively poll(interval); }) .withFailureHandler( function(msg, element) { showError(msg, $('#button-bar')); element.disabled = false; }) .serverFunction(); }, interval); }; 

附加示例,文档轮询

这是一个jQuery轮询技术演示,调用服务器端Google Apps脚本函数来检测Google文档中的用户行为。 它没有任何用处,但是它展示了一些通常需要知道用户的活动和文档状态的事情,例如对button的上下文敏感控制。

同样的原则可以适用于电子表格或独立的GAS Web应用程序。

就像这个问题中的UI应用示例一样,这个技术可以用来解决执行时间限制,至less用于用户界面的操作。

截图

该代码基于Google 5分钟快速入门的示例插件。 按照该指南中的说明,使用下面的代码而不是快速入门中的代码。

Code.gs

 /** * Creates a menu entry in the Google Docs UI when the document is opened. * * @param {object} e The event parameter for a simple onOpen trigger. To * determine which authorization mode (ScriptApp.AuthMode) the trigger is * running in, inspect e.authMode. */ function onOpen(e) { DocumentApp.getUi().createAddonMenu() .addItem('Start', 'showSidebar') .addToUi(); } /** * Runs when the add-on is installed. * * @param {object} e The event parameter for a simple onInstall trigger. To * determine which authorization mode (ScriptApp.AuthMode) the trigger is * running in, inspect e.authMode. (In practice, onInstall triggers always * run in AuthMode.FULL, but onOpen triggers may be AuthMode.LIMITED or * AuthMode.NONE.) */ function onInstall(e) { onOpen(e); } /** * Opens a sidebar in the document containing the add-on's user interface. */ function showSidebar() { var ui = HtmlService.createHtmlOutputFromFile('Sidebar') .setTitle('Document Poller'); DocumentApp.getUi().showSidebar(ui); } /** * Check if there is a current text selection. * * @return {boolean} 'true' if any document text is selected */ function checkSelection() { return {isSelection : !!(DocumentApp.getActiveDocument().getSelection()), cursorWord : getCursorWord()}; } /** * Gets the text the user has selected. If there is no selection, * this function displays an error message. * * @return {Array.<string>} The selected text. */ function getSelectedText() { var selection = DocumentApp.getActiveDocument().getSelection(); if (selection) { var text = []; var elements = selection.getSelectedElements(); for (var i = 0; i < elements.length; i++) { if (elements[i].isPartial()) { var element = elements[i].getElement().asText(); var startIndex = elements[i].getStartOffset(); var endIndex = elements[i].getEndOffsetInclusive(); text.push(element.getText().substring(startIndex, endIndex + 1)); } else { var element = elements[i].getElement(); // Only translate elements that can be edited as text; skip images and // other non-text elements. if (element.editAsText) { var elementText = element.asText().getText(); // This check is necessary to exclude images, which return a blank // text element. if (elementText != '') { text.push(elementText); } } } } if (text.length == 0) { throw 'Please select some text.'; } return text; } else { throw 'Please select some text.'; } } /** * Returns the word at the current cursor location in the document. * * @return {string} The word at cursor location. */ function getCursorWord() { var cursor = DocumentApp.getActiveDocument().getCursor(); var word = "<selection>"; if (cursor) { var offset = cursor.getSurroundingTextOffset(); var text = cursor.getSurroundingText().getText(); word = getWordAt(text,offset); if (word == "") word = "<whitespace>"; } return word; } /** * Returns the word at the index 'pos' in 'str'. * From https://stackoverflow.com/questions/5173316/finding-the-word-at-a-position-in-javascript/5174867#5174867 */ function getWordAt(str, pos) { // Perform type conversions. str = String(str); pos = Number(pos) >>> 0; // Search for the word's beginning and end. var left = str.slice(0, pos + 1).search(/\S+$/), right = str.slice(pos).search(/\s/); // The last word in the string is a special case. if (right < 0) { return str.slice(left); } // Return the word, using the located bounds to extract it from the string. return str.slice(left, right + pos); } 

Sidebar.html

 <link rel="stylesheet" href="https://ssl.gstatic.com/docs/script/css/add-ons.css"> <!-- The CSS package above applies Google styling to buttons and other elements. --> <div class="sidebar branding-below"> <form> <div class="block" id="button-bar"> <button class="blue" id="get-selection" disabled="disable">Get selection</button> </div> </form> </div> <div class="sidebar bottom"> <img alt="Add-on logo" class="logo" height="27" id="logo" src="https://www.gravatar.com/avatar/adad1d8ad010a76a83574b1fff4caa46?s=128&d=identicon&r=PG"> <span class="gray branding-text">by Mogsdad, D.Bingham</span> </div> <script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"> </script> <script> /** * On document load, assign click handlers to button(s), add * elements that should start hidden (avoids "flashing"), and * start polling for document selections. */ $(function() { // assign click handler(s) $('#get-selection').click(getSelection); // Add elements that should start hidden var newdiv1 = $( "<div class='block' id='cursor-word'/>" ).hide(), newdiv2 = $( "<div class='block' id='selected-text'/>" ).hide(); $('#button-bar').after( newdiv1, newdiv2 ); $('#cursor-word').html('<H2>Word at cursor:</H2><p id="cursor-word-content"></p>'); $('#selected-text').html('<H2>Selected text:</H2><p id="selected-text-content"></p>'); // Start polling for updates poll(); }); /** * Poll the server-side 'checkSelection' function at the given * interval for document selection, and enable or disable the * '#get-selection' button. * * @param {Number} interval (optional) Time in ms between polls. * Default is 2s (2000ms) */ function poll(interval){ interval = interval || 2000; setTimeout(function(){ google.script.run .withSuccessHandler( function(cursor) { if (cursor.isSelection) { // Text has been selected: enable button, hide cursor word. $('#get-selection').attr('disabled', false); $('#cursor-word').hide(); // $('#selected-text').show(); // Not so fast - wait until button is clicked. } else { $('#get-selection').attr('disabled', true); $('#cursor-word').show(); $('#selected-text').hide(); } $('#cursor-word-content').text(cursor.cursorWord); //Setup the next poll recursively poll(interval); }) .withFailureHandler( function(msg, element) { showError(msg, $('#button-bar')); element.disabled = false; }) .checkSelection(); }, interval); }; /** * Runs a server-side function to retrieve the currently * selected text. */ function getSelection() { this.disabled = true; $('#error').remove(); google.script.run .withSuccessHandler( function(selectedText, element) { // Show selected text $('#selected-text-content').text(selectedText); $('#selected-text').show(); element.disabled = false; }) .withFailureHandler( function(msg, element) { showError(msg, $('#button-bar')); element.disabled = false; }) .withUserObject(this) .getSelectedText(); } /** * Inserts a div that contains an error message after a given element. * * @param msg The error message to display. * @param element The element after which to display the error. */ function showError(msg, element) { var div = $('<div id="error" class="error">' + msg + '</div>'); $(element).after(div); } </script> 

轮询间隔

setTimeout()函数接受以毫秒为单位的时间间隔,但是我通过实验发现,两秒响应是最好的。 因此, poll()的默认间隔是2000ms。 如果您的情况可以容忍轮询周期之间的较长延迟,那么在onLoad调用poll()提供一个更大的值,例如poll(10000) 10秒轮询周期。

床单

有关表单示例,请参阅如何使单元格的单元格显示值?