이 페이지는 Cloud Translation API를 통해 번역되었습니다.

웹 앱

스크립트용 사용자 인터페이스를 빌드하는 경우 이 스크립트를 웹 앱으로 게시할 수 있습니다. 예를 들어 사용자가 지원팀에서 직접 약속을 예약할 수 있는 스크립트는 사용자가 브라우저에서 직접 액세스할 수 있도록 웹 앱으로 표시되는 것이 가장 좋습니다.

독립 실행형 스크립트와 애플리케이션 Google Workspace 바인드에 바인딩된 스크립트는 모두 다음의 요구사항을 충족하는 경우 웹 앱으로 전환할 수 있습니다.

웹 앱 요구사항

다음 요구사항을 충족하는 스크립트는 웹 앱으로 게시할 수 있습니다.

doGet(e) 또는 doPost(e) 함수가 포함되어 있습니다.
이 함수는 HTML 서비스 HtmlOutput 객체 또는 콘텐츠 서비스 TextOutput 객체를 반환합니다.

요청 매개변수

사용자가 앱을 방문하거나 프로그램이 앱에 HTTP GET 요청을 보내면 Apps Script는 doGet(e) 함수를 실행합니다. 프로그램이 앱에 HTTP POST 요청을 보내면 Apps Script는 대신 doPost(e)를 실행합니다. 두 경우 모두 e 인수는 요청 매개변수에 대한 정보를 포함할 수 있는 이벤트 매개변수를 나타냅니다. 이벤트 객체의 구조는 아래 표에 나와 있습니다.

필드
`e.queryString`	URL의 쿼리 문자열 부분 값입니다. 쿼리 문자열이 지정되지 않은 경우 `null`입니다. name=alice&n=1&n=2
`e.parameter`	요청 매개변수에 해당하는 키-값 쌍의 객체입니다. 값이 여러 개인 매개변수에 대해서는 첫 번째 값만 반환됩니다. {"name": "alice", "n": "1"}
`e.parameters`	`e.parameter`와 유사하지만 각 키의 값 배열이 있는 객체 {"name": ["alice"], "n": ["1", "2"]}
`e.pathInfo`	`/exec` 또는 `/dev` 이후의 URL 경로입니다. 예를 들어 URL 경로가 `/exec/hello`로 끝나면 경로 정보는 `hello`입니다.
`e.contextPath`	사용되지 않으며 항상 빈 문자열입니다.
`e.contentLength`	POST 요청의 경우 요청 본문의 길이, GET 요청의 경우 `-1`의 길이 332
`e.postData.length`	`e.contentLength`와 동일 332
`e.postData.type`	POST 본문의 MIME 유형입니다. text/csv
`e.postData.contents`	POST 본문의 콘텐츠 텍스트 Alice,21
`e.postData.name`	항상 "postData" postData

예를 들어 아래와 같이 username 및 age과 같은 매개변수를 URL에 전달할 수 있습니다.

https://script.google.com/.../exec?username=jsmith&age=21

그러면 다음과 같이 매개변수를 표시할 수 있습니다.

function doGet(e) {
  var params = JSON.stringify(e);
  return HtmlService.createHtmlOutput(params);
}

위의 예에서 doGet(e)는 다음과 같은 출력을 반환합니다.

{
  "queryString": "username=jsmith&age=21",
  "parameter": {
    "username": "jsmith",
    "age": "21"
  },
  "contextPath": "",
  "parameters": {
    "username": [
      "jsmith"
    ],
    "age": [
      "21"
    ]
  },
  "contentLength": -1
}

웹 앱으로 스크립트 배포

웹 앱으로 스크립트를 배포하려면 다음 단계를 따르세요.

스크립트 프로젝트의 오른쪽 상단에서 Deploy > New deployment(신규 배포)를 클릭합니다.
'유형 선택' 옆의 배포 유형 사용 설정 > 웹 앱을 클릭합니다.
'배포 구성' 아래의 필드에 웹 앱에 대한 정보를 입력합니다.
배포를 클릭합니다.

사용자에게 액세스 권한을 부여한 경우 앱을 사용하려는 사용자와 웹 앱 URL을 공유할 수 있습니다.

웹 앱 배포 테스트

웹 앱으로 스크립트를 테스트하려면 다음 단계를 따르세요.

스크립트 프로젝트 오른쪽 상단에서 배포 테스트 &gt를 클릭합니다.
'유형 선택' 옆의 배포 유형 사용 설정 > 웹 앱을 클릭합니다.
웹 앱 URL에서 복사를 클릭합니다.
브라우저에 URL을 붙여넣고 웹 앱을 테스트합니다.

이 URL은 /dev으로 끝나며 스크립트에 대한 수정 액세스 권한이 있는 사용자만 액세스할 수 있습니다. 이 앱 인스턴스는 항상 가장 최근에 저장된 코드를 실행하며 개발 중에만 테스트용입니다.

권한

웹 앱의 권한은 앱을 실행하는 방법에 따라 달라집니다.

