รู้จัก Firebase Extensions ตั้งแต่ Zero จนเป็น Hero

อีกหนึ่งบริการใหม่แกะกล่องจากงาน Firebase Summit 2019 ที่จะช่วยลดเวลาในการพัฒนาฟังก์ชันต่างๆ ที่เรามักจะต้องพัฒนาขึ้นมาใช้เองใน Firebase เช่น resize image, แปลภาษา, ทำ shorten url, ส่งอีเมล และอีกเพียบ โดยนักพัฒนาเพียงแค่ติดตั้ง extension ที่ต้องการ จากนั้นก็จะสามารถใช้งานฟังก์ชันได้ทันที

เบื้องหลังของ Firebase Extensions นั่นก็คือ Cloud Functions for Firebase ที่รันอยู่ในฝั่ง server ซึ่งรองรับ trigger จากบริการต่างๆใน Firebase, สามารถเชื่อมต่อบริการทั้ง GCP และ third-party หรือจะเรียกใช้งานผ่าน HTTP request ก็ได้

วันนี้มี Extension อะไรบ้าง

จากข้อมูลที่ทีม Firebase ได้รับ ทำให้ทราบว่าฟังก์ชันที่นักพัฒนามักจะเสียเวลาและต้องลงแรงพัฒนาขึ้นมาเองมีฟังก์ชันอะไรบ้าง จึงเป็นที่มาของทั้ง 9 Extensions ด้านล่างนี้นั่นเอง

การติดตั้ง Extension จะสามารถทำได้ 2 วิธี

1. วิธีติดตั้ง Extension ผ่าน Firebase Console
2. วิธีติดตั้ง Extension ผ่าน Firebase CLI

ก่อนจะไปลุยกันต่อ ให้เราเข้าไปเลือก extension ที่สนใจจากลิงค์ด้านล่างนี้มาสักตัว

Firebase Extensions | Pre-packaged solutions that save you time

1. วิธีติดตั้ง Extension ผ่าน Firebase Console

ตัวอย่างในบทความนี้ผมจะเลือก Translate Text ซึ่งก่อนจะ Install ผมอยากแนะนำให้อ่านรายละเอียดก่อนทุกครั้ง

เมื่อเราคลิกลิงค์ See details เราจะพบหน้ารายละเอียดแบบนี้

เมื่อเราคลิกลิงค์ See details เราจะพบหน้ารายละเอียดแบบนี้

1.1 รายละเอียดต่างๆของ Extension

1. คำอธิบายการทำงานของ extension ตัวนี้ ซึ่งตัวอย่างนี้มันจะคอยเฝ้าดูว่ามีการส่งข้อความเข้ามาใหม่หรือมีการเปลี่ยนแปลงไหม ถ้ามีก็จะ detect ว่าภาษาต้นทางคืออะไรและนำไปแปลเป็นภาษาที่เรา config ไว้ และอัพเดทกลับไปที่ Cloud Firestore
2. แพลนของ Firebase ที่จะต้องเลือกใช้กับ extension ตัวนี้ ซึ่งตัวอย่างนี้ Translate Text จำเป็นต้องไปต่อ Google Translate API ในฝั่งของ GCP ซึ่งอาจมีค่าใช้จ่ายเกิดขึ้น จึงจำเป็นต้องใช้ Blaze plan
3. บริการของ Firebase ที่เกี่ยวข้องกับ extension ตัวนี้
4. Document และ Source code ของ extension ตัวนี้
5. มีอะไรที่ต้องเตรียมก่อนการติดตั้ง extension ตัวนี้ ซึ่งตัวอย่างนี้เราจะต้องมี database ใน Cloud Firestore แล้วอย่างน้อย 1 database
6. บริการอะไรบ้างที่อาจก่อให้เกิดค่าใช้จ่ายใน extension ตัวนี้
7. สามารถตั้งค่าอะไรให้กับ extension ตัวนี้ได้บ้าง
8. extension ตัวนี้จะไปสร้างที่ไหน และการทำงานอย่างไร

1.2 ติดตั้ง Extension

หลังจากอ่านครบ และเตรียมความพร้อมแล้ว ก็ให้นับ 1 ถึง 3 ในใจแล้วกดปุ่ม Install ลงไปเบาๆ จะพบว่ามันจะพาไฟหน้า Firebase Console เพื่อให้เราเลือกโปรเจคที่ต้องการ ซึ่งเมื่อเลือกแล้วจะพบกับหน้าที่แสดงขั้นตอนให้เรารีวิวและตั้งค่า

