ลงมือจริงกับ Google Apps Script: การเข้าถึง Google ชีต, Maps และ Gmail ด้วยโค้ด 4 บรรทัด

1. ข้อมูลเบื้องต้นเกี่ยวกับ Google Apps Script

ใน Codelab นี้ เราจะแนะนำวิธีที่ง่ายที่สุดวิธีหนึ่งในการเขียนโค้ดที่เข้าถึงเทคโนโลยีสำหรับนักพัฒนาแอปของ Google ซึ่งทั้งหมดนี้ทำได้โดยใช้ JavaScript ซึ่งเป็นภาษาพัฒนาเว็บหลัก เมื่อใช้ Google Apps Script คุณจะเขียนโค้ดเพื่อดึงที่อยู่จากเซลล์ใน Google ชีต สร้าง Google Maps ตามที่อยู่ แล้วส่งแผนที่เป็นไฟล์แนบโดยใช้ Gmail แล้วส่วนที่เจ๋งที่สุดคืออะไรรู้ไหม โดยจะมีโค้ดเพียง 4 บรรทัดเท่านั้น

สิ่งที่คุณจะได้เรียนรู้

  • วิธีใช้ Google Apps Script กับบริการต่างๆ ของ Google เช่น Google ชีต, Google Maps และ Gmail
  • พัฒนาโค้ดโดยใช้โปรแกรมแก้ไขในเบราว์เซอร์สำหรับ Apps Script

สิ่งที่คุณต้องมี

  • เว็บเบราว์เซอร์ที่มีสิทธิ์เข้าถึงอินเทอร์เน็ต
  • บัญชี Google (บัญชี Google Workspace อาจต้องได้รับการอนุมัติจากผู้ดูแลระบบ)
  • คุ้นเคยกับ Google ชีต ในระดับพื้นฐาน
  • ความสามารถในการอ่านรูปแบบ A1 ของชีต

2. แบบสำรวจ

คุณจะใช้ Codelab/บทแนะนำนี้อย่างไร

อ่านอย่างเดียว อ่านและทำแบบฝึกหัด

คุณจะให้คะแนนประสบการณ์การใช้งานเครื่องมือและ API สำหรับนักพัฒนาแอป Google Workspace ว่าอย่างไร

ผู้ฝึกหัด ขั้นกลาง ผู้ชำนาญ

3. ภาพรวม

ตอนนี้คุณทราบแล้วว่า Codelab นี้เกี่ยวกับอะไร คุณจะทำอะไรต่อไป

  1. ดูข้อมูลเบื้องต้นเกี่ยวกับ Apps Script ซึ่งอิงตาม JavaScript
  2. สร้างสเปรดชีตใน Google ชีต
  3. ป้อนที่อยู่ถนนในเซลล์ซ้ายบนสุด (A1) ของสเปรดชีต
  4. ดูวิธีเปิดตัวแก้ไข Apps Script สำหรับเอกสาร
  5. แก้ไขโค้ด Apps Script, บันทึก และเรียกใช้
  6. ใช้ Gmail เพื่อดูผลลัพธ์

มาเริ่มกันเลยดีกว่า

Google Apps Script คืออะไร

Google Apps Script เป็นแพลตฟอร์มการพัฒนาที่ช่วยให้คุณสร้างสคริปต์และแอปพลิเคชันขนาดเล็กที่ผสานรวมกับ Google Workspace ได้อย่างรวดเร็วและง่ายดาย คุณจะทำสิ่งต่อไปนี้ได้ด้วย Apps Script

  • เขียนโค้ดใน JavaScript และเข้าถึงไลบรารีในตัวสำหรับแอปพลิเคชัน Google Workspace เช่น Gmail, ปฏิทิน, ไดรฟ์ ฯลฯ
  • คุณไม่ต้องติดตั้งอะไรเลย เรามีเครื่องมือแก้ไขโค้ดให้คุณในเบราว์เซอร์ และสคริปต์จะทำงานบนเซิร์ฟเวอร์ของ Google
  • ไม่ต้องกังวลเกี่ยวกับหัวข้อที่ซับซ้อน เช่น สิทธิ์การเข้าถึงความปลอดภัยและข้อมูล เนื่องจากแพลตฟอร์มจะจัดการให้คุณ

คุณใช้ Apps Script เพื่อสร้างแอปพลิเคชันต่างๆ ได้ ตั้งแต่แชทบ็อตไปจนถึงเว็บแอป การใช้งานที่ได้รับความนิยมมากที่สุดอย่างหนึ่งคือการขยายฟังก์ชันการทำงานของสเปรดชีตใน Google ชีต ใน Codelab ที่เหลือนี้ คุณจะได้เรียนรู้วิธีใช้ Apps Script เพื่อนำข้อมูลจากสเปรดชีตและเชื่อมต่อกับบริการอื่นๆ ของ Google

4. สร้างสเปรดชีตใน Google ชีตและป้อนที่อยู่

