來到了第五天,關於寄信可以進入比較進階的操作。但一樣先講結論,如果你很急著用,可以直接使用這份 Add-On: Form Notification,這是 Google Cloud 官方開發的 Add-On,可信度很高。自己寫的好處是,如果你突然想要寄送像是網頁般的內容(HTML-Based)的內容的話,你可以知道怎麼做。讓我們開始吧!
提醒:本篇需要一點點的 HTML 知識,一樣是你大概有刷過 W3C 的應該就還可。
今天學妹問你說,「先輩,我們新活動能不能在報名時,就依據他的意願,給他不同的客製化回答呀?」身為一個工具師,當然義不容辭地試試。今天的關鍵問題是...
「如何依據 Google 表單的回應客製化回應信件?」
網路上流傳的一種解法 是可行但相對,但有沒有另外比較靠(厲)譜(害)的寫法?也就因此有了這篇。
假設我們今天想要「依據使用者回應的交通方式,給予不同的交通方式說明」。這次希望加上簡單的 HTML 的運用。
好,今天我們開一個新的 Google 表單,並將其回應連結到 GAS。
一樣執行時會有「需要驗證」出現,讓我借用一下 D2 的影片。
那這邊,就會需要跟 D4 一樣,讀取回應,假設我們今天收到這樣的回應們。
因為跟 D4 差不多,主要是設定範圍並取得資料,這邊我們就加速帶過。
function readData() {
let sheet = SpreadsheetApp.getActiveSheet();
let startRow = 2;
let startCol = 2;
let numRows = 5;
let numCols = 2;
let dataRange = sheet.getRange(startRow, startCol, numRows, numCols);
let data = dataRange.getValues();
return data
}
function sendEmails() {
let data = readData();
for (let i in data) {
let row = data[i];
let emailAddress = row[0];
let subject = "Hello";
let message = "Content";
MailApp.sendEmail(emailAddress, subject, message);
}
}
這樣在執行時,就會對表單中的收信者,寄出一封名為 "Hello" 的信件。
學妹希望針對自行開車的,給予開車路線;也希望針對大眾運輸的,給予大眾運輸的路線,兩個我們都用圖片(網址)來給予。先簡單做了個示意圖,汽車和捷運的網址分別是 https://i.imgur.com/m9zCXUV.png 和 https://i.imgur.com/h5kT4Fm.png 。之後我們再聊怎麼樣寄出 Google Drive 裡面的檔案。
那設定方式就可以是簡單弄一個 function 來達到,進階班的朋友也可以用三元運算子(Conditional Operator)來寫這段。
function customContent(commute_way){
if(commute_way == "大眾運輸"){
return "大眾運輸請參考: https://i.imgur.com/h5kT4Fm.png";
}else if (commute_way == "自行開車"){
return "開車請參考: https://i.imgur.com/m9zCXUV.png";
}
}
function sendEmails() {
let data = readData();
for (let i in data) {
let row = data[i];
let emailAddress = row[0];
let subject = "Subject";
let message = customContent(row[1]);
Logger.log(emailAddress +" "+ message);
// MailApp.sendEmail(emailAddress, subject, message);
}
}
然後 Print 一下看有沒有給予不同的內容。確定都有跟表單上一樣,開車給開車的,捷運給捷運的,沒問題後就進到下一階段。
createHtmlOutput
寄出可以直接讀取的信件好,那如果不想還要點連結,除了作為附件(之後會教)外,還有什麼其他的方式?在 GAS 當中,我們是透過用信件送出 HTML 的,收信人預計會收到一個簡單的 HTML 檔案長這樣——
一樣,我們看程式碼。
function customContent(commute_way){
if(commute_way == "大眾運輸"){
return HtmlService.createHtmlOutput('<span>請參考地圖移動:\
<img src="https://i.imgur.com/h5kT4Fm.png" \
alt="大眾運輸地圖"> \
</span>');
}else if (commute_way == "自行開車"){
return HtmlService.createHtmlOutput('<span>請參考地圖移動:\
<img src="https://i.imgur.com/m9zCXUV.png" \
alt="自行開車地圖"> \
</span>');
}
}
function sendEmails() {
let data = readData();
for (let i in data) {
let row = data[i];
let emailAddress = row[0];
let subject = "Subject";
let message = customContent(row[1]);
MailApp.sendEmail({
to: emailAddress,
subject: subject,
htmlBody: message.getContent()
});
}
}
基本上是直接在 HtmlService.createHtmlOutput()
中寫上你的簡易 HTML 程式碼。並在 MailApp.sendEmail
寄送的部分使用 htmlBody
來送出,記得要在內容的部分加用 getContent()
。這是針對簡易版的 HTML,就幾行而已的那種。
但如果是複雜版的,可能有動畫、大小差異的,又要怎麼處理?此時就要透過 createTemplateFromFile
了。
createTemplateFromFile()
寄出可以直接讀取的信件要使用 createTemplateFromFile()
,那我們就會需要 template HTML,而 GAS 裡面是可以做到直接創建的。在檔案的 + 上按下新增並輸入想要的名字。在程式碼的部分,再透過 HtmlService.createTemplateFromFile('mrt')
來呼叫。記得不用再加上 .html
,純粹呼叫 mrt
即可。
完整的程式碼在這——
function customContent(commute_way){
if(commute_way == "大眾運輸"){
return HtmlService.createTemplateFromFile('mrt')
}else if (commute_way == "自行開車"){
return HtmlService.createTemplateFromFile('driving')
}
}
function sendEmails() {
let data = readData();
for (let i in data) {
let row = data[i];
let emailAddress = row[0];
let subject = "Subject";
let message = customContent(row[1]);
MailApp.sendEmail({
to: emailAddress,
subject: "Your application is approved!",
htmlBody: message.evaluate().getContent()
});
}
}
最後功能會如下的運作, 這邊用 Step 3-2 的方式示範,但 Step 3-1 的 Code 也有試過,都行。
透過在 GAS 中創建 HTML File,將其用 HtmlService.createTemplateFromFile
引用為 Template,再在 MailApp.sendEmail({htmlBody})
中讀取。這邊要注意的是,和 createHtmlOutput
相比,這邊的內容在寄出之前,是使用 message.evaluate().getContent()
這之後再跟大家說明細節。
如果希望在不同時間觸發,可以搭配 D3 的 Trigger,或是想要打包成按鈕、UI,則可以透過 D2 的打包說明。之後會跟大家說明如何將回應整合進 Google Calendar,並再更之後會說明如何即時的在有人回應表單時,就即時回傳客製化的內容。
好,那今天我們知道了要怎麼樣:
createTemplateFromFile
和 createTemplateFromFile
加入簡單與複雜的 HTML 檔案。好,那今天就是我們的 D5,原本預計今天要說「依據表單結果客製化回應說有沒有報名成功」,但發現篇幅有點多(五千六百多字了囧),所以會拉到之後講。明天 D6 會繼續介紹怎麼將「表單中的回應」丟到「Google Calendar」當中。的方式,如果不想錯過可以訂閱按讚小鈴鐺(?),也歡迎留言跟我說你還想知道什麼做法/主題。如果有執行上的疑問,透過留言之外,也可以到 Facebook Group,想成立了幾年,感謝這次鐵人賽才真的實踐,歡迎來當 Founding Member。我們明天見。