ข้อ 1 และ 2 คือรีวิวว่าจะใช้ API อะไรบ้าง และต้องใช้ Firebase แพลนไหน ย้ำกันอีกครั้งเผื่อใครติดตั้งแบบไม่อ่านรายละเอียดก่อนหน้านี้

ข้อ 3 คือรีวิวว่าจะใช้สิทธิ์อะไรเพื่อการเข้าถึงบริการใน Firebase

ข้อ 4 คือการตั้งค่าให้กับ extension

สำหรับ extension ตัวนี้เราสามารถตั้งค่าได้ดังนี้

• Deployment location: ระบุ data center ที่ต้องการติดตั้ง extension
• Target languages: ระบุภาษาที่ต้องการให้แปลจาก ISO-639–1 codes โดยใช้ comma คั่น
• Collection path: ชื่อ collection ใน Cloud Firestore
• Input field name: ชื่อฟิลด์ที่จะเก็บข้อความต้นทางไว้
• Translation output field name: ชื่อฟิลด์ที่จะบรรจุผลลัพธ์จากการแปล

เมื่อตั้งค่าได้ตามใจปองแล้ว กดปุ่ม Install extension เลยดิ๊ รอรัยอะ

จากรูปซ้ายรอประมาณ 3–5 นาที แล้วจะเจอปุ่ม Get Started รูปขวา

เมื่อกดปุ่ม Get Started จะเจอหน้าแสดงวิธีให้เราทดสอบ นอกจากนี้เรายังสามารถแก้ไขค่า config ได้ตลอดเวลา และสามารถ Uninstall extension ตัวนี้ได้ทุกเมื่อ

อย่า Uninstall ฉันเลย T-T

และเบื้องหลังมันคือ Cloud Functions for Firebase จริงๆด้วย ดังนั้นจะ log หรือ usage ก็สามารถมาดูได้ที่เมนู Functions ใน Firebase Console นะจ๊ะ

1.3 ทดสอบ Extension

เข้าไปใน Firebase Console แล้วเลือกเมนู Database เลือก Cloud Firestore สร้าง collection ชื่อ translations และมี document ที่บรรจุฟิลด์อย่างน้อย 1 ฟิลด์ชื่อ input และมีข้อความอยู่

ซึ่งหลังจากการแปล จะเอาผลลัพธ์ทั้งหมดมาเก็บไว้ใน field ชื่อ translated ไว้

นอกจากนี้หากเราแก้ไขประโยคที่อยู่ใน input มันก็จะไปแปลใหม่และกลับมาอัพเดทให้ที่ Cloud Firestore ด้วย

2. วิธีติดตั้ง Extension ผ่าน Firebase CLI

2.1 ติดตั้ง Firebase CLI เวอร์ชันล่าสัตว์

เราจะมั่นใจได้ว่าเรามี Firebase CLI และเป็นเวอร์ชันล่าสุดด้วยการ run คำสั่งด้านล่างนี้ใน Terminal หรือ Cmd

npm install -g firebase-tools

2.2 ติดตั้ง Extension

เริ่มจากเราต้องรู้ Project ID ที่ต้องการติดตั้ง extension ซะก่อน โดยให้ run คำสั่ง

firebase projects:list

เราจะพบ Project name และ Project ID ทั้งหมดของเรา ก็ให้เราเลือก Project ID ที่ชอบๆมาหนึ่ง ID

ถัดมาหากเราต้องการดูรายละเอียดของ extension ที่เราเลือก ให้ run คำสั่ง

firebase ext:info extension-name

extension-name หาได้จากด้านล่างในหน้ารายละเอียดของ extension ตัวนั้นๆ

คราวนี้ก็เริ่มติดตั้งได้ด้วยคำสั่ง

firebase ext:install extension-name --project=project-id

ซึ่งในระหว่างทางติดตั้งจะมีการขอสิทธิ์การเข้าถึง, เลือก location, ให้ระบุภาษาที่ต้องการแปล, ตั้งชื่อ collection, ตั้งชื่อ field ของข้อความที่ต้องการแปล, และชื่อ field ที่ต้องการให้เอาผลลัพธ์จากการแปลไปใส่

