ไฟล์น .gs
function doGet() {
return HtmlService.createHtmlOutputFromFile('Index') ;
}
function getEmail() {
return Session.getActiveUser().getEmail() ;
}
ผล – แรกเริทม่ีร บนปุถ่มป ปรากฎขอช้ ความ "Not Clicked" แตเ่ค มี่อทคื คลกิร ป่มปุถ แล้ชวตะปรากฎขอช้ ความ "Clicked by
(email ของยมสู เซอร์น)"
บททีมท่ 7 : รนสั สครดปิ ต์ฝต ฝั่ฟง Server-side 51
52 Google Apps Script : Deploy as web app โดย วสสันต์ต คณุค ดดิลกเศวต ([email protected])
บททีท่ 8
ใชช้งาน Web App
ใน iFrame
8.1. จบข ใสส่ iframe
อกท วธริ ทในการนทา Web app ไปใชงช้ านกคจ็ คือ ฝฝงั ลงิร ค์ขล องโปรเจค็จ ไวช้ใน iframe ดวช้ ยวธิร ทนท้ั จะทาท ให้ชเราสามารถ
นทาโปรเจ็คจ ไปใชชใ้ นเว็บจ ใดกไจ็ ด้ช ใชช้ในเว็จบ Google Sites ทท่ีท าท เองกจไ็ ดช้
8.1.ก.) ฝงัฟ iframe ทหท่ีถ นขา้ เวบ็ก
ใหเช้ รา สร้ขางเวก็บอีกถ 1 หน้ขา สาท หรบัต ใชช้ฝฝงั โปรเจ็จค Apps Script ไวใช้ น iframe ตวัต อย่คางโคด้ช มทดังต ตอค่ ไปนัท้ นทา
ลมงค์สพ ทาหรบร ใชร้งาน Web App ใสลส่ งในแทก็จ iframe
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Document</title>
</head>
<body>
<!-- ลงดิ คใ์ต ช้หงนนโปรเจจ็ค -->
<iframe src="https://script.google.com/macros/s/…./exec"
frameborder="0" width="100%" height="500px"></iframe>
</body>
</html>
แต่กค อ่ค นจะใชช้งานหน้ชาเวจบ็ ขาช้ งต้ชน ใหแ้ช ก้ชโปรเจจ็ค Apps Script กอค่ น เพีทอ่ืค เอากรอบดา้ช นบนในหน้าช Web
App ทีทม่ ทขช้อความจาก Google ออก (ตวัต อยาค่ งตามภาพ) และอนญถุ าตใหช้นาท ไปใช้ชใน iframe
ใหเ้ช ราแกชโ้ ปรเจคจ็ Apps Script ดังต ตคอ่ ไปน้ทั
8.1.ข.) แกไ้ข ขโคด้ข ในไฟล์น .gs ของโปรเจ็คก
การจัตบ Web App ใสค่ iFrame จะใช้ช Deploy as web app ในโหมด dev ไมค่ไดช้ ถา้ช ใชช้จะขทั้ึนวค่า
script.google.com refused to connect ตร้องใชร้โหมด exec เท่สานั้รน
นอกจากนทั้ เมืคี่อท ใชโช้ หมด exec แล้วช ตอ้ช งใช้เช มถอด setXFrameOptionsMode() กตับหนา้ช เวจ็บทที่ส่คงกลบตั จาก
doGet() ดว้ช ย เพคือีท่ อนุถญาตใหช้นทาไปใชใ้ช น iFrame
54 Google Apps Script : Deploy as web app โดย วสสนั ตต์ คณคุ ดลดิ กเศวต ([email protected])
ตวตั อยา่ค ง
ไฟลน์ .gs - ของโปรเจ็จค Apps Script
function doGet() {
return HtmlService.createTemplateFromFile('Test')
.evaluate()
// .setSandboxMode(HtmlService.SandboxMode.IFRAME)
.setXFrameOptionsMode(HtmlService.XFrameOptionsMode.ALLOWALL) ;
}
หมายเหตตุ :
การใช้หช รือค ไมใค่ ช้ช .setSandboxMode(HtmlService.SandboxMode.IFRAME) ไมค่มผท ลกัตบการนาท ไปใชช้ใน
iFrame
ไฟลน์ Test.html - ของโปรเจค็จ Apps Script
<div>
<p><b>Username: </b><input type="text" name="username"/></p>
<p><b>Password: </b><input type="text" name="pssword"/></p>
<input type="button" id="loginBtn" value="Login"
onclick="this.value = 'Loading...';onLoginJS(this.parentNode)"/>
</div>
เมคืที่อ Deploy as web app จะไดหช้ นา้ช เว็จบตามภาพ
เมือีคท่ โคด้ช ตาค่ งๆของโปรเจ็คจ App Script เสร็จจ แลช้ว จากนตนั้ท เราสามารถนทาไปใช้ใช นเวบ็จ อีืทคน่ ไดโช้ ดยใชช้ iFrame
ดตังนทั้
ไฟล์น CallPoint.Html – ใชช้ Web App โดยการใชช้ iFrame
<html>
<body>
<p>iFrame - exec</p>
<iframe src= "https://script.google.com/macros/s/(Project_Deployment_URL)/exec"
frameborder="1" width="50%" height="120px"></iframe>
<p>iFrame - dev</p>
<iframe src= "https://script.google.com/macros/s/(Project_Deployment_URL)/dev"
frameborder="1" width="50%" height="120px"></iframe>
</body>
</html>
บททีท่ม 8 : ใช้งห นน Web App ใน iFrame 55
ผล – สงัต เกตวุถ ่าค โหมด exec ททางานไดช้ แต่ค dev ไม่ทค ทางาน
8.1.ค.) แกข้ไขโคดข้ ในไฟล์น .html ของโปรเจก็ค
ตอค่ จากข้ชอกค่อนหนา้ช เราสามารถนโปรเจจ็คไปใช้ใช น iframe ไดแ้ช ลช้ส
แตค่วา่ค … เมที่คือเราคลิรกปถปุม่ ใดๆ ในหนช้า Web App เพคีอท่ื จะประมวลผลใดๆ Browser มกตั จะโหลดลงริ คล์ของ
Web App มาใชช้ สรุปถ กจค็ คอื ไมไ่ค ดใช้ ช้ช iframe อทกแลชว้
ททตัง้ นั้ท เปป็นทที่การตัทตง้ คาค่ ทีท่ไฟลล์ Html ของโปรเจ็คจ Apps Script
วธิร ทแก้ช ไฟลน์ Test.html (ของโปรเจค็จ Apps Script) แท็จก <base> ใหแ้ช ก้ชเปน็ป <base target="_self">
ดงัต นั้ท ซท่ึีงปกติรใชช้เปน็ป _top
ไฟลน์ Test.html (ของโปรเจค็จ Apps Script)
<html>
<head>
<base target="_self">
<meta name="viewport" content="width=device-width, initial-scale=1.0"/>
</head>
<body>
….
56 Google Apps Script : Deploy as web app โดย วสนัส ต์ต คณคุ ดิดลกเศวต ([email protected])
8.1.ง.) setXFrameOptionsMode()
setXFrameOptionsMode(mode) – เมถอดในคลนส HtmlOutput
https://developers.google.com/apps-script/reference/html/html-output#setXFrameOptionsMode(XFrameOptionsMode)
เมถอด setXFrameOptionsMode() ใชเช้ ซตจ็ สถานะของ X-Frame-Options header ของหน้ชาเวจ็บ ซ่ทึีงใช้ช
ป้อป งกตัน clickjacking
พารามิเร ตอรล์ mode กคจ็ ืคอ Enum setXFrameOptionsMode (ดตูม ารางดาช้ นลคา่ ง)
การตตงท้ั เปปน็ XFrameOptionsMode.ALLOWALL เปป็นการอนุญถ าตใหช้นทาหน้ชาเว็จบไปใชใ้ช น iframe ซึี่งท ผ้ชมู
พัตฒนาจะต้ชองไปเขทยนป้อป งกันต clickjacking เอาเอง
ถา้ช เราไม่ใค ชชเ้ มถอด setXFrameOptionsMode() กบตั หนา้ช เวจ็บของเรา Apps Script จะเซจต็ เปป็นคคา่ ปรยริ าย
ใหช้กจ็คคอื XFrameOptionsMode.DEFAULT ซ่งึีท จะไมค่สามารถนทาไปใช้ชใน iframe ได้ช
ตวตั อยา่ค ง
function doGet(){
var tmp = HtmlService.createTemplateFromFile('index') ;
return tmp.evaluate()
.setXFrameOptionsMode(HtmlService.XFrameOptionsMode.ALLOWALL) ;
}
Enum XFrameOptionsMode
https://developers.google.com/apps-script/reference/html/x-frame-options-mode
เขช้าถงึท โดย HtmlOutput.setXFrameOptionsMode(mode).
Property Type Description
ALLOWALL Enum
No X-Frame-Options header will be set. This will let any site iframe the page, so
DEFAULT Enum the developer should implement their own protection against clickjacking.
Sets the default value for the X-Frame-Options header, which preserves normal
security assumptions. If a script does not set an X-Frame-Options mode, Apps
Script uses this mode as the default.
8.1.จ.) setSandboxMode(mode)
setSandboxMode(mode)
https://developers.google.com/apps-script/reference/html/html-output#setsandboxmodemode
Enum SandboxMode – ตอนนใัมี้ท ชห้ไดเห้ ฉพนะ IFRAME
https://developers.google.com/apps-script/reference/html/sandbox-mode
เพือคที่ ปปอ้ งกยัต ยสูม เซอร์ลจาก HTML หรือค Javascript ทที่ปองรช้าย Apps Script ใช้ช iFrames ทาท Sandbox
function doGet() {
var template = HtmlService.createTemplateFromFile('top');
return template.evaluate().setSandboxMode(HtmlService.SandboxMode.IFRAME);
}
บทท่ีมท 8 : ใช้หงนน Web App ใน iFrame 57
ไฟลน์ .html
<!DOCTYPE html>
<html>
<body>
<div>
<a href="http://google.com" target="_top">Click Me!</a>
</div>
</body>
</html>
เปลีทย่ นอแอธทริรบริวต์ล target ในแทจ็ก base จาก _top เปป็น _blank ก็จได้ช
<head>
<base target="_top">
</head>
8.2. จบข ลธงิ คข์ร องโปรเจจค็ โดยใช้รสครธิปต์ร
เซอร์วน ตสิ Script
https://developers.google.com/apps-script/reference/script
เป็นป บริกร ารท่ใีท ช้เช ขาช้ ถงึท Trigger และ การเผยแพร่คสครรปิ ต์ล
คลาส ScriptApp – ส่ตวนหน่งทีึ ของเซอรว์ต สิด Script
https://developers.google.com/apps-script/reference/script/script-app
ใช้ชเข้ชาถทึงและจตัดการการเผยแพร่ค Script และ Triggers อนถุญาตให้ชยมูสเซอรล์สร้ชาง Triggers และ ควบคุถม
การเผยแพร่สค ครริปต์ลในแบบการใหชบ้ รกิร าร (Script as a service)
getService() – เมถอดในคลนส ScriptApp
https://developers.google.com/apps-script/reference/script/script-app#getservice
จบัต วตัตถถุ(คนคื ค่คาเป็ปนคลาส Service) ทที่ถมูกใช้เช ปปน็ ตัวต ควบคถุมการเผยแพรค่สคริปร ตล์แบบ Web App
คลาส Service
https://developers.google.com/apps-script/reference/script/service
ใช้ชเขชา้ ถทึงและจัดต การการเผยแพรค่สคริรปตล์
getURL() – เมถอดในคลนส Service
https://developers.google.com/apps-script/reference/script/service#geturl
คนืค ค่คาเปป็น String ทเีท่ ปน็ป URL ของ Web App ถ้ชาเปฟิดใชง้ช านอยคู่ม(Deployed) แตคถ่ ช้าไมค่ไดชเ้ ปฟิดใชงช้ านจะคคืน
คา่ค เปนป็ null
เราสามารถจับต ลงริ ค์ลของโปรเจจค็ ไดช้โดยใช้ชโคดช้ ดตังต่คอไปนท้ั
function myFunction() {
var projectURL = ScriptApp.getService().getURL() ;
Logger.log(projectURL) ; // ดผูด ลทที่ม Logs ------------------------------- >
}
58 Google Apps Script : Deploy as web app โดย วสสันตต์ คณคุ ดลดิ กเศวต ([email protected])
ผล
Logs
[] https://script.google.com/macros/s/ABCDEFGHIJKLMNOPQRSTUVWXYZ/exec
บททมีท่ 8 : ใช้หงนน Web App ใน iFrame 59
60 Google Apps Script : Deploy as web app โดย วสสันต์ต คณุค ดดิลกเศวต ([email protected])
บททท่ี 9
Web App
แบบหลายหน้าช
9.1. เปลยที่ นหนร้าโดยเขยท นโคร้ดเพอ่ีพท แทรกโค้รด HTML
(ประยคุกตต์มนจนก) More than one HTML or script file in the the same App Project and add Login?
https://stackoverflow.com/questions/31638429/google-app-more-than-one-html-or-script-file-in-the-the-same-app-project-and-a
เทคนคริ การเปลที่ยนหน้าช Web App ในข้อช นทั้ ใชวช้ ริธทเขทยนโค้ดช Javascript เพืีอทค่ สราช้ งโคด้ช HTML จากไฟล์หล รคือ
จาก HTML String จากนตทัน้ ก็จเขทยนลงไปในอริเล็จมเมน้ช ต์ล HTML ทท่ีเตรทยมไวสช้ าท หรตบั แสดงผลลพตั ธล์
ตวตั อยคา่ งทท่ียกมานทั้ ภาพรวมของโปรเจค็จ เรรมิท่ี ดช้วยการสรา้ช งหนชา้ Login(ตามภาพ) และเมอ่ีคืท Login สทาเร็จจ
จะมทหนช้าขชอ้ มลูม ของยูสม เซอรปล์ รากฎ แตถ่ค ช้า Login ไมส่ค าท เร็จจ จะปรากฎขช้อความแจงช้ ความผิดร พลาด ซ่ทึีงจากนันตท้
สามารถ Login ใหมไ่ค ดเช้ ลย
9.1.ก.) โคดข้ ของโปรเจค็ก
ไฟลน์ Code.gs
function doGet() {
return HtmlService.createTemplateFromFile('Index')
.evaluate()
.setXFrameOptionsMode(HtmlService.XFrameOptionsMode.ALLOWALL) ;
}
function onLogin(form) { // (1.) < --------- รสันเมอชท่ี คลิกด ปคุ่มป Login
Logger.log(form) ; // { userid=12345 } <-- ส่ดงิที ทม่ีทสง่ต มนจนกกนรคลิดกปคุ่ปม
if (form.userid == "12345") { // ถ้นห Login ถกูด ตอ้ห ง
var template = HtmlService.createTemplateFromFile('Response') ;
template.userid = "รหัสต ผขมใู้ ชข้งาน : " + form.userid ;
template.username = "ชคือ่ีท ผใ้มขู ช้ขงาน(User name) : wasankds" ;
template.firstname = "ชอีทืค่ : วสนตั ต์น " ;
template.lastname = "นามสกลป : คณป ดติลกเศวต" ;
return template.evaluate().getContent() ; // คชนกลสับไปเปน็ป โคดห้ Html ------ > (2.1)
}
else // ถน้ห Login ผดดิ พลนด
{ // คนช คน่ต เป็ปน Error ททเีม่ รนกนน หนดรนยละเอยีม ดเองได้ห
throw " : ไมมร่ ขีถ อ้ข มมลู ในฐานข้อข มมูล โปรดลองใหม่รอถีกครั้งตน " ; // คนช กลับส ไปเปน็ป Error --- > (2.2)
}
}
62 Google Apps Script : Deploy as web app โดย วสสันตต์ คณคุ ดิลด กเศวต ([email protected])
ไฟลน์ Index.html – โหลดเป็นป หนน้ห แรกเม่ีชอท Web App ถดกู เรยมี กใช้ห
<head>
<base target = "_self">
<style> p b {width: 100px ; display: inline-block ;} </style>
</head>
<body>
<!-- ----------------------- ใชส้ห นนหรบัส แสดง Error --------------------------- -->
<div id="errors" style="color:red ;"></div><p></p>
<!-- ----------------------- ใชส้ห นน หรบัส แสดง Error --------------------------- -->
<!-- ----------------------- สต่วนทป่ีมท รนกฎ --------------------------- -->
<div style="color:blue;">กรอกชีอืทค่ รหสัต ยูสม เซอรน์(12345) จากนต้นัน คลกิต ปุมป่ "Login" (หข้ามกด Enter)</div>
<div id="content"> <!-- สนนหรสับแสดงผลลัสพธ์ต จนก Response.html -->
<form> <!-- parentNode ของปปุ่มค Login ก็จคอช กห้อน Form -->
<p><b>User id: </b><input type="text" name="userid"/></p>
<input type="button" id="loginBtn" value="Login"
onclick="this.value = 'Loading...';onLoginJS(this.parentNode)"/>
</form> <!-- parentNode ของปุมคป่ Login ก็จคอช กหอ้ น Form -->
</div> <!-- สนนหรัสบแสดงผลลพัส ธ์ต จนก Response.html -->
<!-- ----------------------- สต่วนทปมีท่ รนกฎ --------------------------- -->
<script>
// รสันเมอทชี่ คลดกิ ปม่คปุ Login – รบัส พนรนมดิเตอรตเ์ ปปน็ กอห้ น <form> มน แลหว้ ส่ตงตอ่ต ไปให้ฝห ัฝง่ฟ Server ประมวลผลตต่อ
function onLoginJS(parentnode) {
document.getElementById('loginBtn').disabled = true ; // Disable ปมุ่ปค
google.script.run.withSuccessHandler(loadPage) // ------ > (2.1)
.withFailureHandler(onLoginFailure) // ------ > (2.2)
.onLogin(parentnode) ; // ------ > (1)
}
function loadPage(htmlOut) { // (2.1) < ---------
console.log('loadPage ran!') ;
console.log('htmlOut: ' + htmlOut) ;
var div = document.getElementById('content') ; // จบัส ไปทีม่ท <div id="content">
div.innerHTML = htmlOut ; // เขยมี นเนอ้ัทช หนทมีม่ท นจนกไฟลต์ Response.html
document.getElementById('errors').innerHTML = "" ; // ลห้นง <div id="error">
}
// Error ทมีทม่ นจนกโคดห้ ในฝัฝ่งฟ Server เชน่ต ReferenceError: dd is not defined
//
function onLoginFailure(error) { // (2.2) < ---------
var loginBtn = document.getElementById('loginBtn') ;
// เซต็จ ปุ่มคป Login - หลสังรนัส สครปดิ ตแต์ ลห้ว
loginBtn.disabled = false ;
loginBtn.value = 'Login' ;
var errors = document.getElementById('errors') ;
errors.innerHTML = 'ผดติ ผลาด => ' + error.message ;
}
</script>
</body>
บทท่ทมี 9 : Web App แบบหลนยหน้นห 63
ไฟลน์ Response.html – โหลดเมชที่อยูดสเซอร์ต Login ผน่ต น
<div style="width:100%; height:200px; border:1px solid red;">
<p></p>
<p><em>Response form Response.html</em></p>
<p><?= userid ?><br>
<?= username ?><br>
<?= firstname ?><br>
<?= lastname ?></p>
</div>
9.1.ข.) ไฟลท์น ่ีทเถ รีถยกใช้ข Web App ไปใชข้แบบ iFrame
ไฟล์น Test.html เปปน็ หนาช้ เวจบ็ ที่นท ทา Web App ไปใช้แช บบ iFrame
<!DOCTYPE html>
<html>
<head>
<base target = "_top">
</head>
<body>
<iframe src="https://script.google.com/macros/s/(Project_Deployment_URL)/exec"
frameborder="0" width="100%" height="1000px"></iframe>
</html>
9.1.ค.) ผล
เมคือ่ีท เปฟิดไฟลล์ Test.html จะไดช้ผลลตัพธลต์ ามภาพ
เม่อีทคื ยสูม เซอร์กล รอกรหัสต ผดิร ปรากฎขอ้ช ความสแท ดงเตือค น แตค่ยัตงสามารถกรอก User Id เพี่ืทอค Login ไดช้เลย
64 Google Apps Script : Deploy as web app โดย วสัสนต์ต คณุค ดดลิ กเศวต ([email protected])
ปถุป่มมทการตอบสนองเมี่ทคือคลิกร โดยเมีทคื่อคลริกปปุมถ่ Login จะเปลทยี่ นจาก Login เปน็ป Loading และเม่ีทืคอ
ประมวลผลเสรจจ็ จะกลตับมาเปน็ป Login อทกครงทต้ั
→→
เมคือ่ีท กรอกรหัตสถมูก หนาช้ เวจ็บจะเปล่ีทยนเป็ปนตามภาพ
9.2. เปลย่ีท นหน้ราเวจ็บโดยสง่ส พารามเิธ ตอรเ์ร พ่ทีพอเปลทีย่ นหนาร้
เทคนิรคการเปลที่ยนหน้ชา Web App ในขช้อน้ัท ใช้ชวริธทส่คงพารามเตอร์ลตค่อทช้าย URL เพืคที่อเลคือกหน้ชาทท่ีตช้องการดมู
หรือค ใชส้ช รา้ช งปุถปม่ เพ่ีทคือเลอืค กหน้าช ทท่ีจะลิรงคลไ์ ปหา
9.2.ก.) โคด้ข ทต้นังหมดของโปรเจ็กค Apps Script
ไฟลน์ Code.gs
function doGet(e) {
Logger.log(e) ; // {queryString=v=form, parameter={v=form}, contextPath=,
parameters={v=[form]}, contentLength=-1.0}
if(e.parameters.v=='form')
{ // ถ้หนพนรนมเตอร์ตเป็ปน
return loadForm() ; // http://(Project_Deployment_URL)?v=form
}
else // อนทีช่ ๆ เข้หนหนหน้ Home
{
return HtmlService.createTemplateFromFile("Home")
.evaluate()
.setXFrameOptionsMode(HtmlService.XFrameOptionsMode.ALLOWALL) ;
}
}
บททมที่ 9 : Web App แบบหลนยหนนห้ 65
function loadForm() {
var options = '<option value="1">ตวตั เลือค ก 1</option>' +
'<option value="2">ตัตวเลอืค ก 2</option>' +
'<option value="3">ตวตั เลคอื ก 3</option>' ;
var tmp = HtmlService.createTemplateFromFile("Form") ;
tmp.choices = options ;
return tmp.evaluate()
// .setSandboxMode(HtmlService.SandboxMode.IFRAME)
.setXFrameOptionsMode(HtmlService.XFrameOptionsMode.ALLOWALL) ;
}
ไฟล์น Home.html
<!DOCTYPE html>
<html>
<head>
<base target="_self">
</head>
<body>
<div>
<h1>Welcome !</h1>
<a href="<?= ScriptApp.getService().getURL();?>?v=form">
<button id="btn">Form</button>
</a>
</div>
</body>
</html>
ไฟลน์ Form.html
<!DOCTYPE html>
<html>
<head>
<base target="_self"> <!-- เปปิดลิดงค์ใต นกรอบ iFrame จึงท ไมมต่ มีขอ้ห ควนมจนก Google -->
</head>
<body>
<h1>Form</h1>
<p>กรณป าเลอคื ก</p>
<select>
<?!= choices ?>
</select>
</body>
</html>
66 Google Apps Script : Deploy as web app โดย วสนัส ต์ต คณุค ดลิด กเศวต ([email protected])
9.2.ข.) ไฟลท์น ี่ทถเรียถ กใช้ข Web App ไปใชข้แบบ iFrame
ไฟลน์ Test.html เปปน็ หน้ชาเวจ็บนทน่ีท าท Web App ไปใชแ้ช บบ iFrame
<!DOCTYPE html>
<html>
<head>
</head>
<body>
<iframe src="https://script.google.com/macros/s/(Project_Deployment_URL)/exec"
frameborder="0" width="100%" height="1000px"></iframe>
</body>
</html>
9.2.ค.) ผล
เมือ่ีทค เปฟิดไฟล์ล Test.html จะไดหช้ น้าช เวจ็บตามภาพ ซงึท่ี เป็นป หนาช้ ที่ทมาจากไฟล์ล Home.html ของโปรเจ็คจ
Apps Script
จากนัต้นท เม่ีทือค คลรกิ ทท่ีปุปม่ Form หนช้าเว็จบจะเปลทย่ี นไปเปน็ป ตามภาพ ซงีท่ึ มาจากไฟล์ล Form.html ของโปรเจ็จค
Apps Script
9.2.ง.) ขขอ้ จาท กดัต
การใชชง้ าน Web App ใน iFrame มขท ช้อจาท กดัต ทก่ที าร Redirect เชน่ค
จากหนาช้ เรี่มิทร ตชน้ Home เราคลิกร ปุปถ่ม Form เพืทอค่ี เปลยที่ นมาหน้ชา Form สามารถททาไดปช้ กตริอยาค่ งททอี่ ธิรบายไป
ในขชอ้ ก่คอนหนชา้
บททท่มี 9 : Web App แบบหลนยหน้หน 67
แตค่ … ทที่หนช้า Form ไมวค่ ค่าจะเปล่ทียนโค้ชดยตังไง เพทืีค่อใหช้ Redirect ยช้อนไปหน้ชา Home ไม่คสามารถททาได้ชเลย
เชนค่ เพ่ทิมรี บรรทัตดตอค่ ไปนลท้ั งไปในไฟลล์ Form.html
<a href="<?= ScriptApp.getService().getURL();?>">กลบตั ส่หูรม น้ขา Home</a>
การทาท ลริงค์ลเพทีอืค่ Redirect กลบัต ไปหนช้า Home ขา้ช งต้นช ทาท ไดช้เฉพาะการใชชง้ าน Web App โดยใช้ลช งิร คต์ล รง
ท่ทไี ดช้จากการ Deployment as web app เท่าค นัน้ตท
วมธทแกร้(ขดร ) 1 : โหลดเอกสาร HTML ใหมสท่ ้ัรงหมด
ไฟล์น Test.html ทเท่ี รยท กใช้ช Web App ใน iFrame เพทีม่ริ ป่มุถป โหลดหน้ชาเวจ็บลงไป
<!DOCTYPE html>
<html>
<head>
</head>
<body>
<!-- เพ่ีมดิท ปคุป่ม Reload หนนห้ เวจบ็ ลงไป -->
<button id="reload" onclick="document.location.reload();">Reload</button>
<br><hr>
<iframe src="https://script.google.com/macros/s/(Project_Deployment_URL)/exec"
frameborder="0" width="100%" height="1000px"></iframe>
</body>
</html>
ผล
68 Google Apps Script : Deploy as web app โดย วสสันต์ต คณคุ ดิดลกเศวต ([email protected])
วธม แท ก้ร(ขรด) 2 : โหลดเฉพาะสวส่ นของ iFrame ใหม่ส
ไฟล์น Test.html ท่ีทเรยท กใช้ช Web App ใน iFrame เพมทิร่ี ปุถม่ป ลงไป และเขทยนฟฝังก์ลชีทัต่น Javascript ผกมู ไว้ช ตวัต
ตวตั อย่าค ง
<!DOCTYPE html>
<html>
<head>
</head>
<body>
<button id="reload" onclick="reloadframe();">Reload</button>
<br><hr>
<iframe src="https://script.google.com/macros/s/(Project_Deployment_URL)/exec"
frameborder="0" width="100%" height="1000px"
id="fm" ></iframe>
<br><hr>
<p>ส่รวนล่รางนอก iFrame</p>
</body>
<script>
function reloadframe(){
var frame = document.getElementById("fm")
var webAppURL = frame.src ; // ได้ห URL มน
frame.src = webAppURL ;
}
</script>
</html>
ผล – เมทคืีอ่ คลิกร ทีปท่ ุ่มถป Reload สังต เกตวุถ าค่ สว่ค นทีท่ถกูม รทโหลดใหม่ค เกิรดเฉพาะส่ควนของ iFrame
บทท่มีท 9 : Web App แบบหลนยหนห้น 69
70 Google Apps Script : Deploy as web app โดย วสสันต์ต คณุค ดดิลกเศวต ([email protected])
บททท่ี 10
URLFetchApp
10.1. URLFetchApp
คลาส URLFetchApp
https://developers.google.com/apps-script/reference/url-fetch/url-fetch-app
ใช้ชจตับเนทั้ืคอหา และ ใช้ชสือ่คีท สารกตันระหวา่ค งเคร่ืคีทองคอมพิรวเตอร์ล(host) ในอินร เตอรล์เนจ็ต
10.2. เมถอดที่ทสาท คญข
10.2.ก.) fetch()
คลาส HTTPResponse
https://developers.google.com/apps-script/reference/url-fetch/http-response.html
เปปน็ คลาสทีทใ่ หย้ช สูม เซอร์ลเข้าช ถงทึ ขอ้ช มูลม ใน HTTP Response หรคอื ข้ชอมูลม ตอบกลัตบทีเ่ท กรดิ จากการสค่งคาท ขอแบบ
HTTP/HTTPS
fetch(url, params) – เมถอดในคลนส URLFetchApp
https://developers.google.com/apps-script/reference/url-fetch/url-fetch-app#fetchurl,-params
fetch() แปลวค่า "นาท มา" หรอืค "เอามา" ใชสช้ ร้ชางคาท ขอแบบ HTTP/HTTPS เพี่ทืคอไปเอาเนั้คืทอหาจาก URL ทีท่
ระบถุ โดยจะคคนื คา่ค กลตบั มาเปนป็ วัตตถุถ HTTPResponse
พารามริเตอรล์
Name Type Description
url
String The URL to fetch.
params
Object (ไม่จต นน เป็นป ) Javascript object specifying advanced parameters as defined
below. ( ดตดู นรนง แอดวนนซพ์ต นรนมดิเตอร์ต )
แอดวานซพล์ ารามเริ ตอร์ล (Advanced parameters)
Name Type Description
contentType String the content type (defaults to 'application/x-www-form-urlencoded').
Another example of content type is 'application/xml; charset=utf-8'.
headers Object a Javascript key/value map of HTTP headers for the request
method String the HTTP method for the request: get, delete, patch, post, or put.
The default is get.
payload the payload (that is, the POST body) for the request. Certain HTTP
(นน้ัทน หนสกั บรรทกุค ) methods (for example, GET) do not accept a payload. It can be a
String string, a byte array, a blob, or a Javascript object. A Javascript
object is interpreted as a map of form field names to values, where
the values can be either strings or blobs.
useIntranet Boolean Deprecated. This instructs fetch to resolve the specified URL within
the intranet linked to your domain through (deprecated) SDC
validateHttpsCertificates Boolean If false the fetch ignores any invalid certificates for HTTPS requests.
The default is true.
followRedirects Boolean If false the fetch doesn't automatically follow HTTP redirects; it
returns the original HTTP response. The default is true.
72 Google Apps Script : Deploy as web app โดย วสัสนตต์ คณคุ ดลิด กเศวต ([email protected])
Name Type Description
If true the fetch doesn't throw an exception if the response code
muteHttpExceptions Boolean indicates failure, and instead returns the HTTPResponse. The
default is false. (ถหน้ มปีม ัญฟ หนจะ Error ระหว่นต งรนัส แต่ถต ้นห ตทั้สงเปป็น true จะไม่ต
แสดง Error แมจ้ห ะไม่ตมมี Response กลบสั มน แต่ต เรนเอนเน้ทชัอหน Err มนแสดงได้ห
escaping Boolean If false reserved characters in the URL aren't escaped. The default
is true.
10.2.ข.) getContent()
getContent() - เมถอดในคลนส HTTPResponse
https://developers.google.com/apps-script/reference/url-fetch/http-response.html#getcontent
ใชจ้ช ับต ขช้อมลูม Binary จากการตอบคทาขอแบบ HTTP/HTTPS โดยจะคคนื คา่ค กลตบั มาเป็ปน Byte[] - Binary ใน
อาเรย์น มลท กตั ษณะ เชนค่ [60.0, 33.0, 100.0, 111.0, 99.0, … , … ]
10.2.ค.) getContentText()
getContentText() - เมถอดในคลนส HTTPResponse
https://developers.google.com/apps-script/reference/url-fetch/http-response.html#getcontenttext
ใชจ้ช ัตบข้อช มลูม จากการตอบกลตับคาท ขอแบบ HTTP/HTTPS และเปลยท่ี นหรอืค เปลงเปน็ป ขช้อความ (String)
ตวัต อยาค่ งท่ที 1 – โคดช้ ตค่อไปน้ทั Logs โคช้ด HTML ของหน้ชาแรก Google ออกมาดมู
var response = URLFetchApp.fetch("http://www.google.com/") ;
Logger.log(response.getContentText()) ;
ตวัต อยาค่ งท่ีท 2 – สง่ค HTTP Request ไปทีทเ่ วจ็บ https://httpbin.org/post โดยมท Payload เป็ปน Javascript
object ตดริ ไปดว้ช ย
// Make a POST request with form data.
// ส่ตวนของ Payload ทสั้งท หมด – มีมทงัส้ท Text และ ไฟลต์ Text
var resumeBlob = Utilities.newBlob('Hire me!', 'text/plain', 'resume.txt') ;
var formData = {
'name' : 'Bob Smith' ,
'email' : '[email protected]' ,
'resume' : resumeBlob // Javascipt Object
};
// Because payload is a Javascript object, it is interpreted as form data.
// ( Payload ทมีท่สง่ต ไปเปนป็ Javscript Obj. จะถดกู แปลงเปนป็ ขห้อมูลด Form data–สง่ต จนกฟอรมต์ )
// ( No need to specify contentType; it automatically defaults to either
// 'application/x-www-form-urlencoded' or 'multipart/form-data' )
var options = {
'method' : 'post' ,
'payload' : formData
};
var response = URLFetchApp.fetch('https://httpbin.org/post', options) ;
Logger.log(response.getContentText()) ; // ดดูผลทมที่ Logs -------------------- >
บททีทม่ 10 : URLFetchApp 73
ผล
Logs
{
"args": {} ,
"data": "" ,
"files": {
"resume": "Hire me!"
},
"form": {
"email": "[email protected]",
"name": "Bob Smith" } ,
"headers": {
"Accept-Encoding": "gzip,deflate,br" ,
"Content-Length": "469", "Content-Type": "multipart/form-data; boundary=\"-----
BRDt30db06PhSFmuuMOnfZRgHkOmG25AROE78eogERcutObLfr\"", "Host": "httpbin.org",
"User-Agent": "Mozilla/5.0 (compatible; Google-Apps-Script; beanserver;
+https://script.google.com; id: UAEmdDd8rFddydAVRBVLJCiBePMCfpI4BT5g)",
"X-Amzn-Trace-Id": "Root=1-5e884d17-d2511b928f8716c2b5247a40"
},
"json": null ,
"origin": "159.192.217.999, 107.178.194.999" ,
"url": "https://httpbin.org/post"
}
หมายเหตตุ :
เวบจ็ https://httpbin.org/ สทาหรบัต ทาท สอบ HTTP Request และ Response Service
74 Google Apps Script : Deploy as web app โดย วสันส ตต์ คณุค ดดิลกเศวต ([email protected])
ตวตั อยา่ค ง
// Make a POST request with a JSON payload.
var data = {
'name' : 'Bob Smith',
'age' : 35 ,
'pets' : [ 'fido' , 'fluffy' ]
};
var options = {
'method' : 'post' ,
'contentType': 'application/json' ,
// Convert the Javascript object to a JSON string.
'payload' : JSON.stringify(data)
};
var response = URLFetchApp.fetch('https://httpbin.org/post', options) ;
Logger.log(response.getContentText()) ;
10.2.ง.) getResponseCode()
getResponseCode()
https://developers.google.com/apps-script/reference/url-fetch/http-response.html#getresponsecode
จบัต รหตัสสถานะ HTTP Response ถชา้ คคืนค่าค เป็ปน 200 ถคอื ว่คา OK
ตวัต อยาค่ ง
var response = URLFetchApp.fetch("http://www.google.com/") ;
Logger.log(response.getResponseCode()) ;
บททีมท่ 10 : URLFetchApp 75
10.3. การใชงร้ าน Fixer API
ดตัดแปลงจาก Apps Script URLFetchApp API, Get JSON data, Build Google Sheets Function, Advanced Tutorial
https://www.youtube.com/watch?v=k0su6345KDI
10.3.ก.) ใช้ขบริตการ Fixer
Foreign exchange rates and currency conversion JSON API
https://fixer.io/
Fixer เป็ปนเวจ็บ API สาท หรตับใหชข้ อ้ช มลูม อัตตราแลกเปล่ีทยนเงนิร ตราระหวค่างประเทศ (forex)
หลตงั จาก Sign up แลวช้ เราจะได้ช API Access Key สาท หรบัต เขช้าใชง้ช าน API ตวัต อย่าค งเช่นค
API Access Key = 123456789abcdefghijklmnopqrstuvqxyz ซที่งึ API Access Key ตวตั น้ัท จะใช้ช
สาท หรบตั เข้ชาใชงช้ าน API ดว้ช ย ตวัต อย่าค งตามลริงคตล์ คอ่ ไปนทั้
http://data.fixer.io/api/latest?access_key=123456789abcdefghijklmnopqrstuvqxyz
เมคี่อทื เข้าช ตามลรงิ คขล์ ้ชางตนช้ จะเห็จนข้อช มลูม JSON ดตังตอ่ค ไปนัทท้ ีทห่ นาช้ เวจ็บ
JSON
{
"success":true,
"timestamp":1586762946,
"base":"EUR",
"date":"2020-04-13",
"rates":{
"AED":4.026292,
"AFN":82.904484,
"ALL":126.975615,
"AMD":544.60603,
"ANG":1.94965,
"AOA":613.318555,
…
…
…
}
}
76 Google Apps Script : Deploy as web app โดย วสนสั ต์ต คณคุ ดดิลกเศวต ([email protected])
ขา้ช งต้ชนสกุลถ เงรินทีเท่ ป็ปน base กจค็ อืค EUR (1 EUR มทคาค่ เทคา่ กตับเงิรนสกุลถ อน่คทืี เปป็นตตัวเลขเทาค่ ไรกวจ็ าค่ ไป ) หาก
ตช้องการใชช้ base เปนป็ สกลถุ อน่คีืท ใหช้สง่ค พารามเริ ตอรล์ base เพีม่รทิ เตมริ เขา้ช ไปในลริงค์ล แตตส่ อนนั้รท base ใชรฟ้ รทไมไ่ส ด้รแลร้ว
ถชา้ ใชจช้ ะได้ช JSON ตอค่ ไปน้ทั
http://data.fixer.io/api/latest?access_key=
123456789abcdefghijklmnopqrstuvqxyz&base=USD&format=1
ผล – Error ถมกู จาท กดัต การเขา้ช ถึงท
JSON
{
"success":false,
"error":{
"code":105,
"type":"base_currency_access_restricted"
}
}
อยาค่ งไรกด็จ ท ยตังพอมพท ารามิเร ตอร์ล symbols ใหใช้ ชชท้ ดสอบ พารามรเิ ตอรล์ symbols ใช้ชดเูม ฉพาะสกุลถ เงิรนทรที่ ะบุถ
ซี่งทึ จะระบุกถ ท่ตี ตวั กจ็ไดช้ ขั้ตทนโดย "," ตวตั อยาค่ งดตังนท้ั (base เปปน็ EUR เสมอ)
http://data.fixer.io/api/latest?access_key=
123456789abcdefghijklmnopqrstuvqxyz&symbols=USD,AUD,CAD,PLN,MXN&format=1
JSON
{
"success":true,
"timestamp":1586762946,
"base":"EUR",
"date":"2020-04-13",
"rates":{
"USD":1.096173,
"AUD":1.725593,
"CAD":1.52801,
"PLN":4.553666,
"MXN":25.594313
}
}
บททท่ีม 10 : URLFetchApp 77
10.3.ข.) Apps Script พฒัต นาการที่ทถ 1
หลตังจากทดสอบดูขม ช้อมลูม จากการพรมิ พ์ลล งิร ค์ล URL โดยตรงแลว้ช เราจะมาเขยท นสครปริ ต์เล พี่อคืท นทาข้อช มูมลมาใช้ช
งาน โดยขัทต้นแรก ทดสอบจบัต คค่าทีไท่ ดจช้ ากการตอบสนองจาก Fixer ออกมาดกูม ่คอน
var key = '123456789abcdefghijklmnopqrstuvqxyz' ;
var currencyArr = ['USD','AUD','THB'] // ดเดู ฉพนะสกุคลเงนิด 3 ตัวส นมท้เีั ทน่ต นัสท้น เทมยี บกสบั EUR
var currencyJoin = currencyArr.join(',') // USD,AUD,THB
var url = 'http://data.fixer.io/api/latest?access_key=' + key +
'&symbols='+ currencyJoin +'&format=1'
var fixerResponse = URLFetchApp.fetch(url) ; // ไปเอนขอ้ห มดูลจนก Fixer
Logger.log(fixerResponse) /* {
"success":true,
"timestamp":1586776146,
"base":"EUR",
"date":"2020-04-13",
"rates": {
"USD":1.09123,
"AUD":1.722269,
"THB":35.727522
}
} */
var obj = JSON.parse(fixerResponse) // แปลงเปน็ป Javascript Obj
var base =obj["base"] ; // EUR
var date =obj["date"] ; // 2020-04-13
var rates =obj["rates"] ; // {THB=35.767743, USD=1.09298, AUD=1.722626}
var ratesTHB =obj["rates"]["THB"] ; // 35.7538
10.3.ค.) Apps Script พฒัต นาการท่ีถท 2
โค้ชดในข้ชอกอ่ค นหน้ชา เป็ปนการทดสอบดูคม คูม่ คีถยน์(Keys) และ คร่า(Values) ของ JSON ทีท่ส่งค มาจาก fixer โดย
ในข้อช นท้ั เราจะทาท ให้ชยคดื หยุนคถ่ กว่าค เดิมร โดยสรชา้ งฟงฝั กชล์ ต่ัทนี แลช้วส่คง String ทเี่ท ปปน็ Keypath เขาช้ ไปจบตั Values มา
Keypath(คยมี พ์ต นธ) กจ็คคอื พาธไปยัตงคถยี ์น เพ่ีอืทค จะเขา้ข ถงึท คร่าต่รางๆของคียถ ์น บางคทยลไ์ มมค่ คท ยท ์ลยอ่ค ย(ไมค่มทโหนดใน)
บางคทย์มล ทคยท ล์ยอ่ค ย(มโท หนดใน) อยาค่ งเช่คน คยท ์ลพาธ rates > THB จะเข้าช ถทึงค่าค 35.7538
function call() {
var a = fixerAPI('base') ; // key = base
Logger.log(a) ; // value = EUR
var b = fixerAPI('date') ; // key = date
Logger.log(b) ; // value = 2020-04-13
var c = fixerAPI('rates/THB') ; // key = rates > THB
Logger.log(c) ; // 35.727522
var d = fixerAPI('rates') ; // key = rates
Logger.log(d) ; // [object Object] ------- > ไปแกหใ้ นข้หอ 10.3.จ (หนน้ห 80)
}
78 Google Apps Script : Deploy as web app โดย วสสนั ตต์ คณุค ดดิลกเศวต ([email protected])
function fixerAPI(keyPath) { // ระบพุค นรนมดเิ ตอร์ตเป็นป Keypath ในลัสกษณะ key1/key2...
var key = '123456789abcdefghijklmnopqrstuvqxyz' ;
var currencyArr = ['USD','AUD','THB'] ;
var currencyJoin = currencyArr.join(',') ; // USD,AUD,THB
var url = 'http://data.fixer.io/api/latest?access_key=' + key +
'&symbols='+ currencyJoin +'&format=1' ;
var fixerResponse = URLFetchApp.fetch(url) ;
var obj = JSON.parse(fixerResponse) ;
var keyPathArr = keyPath.split('/') ;
// สมมคตุ ดถิ น้ห keyPath = 'rates/THB' จะไดผ้ห ลลพสั ธเต์ ปน็ป [rates,THB]
// ดดขู ยนยควนมในขอห้ ถัสดไป ============================================= >
//
for( let i = 0 ; i < keyPathArr.length ; i++){
obj = obj[keyPathArr[i]] ;
Logger.log('Loop ' + i + ' '+ obj + ' = '+ typeof obj ) ;
// ตวสั อยต่นง
// ถหน้ keyPath = 'rates/THB' (มโถี หนดใน)
// Loop 0 [object Object] = object
// Loop 1 35.73684 = number < –--- return obj เปนป็ ตตัวนถีนั้
// ถน้ห keyPath = 'date' (ไมม่ร ถีโหนดใน)
// Loop 0 2020-04-13 = string < –--- return obj เปป็นตตัวนถ้ันี
}
return obj ;
}
10.3.ง.) ขยายความบรรทัดต obj = obj[keyPathArr[i]]
บรรทัดต obj = obj[keyPathArr[i]] ; เป็นป การกทาหนด(Assign) คทย์แล ละคค่า 1 ค่คมู ใหช้กตับตตวั แปรวตัต ถตุถ วัต
เดมิร ผลทไท่ี ดค้ช อคื วตร ถุตต วร นรน้ั จะเหลพอแคส่ คทย์พและค่าส 1 คู่สม ตวัต อยาค่ งตอค่ ไปน้ทั
// ไมม่ต ีโม หนดใน
var obj = {
name : 'Wasan' ,
lastname : 'kds' ,
phone : '0814598343' ,
line : 'wasankds' ,
}
Logger.log(obj) ; // {line=wasankds, phone=0814598343, name=Wasan, lastname=kds}
obj = obj["name"] // **** Assign คยมี ตแ์ ละคต่น 1 คดูต่ ให้หกบัส ตัสวเดดิม
Logger.log(obj) ; // Wasan (type เปน็ป String)
แต่คถ้าช มทการวนลูมป กาท หนดคาค่ ให้ตช ตัวแปรเดิมร แบบนทรั้ใชร้ไดเร้ ฉพาะกบร คยท พท์ ่มีท ทโหนดในเท่สานัรน้ แบบอ่นีทพ จะ
เละเทะ ดงัต ตัตวอย่คางตอ่ค ไปน้ัท
บททที่ม 10 : URLFetchApp 79
var obj = {
name: "Wasan" ,
lastname: "kds",
phone: "0814598343" ,
line: "wasankds" ,
pet : { // มมีโหนดใน
dog1 : "Mafia" ,
dog2 : "Yakuza" ,
dog3 : "Kaopod" ,
}
}
var arr = ["pet" , "dog1"] ; // เปนป็ อนเรยท์ต ีม่ทเกจบ็ Keypath จนก pet > dog1
for( var i = 0 ; i < arr.length ; i++){ // ดูด Logs --- > [01], [02]
obj = obj[arr[i]] ;
Logger.log('Loop ' + i + ' : '+ obj + ' = '+ typeof obj )
}
Logger.log(obj + ' = '+ typeof obj ) ; // ดดู Logs --- > [03]
ผล
Logs
[ 01 ] Loop 0 : [object Object] = object
[ 02 ] Loop 1 : Mafia = string
[ 03 ] Mafia = string
10.3.จ.) Apps Script พฒตั นาการทีท่ถ 3
ย้ชอนกลับต ไปในข้ชอ 10.3.ค Apps Script พฒตั นาการที่ท 2 หนา้ช 78 เมทอีืค่ เรยท กใช้ชฟฝงั ก์ลชตน่ีทั โดยระบถุ Keypath
เปป็น rates กค็จ ืคอ fixerAPI('rates') ผลท่ทไี ดกช้ ลับต มาคือค [object Object] ซี่งทึ ยงัต ไมค่ OK ทั้งทต นัเท้ ปป็นเพราะคยท ์ล rates
มโท หนดใน หรอืค เกบ็จ ค่คาทเที่ ปนป็ กช้อนวตตั ถถุไวช้อทกชตันท้ หนท่ึงี
เราจะมาแก้ชตรงนทั้ต่คอ โดยแปลงโหนดวตัต ถถทุ ต้งทั กช้อน เปป็นอาเรยล์ แลวช้ แสดงหรคือเขยท นลงใน Google Sheets
ทงทตั้ กช้อน
function call() {
var a = fixerAPI('base') ; Logger.log(a) ; // key = base // value = EUR
var b = fixerAPI('date') ; Logger.log(b) ; // key = date // value = 2020-04-13
var c = fixerAPI('rates/THB') ; Logger.log(c) ; // key = rates > THB // 35.727522
var d = fixerAPI('rates') ; // key = rates
Logger.log(d) ; // [[USD, 1.090852], [AUD, 1.713518], [THB, 35.692579]]
var e = fixerAPI('xxx') ; // key = ไมมต่ ีมคยมี ต์นีัมท้
Logger.log(e) ; // Node Not Avialable
}
80 Google Apps Script : Deploy as web app โดย วสนัส ต์ต คณุค ดิลด กเศวต ([email protected])
function fixerAPI(keyPath) {
var key = '123456789abcdefghijklmnopqrstuvqxyz' ;
var currencyArr = ['USD','AUD','THB']
var currencyJoin = currencyArr.join(',') // USD,AUD,THB
var url = 'http://data.fixer.io/api/latest?access_key=' + key +
'&symbols='+ currencyJoin +'&format=1'
var fixerResponse = URLFetchApp.fetch(url) ;
var obj = JSON.parse(fixerResponse) ;
var keyPathArr = keyPath.split('/') ;
for( let i = 0 ; i < keyPathArr.length ; i++){
obj = obj[keyPathArr[i]] ;
}
if(typeof(obj) === "undefined") { // ถน้ห ไมตม่ มี Keypath ท่ีมรท ะบคุ
return "Node Not Avialable" ;
}
else if(typeof(obj) === "object"){ // ถห้น Keypath เปนป็ Object – จับส ท้ัทสงยวงเปน็ป อนเรยต์ 2 มดิติด
var tempArr = [] ;
for(var key in obj){
tempArr.push([key,obj[key]]) ;
} // xlose - for
Logger.log(tempArr) ; // [[USD, 1.090852], [AUD, 1.713518], [THB, 35.692579]]
return tempArr ;
} else { // ถน้ห Keypath เปนป็ อยต่นงอน่ชีท – String, Number - มมีคตน่ เดมียว
return obj ;
}
}
ทดสอบเรยท กใชชฟ้ ังฝ กล์ชน่ัทีต ทเท่ี ขทยนเองใน Google Sheets จะไดช้ผลตามภาพ
10.4. การใชง้ร าน convertAPI
ConvertAPI
https://www.convertapi.com/pdf-to-merge
การรวมไฟล์ล PDF หลายไฟลใล์ ห้ชเปน็ป ไฟล์เล ดทยว บรกิร ารของ Google Apps Script ททายากมาก ใชชบ้ รกริ าร
API ของเจ้ชาอน่ทืคี งาค่ ยกวาค่ ซีึท่งในททีน่ ัทข้ อใช้ชบรกริ ารของ ConvertAPI
บททีมท่ 10 : URLFetchApp 81
เม่คอีทื สมคัต รใชชง้ านแลชว้ จะไดช้ลริงคล์สทาหรับต ส่งค API Request ตวัต อยาค่ งเชคน่
https://v2.convertapi.com/pdf/to/merge?Secret=ABCDEFGHIJKLMNOPQRSTUVWXYZ
ลิรงค์ลนทั้เราตอช้ งใชช้ในการเขทยน Google Apps Script เพทืค่ีอสค่งโหลด(Payload) เปป็นไฟลล์ PDF ไปประมวลผล
แลช้วเอาตัตวทร่ที วมแล้ชวกลบัต มาสรช้างเป็นป ไฟลล์ใน Google Drive
บริตการของ ConvertAPI น้ันตนไมฟ่ร รีถ อยค่างไรกจด็ ท มทโควต้ชาใหชใ้ ชฟช้ รท เพืี่ทอค ทดสอบได้ชปริมร าณหนงที่ึ (1500
วนริ าทท ประมวลผล) หมดโควต้าช แลวช้ กจต็ ชอ้ งเสทยเงริน
คาค่ ใชจช้ ่าค ยมททั้ทตงแบบ Subscription Plans และ Prepaid packages
Subscription Plans หรคือ แบบจ่าร ยรายเดอืค น ตทีา่ สถุด 6000 วนติ าทีถ 30US$/เดอคื น (0.00500$ ตอต่ วดินนทีม)
แบบ Prepaid packages หรืคอ แบบเป็ปนครันตง้ ๆ ซทคืั้อครัท้ตงหนงทีึ่ ได้ชเวลาประมวลผลกว่ีท ิรนาทกท ็จว่คาไป เชค่น
15,000 วตินาทีถ ราคา 10US$ (0.00667$ ตอ่ต วนดิ นทีม)
ดโูม ดยรวมแลช้ว แบบ Subscription Plans ถมกู กวาค่ 25%
Merge Multiple PDF's into one PDF
https://stackoverflow.com/questions/15414077/merge-multiple-pdfs-into-one-pdf
โคชด้ Google Apps Script สาท หรตับใช้ชบรกิร าร ConvertAPI มดท ัตงนทั้
function merge() {
// โฟลเดอรต์ทที่มม ไีม ฟล์ต PDF
var folder = DriveApp.getFolderById('1Vo9aFom7CPMK8NmAlX7Q8LZf_mVXlQH3') ;
var files = folder.getFilesByType(MimeType.PDF) ;
var formData = {} ;
var index = 0 ;
while(files.hasNext()) {
var file = files.next() ;
formData['Files[' + index + ']'] = file.getBlob() ; // วนลปดู จบัส Blob ของไฟล์ใต สต่ formData
index++ ;
}
Logger.log(formData) ; // formData = { Files[2]=Blob, Files[1]=Blob, Files[0]=Blob }
82 Google Apps Script : Deploy as web app โดย วสนัส ตต์ คณุค ดลดิ กเศวต ([email protected])
var options = {
'method' : 'post' ,
'payload' : formData ,
'muteHttpExceptions': true // สนน หรบสั Log ดูด Error reponse
};
// สง่ต Request ไปยัสง ConvertApi พรอห้ มรบัส คน่ต กลับส มนใสตต่ ัสวแปร response
// URL ท่ไมีท ดมห้ นจนกกนรสมสัครใชห้ ConvertAPI
var response = URLFetchApp.fetch('https://v2.convertapi.com/pdf/to/merge?Secret=
ABCDEFGHIJKLMNOPQRSTUVWXYZ', options) ;
// Logger.log(response.getContentText()) ; // ดวดู ตน่ มีมอะไรส่ตงมนบน้ห ง
if(response.getResponseCode() == 200) {
var contentText = JSON.parse(response.getContentText()) ;
var blob = Utilities.base64Decode(contentText.Files[0].FileData) ;
folder.createFile(Utilities.newBlob(blob, 'application/pdf', 'merge.pdf')) ;
}
}
ตวัต อยา่ค ง – ในโฟลเดอร์ล มไท ฟล์ล pdf 3 ไฟล์ล และก็จมไท ฟลอ์ล ่คีทนื ๆผสมอยูมค่
หลงัต จากรนัต โคด้ช จะไดช้ไฟลน์ pdf ชืคทอี่ merge.pdf เพิี่รมท มาอทกไฟลล์ เปนป็ ไฟล์ทล ที่รวมแลว้ช นัท่ตีนเอง
ตวัต อยาค่ งตามภาพ
บททมี่ท 10 : URLFetchApp 83
ตวตั อยคา่ งในไฟลล์ merge.pdf มดท ังต ตอ่ค ไปนัท้
84 Google Apps Script : Deploy as web app โดย วสันส ต์ต คณคุ ดดิลกเศวต ([email protected])
บทท่ที 11
JSON
11.1. JSON คพออะไร
JSON - Introduction
https://www.w3schools.com/js/js_json_intro.asp
Enum MimeType
https://developers.google.com/apps-script/reference/content/mime-type
เมคทีือ่ ต้อช งสงค่ ขช้อมมลู ระหวา่ค ง Server หรอืค Browser ขชอ้ มมลู ตอ้ช งเป็นป Text เทคา่ นตทน้ั
JSON (Javascript Object Notation ) คคือ Text ใน Google Apps Script เราสามารถแปลงจาก
Javascript Object ไปเป็ปน JSON และส่คง JSON ไปท่ที Server ไดช้
และเชนค่ เดทยวกตัน เราสามารถแปลงจาก JSON ทที่ไดช้รัตบจาก Server ไปเป็ปน Javascript object เพืคี่อท นาท มา
ใชต้ช ่คอใน Google Apps Script ไดด้ช ช้วย
การสงร่ ข้อข มลูม
// Javascript object
var myObj = {
name: "John",
age: 31,
city: "New York"
};
// แปลงเปน็ป JSON --------- > ส่งต ไปใหห้ Server
var myJSON = JSON.stringify(myObj) ;
// สสังเกตคุทีม่ท Logs มเีม คร่อทชี งหมนย " " ครอบทค่ีมท ยมี ต์ทสง้ัท หมด - คถียเน์ ปน็ป String
Logger.log(myJSON) ; /* {
"name":"John" ,
"age":31 ,
"city":"New York"
} */
การรตบั ขอข้ มมูล
// JSON ใน Single quotes – มมี Backtik ครอบ กค็จ ชอ เปนป็ Text ทัทง้ส กห้อน
var myJSON = ' {
"name":"John" ,
"age":31 ,
"city":"New York"
}';
// แปลงเป็ปน Javascript object --------- > นนนไปใชให้ น Google Apps Script
var myObj = JSON.parse(myJSON) ;
// สังส เกตุทค ีม่ท Logs ไม่รมีถเครอ่ีชท งหมนย " " ครอบทคีท่ม มยี ์ต - คียถ นเ์ ปป็นตวัต แปร
Logger.log(myObj) ; /* {
city=New York,
name=John,
age=31
} */
86 Google Apps Script : Deploy as web app โดย วสสนั ตต์ คณุค ดลดิ กเศวต ([email protected])
11.2. JSON Data Types
JSON Data Types
https://www.w3schools.com/js/js_json_datatypes.asp
ขชอ้ มูลม ใน JSON เป็ปนอะไรได้ชหลากหลาย ดงตั ตค่อไปนทั้
JSON Strings
{
"name":"John"
}
JSON Numbers
{
"age":30
}
JSON Objects
{
"employee" :
{
"name":"John" ,
"age":30 ,
"city":"New York"
}
}
JSON Arrays
{
"employees":[ "John", "Anna", "Peter" ]
}
JSON Booleans
{
"sale":true
}
JSON null
{
"middlename":null
}
บททีท่ม 11 : JSON 87
11.3. ตวข อยา่ส งการเขยท น JSON
11.3.ก.) ตตวั อยา่ร งทีท่ถ 1
สรา้ช งไฟลล์ .json สามารถสร้าช งโดยใช้ช Visual Studio หรอคื ใช้ช Text Editor
// user.json
{
"name": "Kyle" ,
"favoriteNumber": "3" ,
"isProgrammer": true ,
"hoibies": [ "Weight Lifting" , "Bowling" ] ,
"friends": [ {
"name": "Joey" ,
"favoriteNumber": "100" ,
"isProgrammer": false
}]
}
11.3.ข.) ตัวต อยาร่ งทถที่ 2
ไฟลล์ index.html
<!DOCTYPE html>
<html lang="en">
<head>
<title>JSON Example</title>
</head>
<body>
<script>
// companies เปนป็ อนเรย์ต 1 แถว ที่มมท มีสมนชกดิ เปปน็ JSON เรีมยงตอต่ กนัส ไป
let companies = [ {
"name":"Big Corporation" ,
"numberOfEmployees":1000 ,
"ceo":"Mary" ,
"rateing":3.6
},
{
"name":"Small Startup" ,
"numberOfEmployees":3 ,
"ceo":null ,
"rateing":4.3
}]
console.log(companies) ; // ---------------- > ดูดผลทมีทค่ อนโซล
</script>
</body>
</html>
88 Google Apps Script : Deploy as web app โดย วสัสนตต์ คณุค ดดิลกเศวต ([email protected])
ผลท่ทีคอลโซลของ Browser
11.3.ค.) ตวตั อยาร่ งท่ีถท 2 - ตอร่
ไฟลล์ index.html
<!DOCTYPE html>
<html lang="en">
<head>
<title>JSON Example</title>
</head>
<body>
<script>
// companies เปปน็ กหอ้ น Text - มีม ` ` (Back tick) ครอบทั้งสท ก้หอน
// ขหน้ งในกอ้ห น Text เปน็ป อนเรยต์ 1 แถว ทมมี่ท มีสมนชกิด เปป็น JSON เรีมยงตอ่ต กสันไป
let companies = `[{
"name":"Big Corporation" ,
"numberOfEmployees":1000,
"ceo":"Mary",
"rateing":3.6
},
{
"name":"Small Startup" ,
"numberOfEmployees":3 ,
"ceo":null ,
"rateing":4.3
}]`
console.log(JSON.parse(companies)) ; // ---------------- > ดผูด ลทคีมท่ อนโซล
</script>
</body>
</html>
บทที่ทม 11 : JSON 89
ผล – ไดชผ้ ลเหมคอื นก่คอนหน้ชา
11.4. JSON และ Google Apps Script
ดดัส แปลงมนจนก How to Get, Parse, Query, and Return JSON
http://googleappscripting.com/json/
11.4.ก.) สรง่ HTTP Request
เวลาเราใชชง้ าน API โดยสงค่ HTTP Request เข้าช ไป จะไดรช้ บตั JSON กลบตั มา ตวัต อยาค่ ง URL ทสท่ี คง่ HTTP
Request ดัตงต่คอไปนัท้
http://api.icndb.com/jokes/random
ผลททไี่ ดรช้ บตั กลตับมา หรอืค ททห่ี นช้าเว็บจ จะแสดงขอ้ช มลูม เปนป็ JSON ดงตั ตคอ่ ไปนท้ั
( JSON ดา้ช นลค่าง จตดั รมูปแบบให้ชเหมาะสทาหรตบั พิมร พ์ล แต่จค รริงๆแล้ชว Server ส่คงกลบัต มาไมสค่ วยแบบน้ัท )
{
"type": "success",
"value": {
"id": 149 ,
"joke": "Chuck Norris proved that we are alone in the universe. We weren't before his
first space expedition.",
"categories": []
}
}
90 Google Apps Script : Deploy as web app โดย วสนสั ต์ต คณคุ ดดลิ กเศวต ([email protected])
ตวตั อยา่ค งขช้างตน้ช เป็ปนการสค่ง HTTP Request ผา่ค น การพิมร พล์ URL ตรงๆทท่ี Browser แตค่ถชา้ จะโปรแกรม
ดว้ช ย Google Apps Script จะใชเ้ช มถอดเฉพาะ ดังต น้ทั
// ส่งต HTTP Get request ไปทเท่มี ว็จบ API – Default เปนป็ GET
var chuckNorrisJSON = URLFetchApp.fetch("http://api.icndb.com/jokes/random") ;
// เมทชีอ่ Logs ดจูด ะไดผ้ห ลลัพส ธ์เต หมอช นกบสั JSON ขน้ห งตน้ห
Logger.log(chuckNorrisJSON)
11.4.ข.) HTTP Post Request
ฟงัฝ กช์ล ่ทีนตั doPost() ของในโปรเจ็จค Google Apps Script จะรัตนทุกถ ครตทั้งททมี่ ท HTTP POST Request สงค่ เขช้า
มาโดย doPost() จะรบัต อากวิร เมนช้ ตท์ล ท่สี ง่ค เขา้ช มา(ถช้ามท) ไปประมวลผลต่คอไป จากนัท้นต กค็จ นืค ค่าค กลบตั ไป ตวตั อย่คางดตังนทั้
function doPost(request){
// get the sting value of the POST data
var postJSON = request.postData.getDataAsString() ;
// save that JSON to a file
DriveApp.createFile('post.json', postJSON) ;
}
ให้ชทดสอบส่คง HTTP POST Request ไปทโท่ี ปรเจคจ็ Google Apps Script โดยใชค้ช ทาส่งีตัท ต่อค ไปนทั้ (Linux
Terminal) หรอคื ใช้ช Post Man กไ็จ ด้ช
curl -H "Content-Type: application/json" -X POST -d
'{"greeting":"hello","recipient":"world"}' https://script.google.com/yourscriptURL
ตวตั อยาค่ งตามภาพ
บททม่ีท 11 : JSON 91
สทาคัญต วคา่ การ Deploy as web app ของโปรเจ็คจ Google Apps Script จะตชอ้ งเปดฟิ ใหรช้ ตันสครรปิ ต์ล เหมคือน
เจ้าช ของรัตนเอง ตามภาพ
หลตงั รนตั คทาส่ีงตทั (ใน Linux Terminal) จะมกท ารตอบกลตับ เปปน็ โคชด้ HTML ถ้าช นาท มาสร้าช งเปปน็ หน้าช เว็จบจะไดช้
ตามภาพ
ผลจากฟฝังกชล์ ่ีทตนั doGet() จะสรชา้ ไงฟล์ล JSON ไว้ทช ที่ Google Drive ตามภาพ
เน้คัืทอหาในไฟล์ล กค็จ อคื
{"greeting":"hello","recipient":"world"}
92 Google Apps Script : Deploy as web app โดย วสันส ต์ต คณุค ดดลิ กเศวต ([email protected])
จากนตทั้น ถ้ชาเราจะเขช้าถทึงไฟล์ล JSON ทท่ีสราช้ งไวช้ เพคืที่อไปเอาเน้ืคทัอหาข้ชางใน แลช้วแปลงเปป็น Javascript object
เพืที่คอจะเอาไปทาท อะไรตค่อใน Google Apps Script สามารถทาท ไดดช้ ตังนั้ท
function getJSONformFile(){
// จบสั ไฟลตต์ นมชอ่ทชี ไฟล์ต - ไดม้ห นเปน็ป วตสั ถคุ FilIterator - ต้หองวนลูปด เขนห้ ไปเอน
var iter = DriveApp.getFilesByName("post.json") ;
var json ;
while (iter.hasNext()) {
var file = iter.next() ; // จบัส ไฟล์ต
var jsonFile = file.getAs('application/json') // จบัส เนอทัช้ หนมนเป็ปน JSON – ไดห้ Blob
json = jsonFile.getDataAsString() // จบัส Text จนก Blob – ไดห้ String
Logger.log(json) ; // {"greeting":"hello","recipient":"world"}
// แปลงเป็นป Javascript Obj. - ถ้หนจะนนนมนใชตห้ ต่อใน Apps Script
var obj = JSON.parse(json) ;
Logger.log(obj) ; // {recipient=world, greeting=hello}
Logger.log(obj.greeting) ; // hello
Logger.log(obj.recipient) ; // world
}
}
11.4.ค.) HTTP Get request
doGet() ก็คจ ล้าช ยกับต doPost() เพทยงแต่ใค ช้ชกบตั HTTP Get Request โคด้ช ตอ่ค ไปนทั้ ตอบกลัตบเปฯ็ป JSON
function doGet(request){ // ไมไ่ต ดเ้ห อน request มนใชใ้ห นโคหด้ นี้ัทม
var myDog = { "name": "Rhino", "breed": "pug", "age": 8 }
var myJSON = JSON.stringify(myDog) ;
// คนช คต่นกลบัส เป็ปน JSON
var a = ContentService.createTextOutput(myJSON)
.setMimeType(ContentService.MimeType.JSON) ;
Logger.log(a) ; // TextOutput
Logger.log(a.getContent()) ; // {"name":"Rhino","breed":"pug","age":8}
return a ;
}
ผล – เม่ืีคอท เขา้ช ลงิร คล์ Deploy as web app ของโปรเจ็คจ Google Apps Script จะไดช้ผลลพตั ธ์ลท่ีทหนา้ช เว็จบดัตงนทั้
บททม่ีท 11 : JSON 93
11.4.ง.) ส่รง JSON ตดติ ไปกัตบ HTTP Request
โค้ดช ตอค่ ไปนทั้ ส่คง Payload เปป็น JSON ตดริ ไปกับต HTTP Request ทสที่ ราช้ งโดยเมถอด URLFetchApp
var options = {
'method' : 'post',
'contentType': 'application/json' ,
'payload' : myJSON
};
// send the request
URLFetchApp.fetch('https://example.com/post', options) ;
11.4.จ.) บนัต ทกทึ JSON ลง Google Sheets
ตวัต อย่คางตอค่ ไปนั้ท มท 2 โปรเจคจ็
โปรเจค็จ แรก เป็ปนตวตั ยรงิ HTTP Request ไปหาโปรเจจ็คททสี่ อง
โปรเจคจ็ ทมีส่ท อง นทา Payload(JSON) ท่โที ปรเจ็จคแรกส่งค มา ไปเขยท นลง Google Sheets
โปรเจค็ก ที่ทถ 1 - มโท คดช้ ดงัต ตค่อไปนั้ท
function call() {
var myDog = { name: "Mafia", breed: "Tshizu", age: 10 } ;
var myJSON = JSON.stringify(myDog) ;
var options = {
'method' : 'post',
'contentType': 'application/json',
'payload' : myJSON // สต่ง payload เป็ปน JSON
};
var url = 'https://script.google.com/macros/s/AppScriptProject_URL' ;
// ส่ตง HTTP Request ไปททีม่ URL ขห้นงตน้ห โดยแนบ payload สงต่ ไปดว้ห ย
// และ จบสั กนรตอบกลับส มนใส่ตตวัส แปรไวห้
//
var response = URLFetchApp.fetch(url, options) ;
// Logs กนรตอบกลบัส ออกมนดูด // {"response":"success"}
// โปรเจค็จ ท่ทมสี อง ตอบกลสับมนเปน็ป JSON งตน่ ยๆ // {"response":"success"}
Logger.log(response) ;
Logger.log(response.getContentText()) ;
}
94 Google Apps Script : Deploy as web app โดย วสนัส ตต์ คณุค ดดลิ กเศวต ([email protected])
โปรเจ็กคท่ถีท 2 - มทโคดช้ ดตงั ต่คอไปนท้ั
เม่อืคีท ไดร้ช บัต JSON เราสามารถบตันททึกลง Google Sheets ไดด้ช งตั นทั้
function doPost(request){
// postData – เปนป็ Event parameters
// https://developers.google.com/apps-script/guides/web
// เปนป็ สตว่ นของ Payload ทมมีท่ นจนก POST Request
var json = request.postData.getDataAsString() ;
var obj = JSON.parse(json) ;
// จบสั คมยี ท์ต ้งัทส หมดของ Javascript Obj ใสอ่ต นเรย์ต // [name, breed, age]
var headerRow = Object.keys(obj) ;
// วนลูปด สง่ต คีมยตท์ จ่มีท บสั มนกอ่ต นหนน้ห ไปเอนคนต่ จนก Javascript Obj
var row = headerRow.map(function(key){ // [Rhino, pug, 8.0]
return obj[key]
}) ;
// จบสั หวัส ตนรนง + ขอ้ห มลูด ใสอต่ นเรยต์ - จะไดเห้ ป็ปนอนเรยต์ 2 มิดติพด รหอ้ มเซตจ็ ลง Google Sheets
var contents = [ headerRow , row ] ; // [[name, breed, age],
// [Rhino, pug, 8.0]]
// เซ็จตลง Google Sheets
var id = 'Google Sheets Id' ;
var sheet = SpreadsheetApp.openById(id).getSheetByName('Sheet Name');
var rng = ss.getActiveSheet().getRange(1, 1, contents.length, headerRow.length )
rng.setValues(contents)
// ตอบกลบัส เปนป็ JSON แบบง่ตนย แคต่เพยมี งทดสอบ
//
var successObj = { response: "success" } ;
return ContentService.createTextOutput(JSON.stringify(successObj))
.setMimeType(ContentService.MimeType.JSON) ;
ผลทท่ีไฟลล์ Google Sheets
บทท่มีท 11 : JSON 95
11.4.ฉ.) แปลงข้ขอมลูม จากตารางใน Google Sheets เปป็น JSON
Creating a JSON object from Google Sheets
https://stackoverflow.com/questions/47555347/creating-a-json-object-from-google-sheets
function test_getJsonArrayFromData() {
var data = [
['Planet', 'Mainland', 'Country', 'City'] ,
['Earth', 'Europe', 'Britain', 'London'] ,
['Earth', 'Europe', 'Britain', 'Manchester'] ,
['Earth', 'Europe', 'Britain', 'Liverpool'] ,
['Earth', 'Europe', 'France', 'Paris'] ,
['Earth', 'Europe', 'France', 'Lion']
];
Logger.log(getJsonArrayFromData(data)) ;
// => [{Mainland=Europe, Country=Britain, Planet=Earth, City=London}, {Mainland=Europe,
Country=Britain, Planet=Earth, City=Manchester}, {Mainland=Europe, Country=Britain,
Planet=Earth, City=Liverpool}, {Mainland=Europe, Country=France, Planet=Earth, City=Paris},
{Mainland=Europe, Country=France, Planet=Earth, City=Lion}]
}
function getJsonArrayFromData(data) {
var obj = {} ; // ขบัส อนเรยต์แถวแรกมนเปป็น header - ใชเห้ ปน็ป คยมี ต์ดห้วย
var result = [] ;
var headers = data[0] ;
var cols = headers.length ;
var row = [] ;
for (var i = 1 , i = data.length; i < l ; i++) {
// get a row to fill the object
row = data[i] ;
// clear object
obj = {} ;
for (var col = 0 ; col < cols ; col++) {
// fill object with new values
obj[headers[col]] = row[col] ;
}
// add object in a final result
result.push(obj) ;
}
return result ;
}
96 Google Apps Script : Deploy as web app โดย วสันส ต์ต คณคุ ดดิลกเศวต ([email protected])
11.5. เซอรว์ร ิธส Content
เซอร์วน ติส
https://developers.google.com/apps-script/reference/content
คลาส TextOutput
https://developers.google.com/apps-script/reference/content/text-output
เซอร์ลวรสิ Content ใชสช้ ร้ชางและเสริฟร ข้อช มูลม แบบ Text ในหลากหลายรปูม แบบ เชน่ค Text, XML, JSON
11.5.ก.) createTextOutput()
createTextOutput(content) - Method ในคลนส ContentService
https://developers.google.com/apps-script/reference/content/content-service#createtextoutputcontent
ใชช้สรช้างวตัตถุถ TextOutput ตัตวใหม่ค โดยสร้ชางจากพารามริเตอรล์ทีท่ใส่เค ขช้าไป โดยพารามริเตอรล์สามารถเวช้นไว้ชได้ช
โดยจะคคืนคา่ค กลัตบมาเปปน็ วตัต ถุถ TextOutput
ตวัต อยาค่ งท่ที 1 - แบบไมม่ค ทพารามริเตอรล์
function doGet() {
var output = ContentService.createTextOutput() ;
output.append("Hello world!") ; // แนบ Text เขน้ห ไปในวสตั ถคุ TextOutput
return output ;
}
ตวตั อยาค่ งที่ท 2 – แบบมทพารามเิร ตอรล์
function doGet() {
return ContentService.createTextOutput('Hello, world!') ;
}
เม่คืทีอเปฟิดลริงค์ทล ใที่ ช้ช Deploy as web app จะไดผ้ช ลลัตพธลต์ ามภาพ
บทท่ีทม 11 : JSON 97
ตวตั อยาค่ งทีท่ 3
Content Service - Guide
https://developers.google.com/apps-script/guides/content
โค้ชดตคอ่ ไปนัท้ คนืค คค่ากลัตบมาเป็ปน JSON แจง้ช true หรอืค false วา่ค มท Event ในชว่ค งเวลาดงัต กลา่ค วหรคือไมค่
function doGet(request) {
Logger.log(request) ; // ดผดู ลทีท่ม Logs ---------------------- > [ 01 ]
var events = CalendarApp.getEvents(
new Date(Number(request.parameters.start) * 1000) ,
new Date(Number(request.parameters.end) * 1000)
);
var result = {
available : events.length == 0
};
Logger.log(result) ; // ดผูด ลทมีท่ Logs ---------------------- > [ 02 ]
return ContentService.createTextOutput(JSON.stringify(result))
.setMimeType(ContentService.MimeType.JSON) ;
}
เมคีทื่อเปิฟดลิรงคล์ทีท่ใชช้ Deploy as web app จากนัทต้นต่คอทช้ายลิรงค์ล Web App ด้ชวยพารามิรเตอรล์ ตตัวอย่คางดตังต่คอ
ไปนทั้
https://script.google.com/macros/s/Script Id?start=1548954000&end=1585674000
เพที่คือส่คงตวัต แปร start และ end ใหกช้ ตบั doGet()
Logs
[ 01 ] {contextPath=, parameters={start=[1580490000], end=[1585674000]},
contentLength=-1.0, queryString=start=1580490000&end=1585674000,
parameter={start=1580490000, end=1585674000}}
[ 02 ] {available=true}
ท่ีทหนา้ช Web App ได้ชผลลพัต ธลด์ งัต ตคอ่ ไปนั้ท
หมายเหตตุ : ศกึท ษาเพิ่มทีร เตรมิ ทที่
doGet and doPost Tutorial + 6 Web App Examples
http://googleappscripting.com/doget-dopost-tutorial-examples/
98 Google Apps Script : Deploy as web app โดย วสัสนต์ต คณคุ ดดิลกเศวต ([email protected])
บททีท่ม 11 : JSON 99
The words you are searching are inside this book. To get more targeted content, please make full-text search by clicking here.
Google Apps Script เซอร์วิส Document
Discover the best professional documents and content resources in AnyFlip Document Base.
Search