google.script.host 類別 (用戶端 API)
透過集合功能整理內容
你可以依據偏好儲存及分類內容。
屬性
屬性 | 說明 |
origin | 提供主機網域,讓指令碼可以設定其
正確來源。 |
內容詳盡的說明文件
close()
關閉目前的對話方塊或側欄。
Code.gs
function onOpen(e) {
SpreadsheetApp.getUi() // Or DocumentApp or FormApp.
.createMenu('Sidebar').addItem('Show', 'showSidebar').addToUi();
}
function showSidebar() {
var html = HtmlService.createHtmlOutputFromFile('Index');
SpreadsheetApp.getUi() // Or DocumentApp or FormApp.
.showSidebar(html);
}
Index.html
<input type="button" value="Close"
onclick="google.script.host.close()" />
editor.focus()
將瀏覽器焦點從對話方塊或側欄切換至 Google 文件、試算表或表單編輯器。
Code.gs
function onOpen(e) {
SpreadsheetApp.getUi() // Or DocumentApp or FormApp.
.createMenu('Sidebar').addItem('Show', 'showSidebar').addToUi();
}
function showSidebar() {
var html = HtmlService.createHtmlOutputFromFile('Index');
SpreadsheetApp.getUi() // Or DocumentApp or FormApp.
.showSidebar(html);
}
Index.html
<input type="button" value="Switch focus"
onclick="google.script.host.editor.focus()" />
setHeight(height)
設定目前對話方塊的高度。
Code.gs
function onOpen(e) {
SpreadsheetApp.getUi() // Or DocumentApp or FormApp.
.createMenu('Dialog').addItem('Show', 'showDialog').addToUi();
}
function showDialog() {
var html = HtmlService.createHtmlOutputFromFile('Index')
.setWidth(300)
.setHeight(200);
SpreadsheetApp.getUi() // Or DocumentApp or FormApp.
.showModalDialog(html, 'Dialog title');
}
Index.html
<script>
function resizeDialog(width, height) {
google.script.host.setWidth(width);
google.script.host.setHeight(height);
}
</script>
<input type="button" value="Resize dialog"
onclick="resizeDialog(450, 300)" />
參數
名稱 | 類型 | 說明 |
height | Integer | 新的高度 (以像素為單位) |
setWidth(width)
設定目前對話方塊的寬度。
Code.gs
function onOpen(e) {
SpreadsheetApp.getUi() // Or DocumentApp or FormApp.
.createMenu('Dialog').addItem('Show', 'showDialog').addToUi();
}
function showDialog() {
var html = HtmlService.createHtmlOutputFromFile('Index')
.setWidth(300)
.setHeight(200);
SpreadsheetApp.getUi() // Or DocumentApp or FormApp.
.showModalDialog(html, 'Dialog title');
}
Index.html
<script>
function resizeDialog(width, height) {
google.script.host.setWidth(width);
google.script.host.setHeight(height);
}
</script>
<input type="button" value="Resize dialog"
onclick="resizeDialog(450, 300)" />
參數
名稱 | 類型 | 說明 |
width | Integer | 新的寬度 (以像素為單位) |
除非另有註明,否則本頁面中的內容是採用創用 CC 姓名標示 4.0 授權,程式碼範例則為阿帕契 2.0 授權。詳情請參閱《Google Developers 網站政策》。Java 是 Oracle 和/或其關聯企業的註冊商標。
上次更新時間:2025-07-26 (世界標準時間)。
[null,null,["上次更新時間:2025-07-26 (世界標準時間)。"],[[["\u003cp\u003e\u003ccode\u003egoogle.script.host\u003c/code\u003e is an asynchronous client-side JavaScript API used to interact with dialogs or sidebars in Google Docs, Sheets, or Forms containing HTML service pages.\u003c/p\u003e\n"],["\u003cp\u003eTo execute server-side functions from client-side code within these dialogs or sidebars, utilize \u003ccode\u003egoogle.script.run\u003c/code\u003e.\u003c/p\u003e\n"],["\u003cp\u003eThe API provides methods like \u003ccode\u003eclose()\u003c/code\u003e, \u003ccode\u003eeditor.focus()\u003c/code\u003e, \u003ccode\u003esetHeight(height)\u003c/code\u003e, and \u003ccode\u003esetWidth(width)\u003c/code\u003e for controlling dialog and sidebar behavior.\u003c/p\u003e\n"],["\u003cp\u003eWhile \u003ccode\u003egoogle.script.host\u003c/code\u003e focuses on client-side interactions within HTML service pages, server-side communication is handled through \u003ccode\u003egoogle.script.run\u003c/code\u003e.\u003c/p\u003e\n"],["\u003cp\u003e\u003ccode\u003egoogle.script.host\u003c/code\u003e enables developers to create dynamic and interactive user interfaces within Google Workspace applications by seamlessly integrating client-side JavaScript with server-side Apps Script functionality.\u003c/p\u003e\n"]]],[],null,["# Class google.script.host (Client-side API)\n\n`google.script.host` is an asynchronous client-side JavaScript API that can interact\nwith dialogs or sidebars in Google Docs, Sheets, or Forms that contain\n[HTML-service pages](/apps-script/guides/html). To execute server-side functions from\nclient-side code, use [`google.script.run`](/apps-script/guides/html/reference/run). For more information, see\nthe\n[guide to communicating with server functions](/apps-script/guides/html/communication)\nin HTML service. \n\n### Properties\n\n| Property | Description |\n|----------|----------------------------------------------------------------------|\n| `origin` | Provides the host domain, so scripts can set their origin correctly. |\n\n### Methods\n\n| Method | Return type | Brief description |\n|------------------------------------------|-------------|------------------------------------------------------------------------------------------------|\n| [close()](#close()) | `void` | Closes the current dialog or sidebar. |\n| [editor.focus()](#editor.focus()) | `void` | Switches browser focus from the dialog or sidebar to the Google Docs, Sheets, or Forms editor. |\n| [setHeight(height)](#setHeight(Integer)) | `void` | Sets the height of the current dialog. |\n| [setWidth(width)](#setWidth(Integer)) | `void` | Sets the width of the current dialog. |\n\nDetailed documentation\n----------------------\n\n### `close()`\n\nCloses the current dialog or sidebar. \n\n### Code.gs\n\n```html\nfunction onOpen(e) {\n SpreadsheetApp.getUi() // Or DocumentApp or FormApp.\n .createMenu('Sidebar').addItem('Show', 'showSidebar').addToUi();\n}\n\nfunction showSidebar() {\n var html = HtmlService.createHtmlOutputFromFile('Index');\n SpreadsheetApp.getUi() // Or DocumentApp or FormApp.\n .showSidebar(html);\n}\n```\n\n### Index.html\n\n```html\n\u003cinput type=\"button\" value=\"Close\"\n onclick=\"google.script.host.close()\" /\u003e\n```\n\n*** ** * ** ***\n\n### `editor.focus()`\n\nSwitches browser focus from the dialog or sidebar to the Google Docs, Sheets, or Forms editor. \n\n### Code.gs\n\n```html\nfunction onOpen(e) {\n SpreadsheetApp.getUi() // Or DocumentApp or FormApp.\n .createMenu('Sidebar').addItem('Show', 'showSidebar').addToUi();\n}\n\nfunction showSidebar() {\n var html = HtmlService.createHtmlOutputFromFile('Index');\n SpreadsheetApp.getUi() // Or DocumentApp or FormApp.\n .showSidebar(html);\n}\n```\n\n### Index.html\n\n```html\n\u003cinput type=\"button\" value=\"Switch focus\"\n onclick=\"google.script.host.editor.focus()\" /\u003e\n```\n\n*** ** * ** ***\n\n### `setHeight(height)`\n\nSets the height of the current dialog. \n\n### Code.gs\n\n```html\nfunction onOpen(e) {\n SpreadsheetApp.getUi() // Or DocumentApp or FormApp.\n .createMenu('Dialog').addItem('Show', 'showDialog').addToUi();\n}\n\nfunction showDialog() {\n var html = HtmlService.createHtmlOutputFromFile('Index')\n .setWidth(300)\n .setHeight(200);\n SpreadsheetApp.getUi() // Or DocumentApp or FormApp.\n .showModalDialog(html, 'Dialog title');\n}\n```\n\n### Index.html\n\n```html\n\u003cscript\u003e\n function resizeDialog(width, height) {\n google.script.host.setWidth(width);\n google.script.host.setHeight(height);\n }\n\u003c/script\u003e\n\u003cinput type=\"button\" value=\"Resize dialog\"\n onclick=\"resizeDialog(450, 300)\" /\u003e\n```\n\n#### Parameters\n\n| Name | Type | Description |\n|----------|-----------|---------------------------|\n| `height` | `Integer` | the new height, in pixels |\n\n*** ** * ** ***\n\n### `setWidth(width)`\n\nSets the width of the current dialog. \n\n### Code.gs\n\n```html\nfunction onOpen(e) {\n SpreadsheetApp.getUi() // Or DocumentApp or FormApp.\n .createMenu('Dialog').addItem('Show', 'showDialog').addToUi();\n}\n\nfunction showDialog() {\n var html = HtmlService.createHtmlOutputFromFile('Index')\n .setWidth(300)\n .setHeight(200);\n SpreadsheetApp.getUi() // Or DocumentApp or FormApp.\n .showModalDialog(html, 'Dialog title');\n}\n```\n\n### Index.html\n\n```html\n\u003cscript\u003e\n function resizeDialog(width, height) {\n google.script.host.setWidth(width);\n google.script.host.setHeight(height);\n }\n\u003c/script\u003e\n\u003cinput type=\"button\" value=\"Resize dialog\"\n onclick=\"resizeDialog(450, 300)\" /\u003e\n```\n\n#### Parameters\n\n| Name | Type | Description |\n|---------|-----------|--------------------------|\n| `width` | `Integer` | the new width, in pixels |"]]