클래스 google.script.host (클라이언트 측 API)

google.script.host는 HTML 서비스 페이지가 포함된 Google Docs, Sheets, Forms의 대화상자 또는 사이드바와 상호작용할 수 있는 비동기 클라이언트 측 JavaScript API입니다. 클라이언트 측 코드에서 서버 측 함수를 실행하려면 google.script.run를 사용하세요. 자세한 내용은 HTML 서비스의 서버 함수와의 통신 가이드를 참고하세요.

속성

속성설명
origin스크립트에서 출처를 올바르게 설정할 수 있도록 호스트 도메인을 제공합니다.

방법

메서드반환 유형간략한 설명
close() void 현재 대화상자 또는 사이드바를 닫습니다.
editor.focus() void 브라우저 포커스를 대화상자 또는 사이드바에서 Google Docs, Sheets 또는 Forms 편집기로 전환합니다.
setHeight(height) void 현재 대화상자의 높이를 설정합니다.
setWidth(width) void 현재 대화상자의 너비를 설정합니다.

자세한 문서

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 Docs, Sheets 또는 Forms 편집기로 전환합니다.

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)" />

매개변수

이름유형설명
heightInteger새 높이(픽셀)

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)" />

매개변수

이름유형설명
widthInteger새 너비(픽셀)