나를 포함하여 앱 실행: 이 경우 스크립트는 누가 웹 앱에 액세스하는지와 상관없이 항상 스크립트 소유자인 나를 실행합니다.
웹 앱에 액세스하는 사용자로 앱 실행 - 이 경우 스크립트는 웹 앱을 사용하는 활성 사용자의 ID로 실행됩니다. 이 권한을 사용하면 사용자가 액세스를 승인할 때 웹 앱에서 스크립트 소유자의 이메일을 표시합니다.

Google Sites에 웹 앱 삽입하기

기존 Google Sites 버전과 새 버전의 Google Sites 모두에 웹 앱을 삽입할 수도 있습니다.

새 Sites에 웹 앱 삽입하기

웹 앱을 삽입하려면 먼저 배포되어야 합니다. 또한 Deploy 대화상자에서 배포된 URL이 필요합니다.

새 Sites 페이지에 웹 앱을 삽입하려면 다음 단계를 따르세요.

웹 앱을 추가할 사이트 페이지를 엽니다.
삽입 URL 삽입을 선택합니다.
웹 앱 URL을 붙여넣은 다음 추가를 클릭합니다.

웹 앱이 페이지 미리보기의 프레임에 표시됩니다. 페이지를 게시하면 사이트 뷰어가 웹 앱을 정상적으로 실행하기 전에 승인해야 할 수 있습니다. 승인되지 않은 웹 앱은 사용자에게 승인 메시지를 표시합니다.

기존 Sites에 웹 앱 삽입하기

스크립트를 Google 문서 또는 시트에 결합할 수 있는 것과 같은 방식으로 스크립트를 기존 Google 사이트 도구에 바인딩할 수 있습니다. 바인딩된 스크립트를 만들려면 사이트에 방문하여 톱니바퀴 아이콘 을 클릭한 후 사이트 관리를 선택합니다. 사이트 관리 페이지에서 왼쪽 탐색 메뉴에 있는 앱 스크립트를 클릭한 다음 새 스크립트 추가 버튼을 클릭합니다. Apps Script 편집기에서 웹 앱을 코딩하고 배포할 수 있는 새 스크립트가 열립니다.

페이지에 웹 앱을 삽입할 수도 있습니다. 웹 앱을 사이트에 결합하거나 URL이 있는 웹 앱을 사용할 수 있습니다. Google Sites 페이지에 웹 앱을 삽입하려면 다음 단계를 따르세요.

수정 권한이 있는 기존 사이트를 열거나 새 사이트를 만듭니다.
웹 앱을 삽입하려는 사이트의 페이지로 이동합니다.
수정 아이콘을 클릭한 다음 Google Apps Script 삽입을 클릭합니다.
웹 앱을 나타내는 목록에서 스크립트를 선택합니다. 웹 앱이 이 사이트에 결합되지 않은 경우 대신 웹 앱 URL에 붙여넣을 수 있습니다.
선택 버튼을 클릭하고 다음 대화상자에서 원하는 옵션을 선택한 후 저장을 클릭합니다.
페이지에 변경사항을 저장하면 사이트 페이지에 웹 앱이 삽입됩니다.

웹 앱 및 브라우저 기록

Apps Script 웹 앱이 다중 페이지 애플리케이션 또는 URL 매개변수를 통해 제어되는 동적 UI를 사용하는 애플리케이션을 시뮬레이션하도록 하는 것이 바람직할 수 있습니다. 이렇게 하려면 앱의 UI나 페이지를 나타내는 상태 객체를 정의하고 사용자가 앱을 탐색할 때 상태를 브라우저 기록으로 푸시하면 됩니다. 또한 사용자가 브라우저 버튼으로 앞뒤로 이동할 때 웹 앱에서 올바른 UI를 표시하도록 기록 이벤트를 수신할 수도 있습니다. 로드 시 URL 매개변수를 쿼리하면 앱이 이러한 매개변수를 기반으로 UI를 동적으로 빌드하도록 하여 사용자가 특정 상태에서 앱을 시작할 수 있습니다.

Apps Script는 브라우저 기록에 연결된 웹 앱을 만드는 데 도움이 되는 두 가지 비동기 클라이언트 측 자바스크립트 API를 제공합니다.

google.script.history는 브라우저 기록 변경에 대한 동적 응답을 허용하는 메서드를 제공합니다. 예를 들어 브라우저 기록으로 상태 (정의할 수 있는 간단한 객체)를 푸시하고, 기록 스택의 최상위 상태를 교체하고, 기록 변경에 응답하도록 리스너 콜백 함수를 설정합니다.
google.script.url은 현재 페이지의 URL 매개변수와 URL 프래그먼트(있는 경우)를 가져오는 수단을 제공합니다.

이러한 기록 API는 웹 앱에서만 사용할 수 있습니다. 사이드바, 대화상자, 부가기능에는 지원되지 않습니다. 또한 Google Sites에 삽입된 웹 앱에서는 이 기능을 사용하지 않는 것이 좋습니다.