If you build a user interface for a script, you can publish the script as a web app. For example, a script that lets users schedule appointments with members of a support team would best be presented as a web app so that users can access it directly from their browsers.
Both standalone scripts and scripts bound to Google Workspace applications can be turned into web apps, so long as they meet the requirements below.
Requirements for web apps
A script can be published as a web app if it meets these requirements:
- It contains a
doGet(e)
ordoPost(e)
function. - The function returns an HTML service
HtmlOutput
object or a Content serviceTextOutput
object.
Request parameters
When a user visits an app or a program sends the app an HTTP GET
request,
Apps Script runs the function doGet(e)
. When a program sends the app an HTTP
POST
request, Apps Script runs doPost(e)
instead. In both cases, the e
argument represents an event parameter that can contain information about any
request parameters. The structure of the event object is shown in the table
below:
Fields | |
---|---|
e.queryString |
The value of the query string portion of the URL, or name=alice&n=1&n=2 |
e.parameter |
An object of key/value pairs that correspond to the request parameters. Only the first value is returned for parameters that have multiple values. {"name": "alice", "n": "1"} |
e.parameters |
An object similar to {"name": ["alice"], "n": ["1", "2"]} |
e.pathInfo |
The URL path after |
e.contextPath |
Not used, always the empty string. |
e.contentLength |
The length of the request body for POST requests, or 332 |
e.postData.length |
The same as 332 |
e.postData.type |
The MIME type of the POST body text/csv |
e.postData.contents |
The content text of the POST body Alice,21 |
e.postData.name |
Always the value "postData" postData |
For instance, you could pass parameters such as username
and age
to a URL as shown below:
https://script.google.com/.../exec?username=jsmith&age=21
Then, you can display the parameters like so:
function doGet(e) {
var params = JSON.stringify(e);
return ContentService.createTextOutput(params).setMimeType(ContentService.MimeType.JSON);
}
In the above example, doGet(e)
returns the following output:
{
"queryString": "username=jsmith&age=21",
"parameter": {
"username": "jsmith",
"age": "21"
},
"contextPath": "",
"parameters": {
"username": [
"jsmith"
],
"age": [
"21"
]
},
"contentLength": -1
}
Deploy a script as a web app
To deploy a script as a web app, follow these steps:
- At the top right of the script project, click Deploy > New deployment.
- Next to "Select type," click Enable deployment types > Web app.
- Enter the information about your web app in the fields under "Deployment configuration."
- Click Deploy.
You can share the web app URL with those you would like to use your app, provided you have granted them access.
Test a web app deployment
To test your script as a web app, follow the steps below:
- At the top right of the script project, click Deploy > Test deployments.
- Next to "Select type," click Enable deployment types > Web app.
- Under the web app URL, click Copy.
Paste the URL in your browser and test your web app.
This URL ends in
/dev
and can only be accessed by users who have edit access to the script. This instance of the app always runs the most recently saved code and is only intended for testing during development.
Permissions
The permissions for a web app differ depending how you choose to execute the app:
- Execute the app as me—In this case, the script always executes as you, the owner of the script, no matter who accesses the web app.
- Execute the app as user accessing the web app—In this case, the script runs under the identity of the active user using the web app. This permission approach causes the web app to show the email of the script owner when the user authorizes access.
Embed your web app in Google Sites
In order to embed a web app in Google Sites, it must first be
deployed. You also
need the Deployed URL from the Deploy
dialog.
To embed a web app into a Sites page, follow these steps:
- Open the Sites page where you'd like to add the web app.
- Select Insert > Embed URL.
- Paste in the web app URL and then click ADD.
The web app appears in a frame in the page's preview. When you publish the page, your site viewers may need to authorize the web app before it executes normally. Unauthorized web apps present authorization prompts to the user.
Web Apps and Browser History
It can be desirable to have an Apps Script web app simulate a multi-page application, or one with a dynamic UI controlled via URL parameters. In order to do this well, you can define a state object to represent the app's UI or page, and push the state into the browser history as the user navigates your app. You can also listen to history events so that your web app displays the correct UI when the user navigates back and forth with the browser buttons. By querying the URL parameters at load time, you can have your app dynamically build its UI based on those parameters, allowing the user to start the app in a particular state.
Apps Script provides two asynchronous client-side JavaScript APIs to assist with creating web apps that are linked to the browser history:
google.script.history
provides methods to allow dynamic response to browser history changes. This includes: pushing states (simple Objects you can define) onto the browser history, replacing the top state in the history stack, and setting a listener callback function to respond to history changes.google.script.url
provides the means to retrieve the current page's URL parameters and URL fragment, if they are present.
These history APIs are only available to web apps. They are not supported for sidebars, dialogs or add-ons. This functionality is also not recommended for use in web apps embedded in a Google Sites.