เมื่อระบุทุกอย่างเรียบร้อย ขั้นตอนการติดตั้งจะใช้เวลาประมาณ 3–5 นาที

เมื่อสำเร็จแล้ว จะมีรายละเอียดการทดสอบขึ้นมาให้ดูด้วย

ตรวจสอบกันสักหน่อยว่าสำเร็จจริงก็ให้เข้าไปที่ Firebase Console แล้วก็เลือกเมนู Extensions ด้านล่างสุด ก็จะพบว่ามี extension ของ Translate Text ได้ถูกติดตั้งเรียบร้อย

ส่วนขั้นตอนการทำสอบก็ทำแบบเดียวกับข้อ 1.3 ได้เลยครับ

Extensions ทุกตัวมี Source Code ให้นะ

บางครั้งนักพัฒนาก็อาจต้องการต่อยอดฟังก์ชันการทำงาน ของตัว extension นั้นๆ ให้ทำงานได้ตอบโจทย์แบบเฉพาะเจาะจงการใช้งานของตัวเองมากที่สุด รวมถึงทีม Firebase เองก็ต้องการให้บริการตัวนี้โปร่งใส่ ตรวจสอบได้ จึงเป็นที่มาให้ทีม Firebase เปิด source code ของ extensions ทุกตัว เพื่อให้นักพัฒนาสามารถเอาไปพัฒนาเพิ่มเติมและ deploy ผ่าน Cloud Functions for Firebase เองได้

firebase/extensions

ส่วนประกอบต่างๆของ Extension ในแต่โฟลเดอร์

• extension.yaml: เป็นไฟล์ที่รวมพวก metadata, Google APIs ที่ใช้ และสิทธิ์การเข้าถึงต่างๆ
• functions/: เป็นโฟลเดอร์ที่รวม source code ทั้งหมด
• README.md: ไฟล์รายละเอียดต่างๆของ extension
• PREINSTALL.md: ไฟล์ที่จะอธิบายการทำงานของ extension, สิ่งที่จำเป็นในการติดตั้งและการตั้งค่า
• POSTINSTALL.md: ไฟล์ที่จะอธิบายการใช้งาน extension

หมายเหตุ

1. การที่จะติดตั้งหรือบริการจัดการ Extension ได้ คุณจะได้มีสิทธิ์เป็น Owner ของโปรเจคเท่านั้น (Editor และ Viewer หมดสิทธิ์นาจา)
2. การใช้งาน Firebase Extensions จะฟรีหรือมีค่าใช้จ่ายนั้น จะขึ้นอยู่กับบริการที่เราไปเชื่อมต่อด้วยภายใน extension เช่น APIs ต่างๆใน GCP หรือการ request APIs ที่อยู่นอก Google
3. Extension แต่ละตัวจะ Install กี่ครั้งก็ได้ ซึ่งแต่ละครั้งเราสามารถตั้งค่าให้แตกต่างกันได้ โดยปลายทาง Firebase Extensions ก็จะไปสร้างฟังก์ชันใหม่ใน Cloud Functions for Firebase นั่นเอง
4. การบริหารจัดการผ่าน Firebase Console กับ Firebase CLI มีดังนี้

สรุป

Firebase Extensions เป็นบริการที่เข้ามาเติมเต็มการใช้งานบริการต่างๆใน Firebase ให้สมบูรณ์มากขึ้น ช่วยลดเวลาให้กับนักพัฒนาแทนที่จะต้องมาศึกษา พัฒนา และทดสอบเอง ที่สำคัญคือเราสามารถมั่นใจได้ว่า Extensions ทุกตัวที่มีให้เลือกใช้ ถูกพัฒนาและทดสอบโดยทีม Firebase ดังนั้นไม่ต้องห่วงเรื่องการ Scale และความปลอดภัย

ส่วนตัวผมคิดว่าบริการตัวนี้สามารถที่จะเปิดเป็น Marketplace ให้นักพัฒนาภายนอกเข้ามาพัฒนา Extensions เพื่อแบ่งปันหรือขายได้ในอนาคต แต่ ณ วันนี้บริการตัวนี้ยังอยู่ใน Beta และคิดว่าทีม Firebase คงต้องการควบคุมคุณภาพเองก่อน เอาเป็นว่าถ้ามีเปิดเมื่อไร ผมจะรีบมาบอกนักพัฒนาชาวไทยแน่นอน แล้วพบกันใหม่บทความหน้า #BetterTogether