ใน Google ชีตใหม่ ให้ป้อนที่อยู่ที่ถูกต้องโดยทำตามวิธีการต่อไปนี้

  1. สร้างสเปรดชีตใน Google ชีตโดยใช้ลิงก์ที่สะดวกนี้ (sheets.google.com/create) หรือไปที่ Google ไดรฟ์ (drive.google.com) แล้วคลิกใหม่ > Google ชีต > สเปรดชีตเปล่า

413a93e5b2f6b3d4.png

  1. ในสเปรดชีตเปล่า ให้ไปที่เซลล์แรกที่มุมซ้ายบน (A1) ซึ่งจะอยู่ในคอลัมน์ A และแถว 1 หากต้องการทบทวนอีกครั้ง คุณสามารถดูคำอธิบายสัญกรณ์ A1 นี้ได้
  2. ป้อนที่อยู่ที่ถูกต้องในเซลล์ เลือกที่อยู่บนโลกที่มีตำแหน่งที่แน่นอนโดยใช้ที่อยู่ รหัสไปรษณีย์ หรือการผสมผสานระหว่างเมืองและรัฐ/จังหวัด ตัวอย่างที่อยู่ในนิวยอร์กซิตี้

7077e446455639df.png

เท่านี้ก็เรียบร้อยในชีต มาเปิดเครื่องมือแก้ไขและเขียนโค้ดกัน

5. แก้ไขโค้ด Apps Script

เมื่อมีสเปรดชีตใน Google ชีตใหม่แล้ว ก็ถึงเวลาแก้ไขสคริปต์ที่เชื่อมโยง โดยทำตามวิธีการต่อไปนี้

เปิดเครื่องมือแก้ไขสคริปต์

ในแถบเมนู ให้เลือกส่วนขยาย > Apps Script เพื่อเปิดโปรแกรมแก้ไขโค้ดในเบราว์เซอร์สำหรับ Apps Script

ในแท็บเบราว์เซอร์ใหม่ เครื่องมือแก้ไขโค้ดจะแสดงสคริปต์ container-bound เริ่มต้นสำหรับชีต ระบบจะสร้างฟังก์ชันเริ่มต้นชื่อ myFunction() โดยอัตโนมัติ และวางเคอร์เซอร์ไว้ภายในฟังก์ชันเพื่อให้คุณเริ่มต้นใช้งานได้

ส่งอีเมลแผนที่ Google ของที่อยู่

โค้ด "เทมเพลต" ที่คุณได้รับนั้นว่างเปล่า ดังนั้นมาแทนที่ด้วยแอปพลิเคชันของเรากัน

  1. ในตัวแก้ไขสคริปต์ ให้แทนที่myFunction()บล็อกโค้ดเริ่มต้นด้วยโค้ดต่อไปนี้
/** @OnlyCurrentDoc */
function sendMap() {
  var sheet = SpreadsheetApp.getActiveSheet();
  var address = sheet.getRange('A1').getValue();
  var map = Maps.newStaticMap().addMarker(address);
  GmailApp.sendEmail('YOUR_EMAIL_ADDR', 'Map', 'See below.', {attachments:[map]});
}
  1. แทนที่อีเมลตัวยึดตำแหน่ง ('YOUR_EMAIL_ADDR') ด้วยอีเมลที่ถูกต้อง เช่น friend@example.com
  2. หากต้องการบันทึกสคริปต์ ให้คลิกบันทึก เซฟ
  3. หากต้องการเปลี่ยนชื่อโปรเจ็กต์ Apps Script ให้คลิกโปรเจ็กต์ที่ไม่มีชื่อ ป้อนชื่อโปรเจ็กต์ แล้วคลิกเปลี่ยนชื่อ

การตรวจสอบโค้ด

มาดูโค้ด 4 บรรทัดของฟังก์ชัน sendMap() ที่ประกอบกันเป็นทั้งแอปพลิเคชันกัน ที่น่าสนใจคือโค้ดอ้างอิงถึงผลิตภัณฑ์ต่างๆ ของ Google 3 รายการ

บรรทัดแรกคือความคิดเห็นในคำอธิบายประกอบที่มีผลต่อการให้สิทธิ์

/** @OnlyCurrentDoc */

สคริปต์ส่วนใหญ่จะขอสิทธิ์บางอย่างจากผู้ใช้ก่อนจึงจะเรียกใช้ได้ สิทธิ์เหล่านี้จะควบคุมสิ่งที่ผู้ใช้จะอนุญาตให้สคริปต์ทำ บรรทัดแรกคือความคิดเห็นที่มีคำอธิบายประกอบที่ไม่บังคับซึ่งสั่งให้ Apps Script จำกัดการเข้าถึงสเปรดชีตปัจจุบัน (แทนที่จะเป็นสเปรดชีตทั้งหมดของผู้ใช้) แนวทางปฏิบัติแนะนำคือให้ใส่คำอธิบายประกอบนี้เสมอเมื่อคุณทำงานกับไฟล์เดียวเท่านั้น

โค้ดใช้การประกาศฟังก์ชัน JavaScript ปกติสำหรับ sendMap() ดังนี้

