web analytics

Flutter : รู้จักกับ Sentry เครื่องมือสำหรับรายงาน Error ในแอป

cover

 

สวัสดีผู้อ่านครับ ช่วงนี้ผมก็หาอะไรเล่นไปเรื่อยๆ ไปเจอในเว็บ Flutter ที่แนะนำเรื่อง Crash Reporting โดยใช้เครื่องมือที่ชื่อว่า Sentry นั่นก็เพราะว่า Sentry ได้ทำ library สำหรับ Flutter สำหรับผู้ที่ไม่ทราบว่า Crash Reporting  คืออะไร มันก็คือการรายงาน error ของแอปจากเครื่องผู้ใช้ไปที่เว็บ เพื่อให้เราตรวจสอบและแก้ไขปัญหาได้ทันที เพราะว่าเราคงไม่สามารถเดินไปหาผู้ใช้แอปแล้วขอมือถือมาแก้ error ได้แน่ๆ ดังนั้นเลยมีผู้ให้บริการหลายเจ้าพัฒนาเครื่องมือมาเพื่อช่วยแก้ปัญหา ซึ่งเจ้าดังๆที่ผมเคยใช้ก็มี Crashlytic (ตอนนี้ถูก Google ซื้อไปรวมกับ Firebase) ส่วน Sentry ผมก็เพิ่งเคยได้ยิน วันนี้เลยถือโอกาสลองใช้งานกันครับ

 

เริ่มต้น

สม้ครใช้งาน https://sentry.io/ จากนั้นก็ sign in
แล้วก็สร้าง project

1

 

แล้วเราก็จะได้โค้ด DSN เอาไว้ระบุตัวตนของแอปเรา

2a

 

 

การใช้งาน Sentry ใน Flutter

เพิ่ม dependencies ใน pubspec.yaml

 

import sentry เข้ามาที่ main.dart หรือไฟล์ที่ต้องการ Crash reporting

 

ประกาศ SentryClient พร้อมกับระบุ DSN ของเราให้มัน

 

ทดลองทำหน้าจอ เมื่อกดปุ่มแล้วจะส่ง error ไปที่ Sentry

8

 

การดูรายงาน

เสร็จแล้วไปที่เว็บ sentry ที่เมนู Issues ก็จะมี error ของเราปรากฏ

4

 

อันไหนเราแก้ไขแล้วก็ติ๊ก แล้วกดที่ Resolve ได้เลย

6

 

 แยก DebugMode กับ Production

เราคงไม่อยากให้ ระหว่างที่เรา debug แล้วเกิด error แอปส่ง report ไปที่ sentry ปนกับของ Production
ดังนั้นเราควรแยกให้ debugMode แค่ print log ก็พอ

สร้าง method สำหรับเช็คว่าเป็น DebugMode หรือไม่
กรณี Production ให้ comment บรรทัด assert ออก

 

 

เขียน method สำหรับส่ง report error เพื่อให้ใช้งานง่ายขึ้น

 

method ตอนกดปุ่มของเราจะเหลือแค่นี้

 

ดัก Error จากทั้งแอป

การใช้ try catch ดักทีละเคสก็อาจจะเหนื่อยเกินไป เราสามารถใช้ Zone มาครอบแอปของเราได้ โดยเมื่อจุดใดๆในแอปของเรา เกิด error มันจะเข้า onError

 

ราคาค่าบริการของ Sentry

ดูราคาของ sentry ได้ที่ https://sentry.io/pricing/
หลักๆคือ Developer plan จะฟรี แต่รับ error ได้แค่ 5,000 event ต่อเดือน เก็บประวัติ 30 วัน

7