輸出網頁(GAS)
輸出網頁
HTML Service: Create and Serve HTML | Apps Script | Google for Developers
Add a file→HTML→「Index.html」
code:Code.gs(javascript)
function doGet(e) {
// ...
return HtmlService.createHtmlOutputFromFile('Index');
}
HTML Service: Templated HTML | Apps Script | Google for Developers
傳送資料至網頁
code:Code.gs(javascript)
function doGet() {
var t = HtmlService.createTemplateFromFile('Index');
t.data = SpreadsheetApp
.openById('1234567890abcdefghijklmnopqrstuvwxyz')
.getActiveSheet()
.getDataRange()
.getValues();
return t.evaluate();
}
code:Index.html
<!DOCTYPE html>
<html>
<head>
<base target="_top">
</head>
<body>
<table>
<? for (var i = 0; i < data.length; i++) { ?>
<tr>
<? for (var j = 0; j < datai.length; j++) { ?>
<td><?= dataij ?></td>
<? } ?>
</tr>
<? } ?>
</table>
</body>
</html>
從頁面呼叫GAS函式
https://developers.google.com/apps-script/guides/html/communication
https://developers.google.com/apps-script/guides/html/reference/run
頁面
code:html
<label class="badge badge-primary" for="input-field">Input field:</label>
<input type="text" id="input-field" name="input-field" />
<input type="button" onclick="callFromClient()" value="button" />
...
<script>
function callFromClient() {
// only call function
// google.script.run.test();
// get response from called function
google.script.run.withSuccessHandler(onSuccess).test();
}
function onSuccess(response) {
document.getElementById("input-field").value = response;
}
</script>
GAS
code:javascript
function test() {
return 'response from apps script side';
}
私有函式
名稱以_結尾的函式
無法透過google.script呼叫、無法從前端觀測