function sendMap() {

บรรทัดถัดไปจะเรียกใช้ Spreadsheet Service ซึ่งเข้าถึงได้จาก Apps Script ผ่านออบเจ็กต์ SpreadsheetApp ระบบจะกำหนดชีตที่แสดงผลให้กับตัวแปรที่มีชื่อเดียวกัน เมธอด getActiveSheet() จะรับการอ้างอิงไปยังออบเจ็กต์ชีตปัจจุบันและจัดเก็บไว้ในตัวแปร sheet

  var sheet = SpreadsheetApp.getActiveSheet();

ออบเจ็กต์ sheet ช่วยให้เราอ้างอิงช่วงเซลล์ (ของเซลล์เดียว) ในรูปแบบ A1 ด้วย getRange() "ช่วง" คือกลุ่มของเซลล์ รวมถึงเซลล์เดียว เช่น เซลล์ A1 (เซลล์ที่เราป้อนที่อยู่) หากต้องการดึงข้อมูลที่อยู่ภายในช่วง เมธอด getValue() จะแสดงค่าของเซลล์ซ้ายบนสุดในช่วงและกำหนดค่าให้กับตัวแปร address นอกจากนี้ คุณยังลองเพิ่มที่อยู่และอ่านจากเซลล์ต่างๆ ได้ด้วย

  var address = sheet.getRange('A1').getValue();

บรรทัดที่ 3 ของโค้ดจะเชื่อมต่อกับบริการของ Google Maps โดยใช้ออบเจ็กต์ Maps newStaticMap() สร้างออบเจ็กต์แผนที่แบบคงที่ และเมธอด addMarker() จะเพิ่ม "หมุด" ลงในแผนที่โดยใช้ที่อยู่ในชีต

  var map = Maps.newStaticMap().addMarker(address);

สุดท้าย บริการ Gmail ผ่านออบเจ็กต์ MailApp จะเรียกใช้เมธอด sendEmail() เพื่อส่งอีเมลที่มีทั้งข้อความ "ดูด้านล่าง" และรูปภาพแผนที่เป็นไฟล์แนบ

  GmailApp.sendEmail('friend@example.com', 'Map', 'See below.', {attachments:[map]});
}

6. เรียกใช้แอป Google ชีต, Maps และ Gmail

เมื่อตั้งชื่อและบันทึกแล้ว ก็ถึงเวลาเรียกใช้ฟังก์ชัน ที่ด้านบนของเอดิเตอร์ ให้ตรวจสอบว่าได้เลือก sendMap() จากรายการฟังก์ชันแล้ว และคลิกเรียกใช้

ฟีเจอร์ Apps Script ที่นักพัฒนาแอปชื่นชอบคือคุณไม่จำเป็นต้องเขียนโค้ดการให้สิทธิ์ที่ให้สิทธิ์โปรแกรมเข้าถึงข้อมูลของผู้ใช้ แม้ว่า Apps Script จะจัดการเรื่องนี้ แต่ผู้ใช้แอปของคุณยังคงต้องให้สิทธิ์แก่สคริปต์เพื่อเข้าถึงสเปรดชีตและส่งอีเมลผ่าน Gmail กล่องโต้ตอบการให้สิทธิ์แรกจะมีลักษณะดังนี้

ba6e1a798e404e0d.png

คลิกตรวจสอบสิทธิ์เพื่อดำเนินการต่อ

จากนั้นคุณจะเห็นกล่องโต้ตอบ OAuth2 ที่ขอสิทธิ์เข้าถึงชีตและส่งอีเมลในนามของคุณ

9bed7ef1ccbd7569.png

หลังจากให้สิทธิ์แล้ว สคริปต์จะทำงานจนเสร็จสมบูรณ์

ตรวจสอบบัญชีอีเมลที่คุณส่งข้อความ แล้วคุณจะเห็นอีเมลที่มี "Map" เป็นหัวเรื่องและข้อความที่มีลักษณะดังนี้

51f61fc51a13d28f.png

เมื่อเปิดไฟล์แนบในข้อความอีเมล คุณควรเห็น Google Maps ที่มีหมุดปักอยู่ที่ที่อยู่ที่คุณป้อนในชีต

739bb45b75e3f7c7.png

คุณเข้าถึงผลิตภัณฑ์ต่างๆ ของ Google 3 รายการได้อย่างมีประสิทธิภาพด้วยโค้ดเพียง 4 บรรทัด

7. แหล่งข้อมูลเพิ่มเติม

โค้ดที่แสดงใน Codelab นี้ยังพร้อมให้บริการในที่เก็บ GitHub ที่ github.com/googleworkspace/apps-script-intro-codelab ด้านล่างนี้คือแหล่งข้อมูลเพิ่มเติมที่จะช่วยให้คุณเจาะลึกเนื้อหาที่ครอบคลุมใน Codelab นี้ และสำรวจวิธีอื่นๆ ในการเข้าถึงโปรแกรมเครื่องมือสำหรับนักพัฒนาแอปของ Google โดยใช้โปรแกรม

เอกสารประกอบ

วิดีโอ

ข่าวสารและข้อมูลอัปเดต

Codelab อื่นๆ

ระดับเริ่มต้น

ระดับกลาง

แอปพลิเคชันอ้างอิง