วิธีการบันทึก browser log (HAR file และ Console log)
- Pawarat Kitmanomai
ในกรณีที่พบปัญหาในการใช้งานซอฟต์แวร์ประเภท Software-as-a-Service (SaaS) ผ่านเว็บเบราว์เซอร์ การเก็บข้อมูล browser log เป็นอีกหนึ่งวิธีสำคัญที่ช่วยให้วิศวกรมีข้อมูลสำหรับวิเคราะห์ปัญหาได้ดียิ่งขึ้นนอกเหนือจากการถ่ายภาพหน้าจอหรือคลิปวิดีโอ ซึ่ง Browser log ในที่นี้จะประกอบด้วย HAR file และ console log
ไฟล์ HAR (HTTP Archive) เป็นไฟล์ที่บันทึกรายละเอียดการส่งข้อมูลผ่านโปรโตคอล HTTP ซึ่งประกอบด้วย request URL, HTTP method, headers, parameters, request body, respond status code รวมถึงข้อมูลอื่นๆ ที่สามารถใช้ตรวจสอบความผิดพลาดในการเชื่อมต่อระหว่างเว็บเบราว์เซอร์และเซิร์ฟเวอร์ได้
Console log คือ log จากการทำงานของ JavaScript เช่น warning, error, และ debug message โดยข้อมูลใน console log สามารถใช้ตรวจสอบข้อผิดพลาด, และติดตามการทำงานของเว็บแอปพลิเคชันได้
Instructions
ขั้นตอนต่อไปนี้แสดงวิธีการบันทึก HAR file และ Console log จากเว็บเบราว์เซอร์ (ในตัวอย่างคือ Google Chrome)
Browser อื่นๆ ไม่ว่าจะเป็น Mozilla Firefox, Microsoft Edge, Apple Safari ก็มีขั้นตอนในการบันทึกคล้ายคลึงกัน โดยอาจมีความแตกต่างเล็กน้อยในการเรียกแสดงเมนู Developer tool
.ให้คลิกปุ่มเมนู [ ⋮ ] ใน tab ของ browser เลือก More tools → Developer Tools
จะมีหน้าต่าง Developer Tools จะเปิดขึ้นเป็นแถบด้านข้างหรือด้านล่างของ browser ให้คลิกที่แท็บ Network เลือก check Preserve log
ให้สังเกตุว่าวงกลมที่มุมซ้ายบนของแท็บ Network แสดงเป็น สีแดง หมายถึง การบันทึก log กำลังทำงาน หากวงกลมแสดงสีอื่น ให้คลิกที่วงกลมให้เปลี่ยนเป็นสีแดงเพื่อให้เริ่มบันทึก log
หลังจากเปิดการบันทึก log แล้ว ให้ดำเนินการ จำลองให้เกิดปัญหา ที่พบอีกครั้ง
หลังจากที่จำลองการเกิดปัญหาจนจบกระบวนการ ให้คลิกที่ไอคอน download เพื่อ Export HAR file บันทึกลงบนเครื่อง
เลือกแท็บ Console คลิกขวาที่ใดก็ได้ในคอนโซลและเลือก Save as... เพื่อบันทึก Console log ลงบนเครื่อง
