Dale St. Marthe
ใช้แผงแอปพลิเคชันเพื่อตรวจสอบ แก้ไข และแก้ไขข้อบกพร่องในหลายๆ ด้านของเว็บแอป ซึ่งรวมถึงไฟล์ Manifest, Service Worker, พื้นที่เก็บข้อมูล และข้อมูลแคช
ภาพรวม
แผงแอปพลิเคชันแบ่งออกเป็น 4 ส่วนที่มีเมนูย่อย ส่วนและเมนูย่อยมีดังนี้
แอปพลิเคชัน: มีข้อมูลครอบคลุมเกี่ยวกับแอป รวมถึงไฟล์ Manifest, Service Worker และพื้นที่เก็บข้อมูล
- แท็บไฟล์ Manifest จะแสดงข้อมูลจาก
manifest.jsonในลักษณะที่ใช้งานง่าย นอกจากนี้ยังแสดงข้อผิดพลาดและคำเตือน (หากมี) ในส่วนที่เกี่ยวข้องด้วย - แท็บ Service Worker ช่วยให้คุณตรวจสอบและแก้ไขข้อบกพร่องของ Service Worker ได้โดยการจำลองเหตุการณ์ Push, อัปเดตบริการ และอื่นๆ
- แท็บพื้นที่เก็บข้อมูลมีแผนภูมิวงกลมที่แสดงการกระจายหน่วยความจำที่ใช้โดยที่เก็บข้อมูลแคช, IndexedDB และ Service Worker นอกจากนี้ คุณยังล้างข้อมูลเว็บไซต์และจำลองโควต้าพื้นที่เก็บข้อมูลที่กำหนดเองได้ด้วย
พื้นที่เก็บข้อมูล: ดูและแก้ไขวิธีการจัดเก็บข้อมูลต่างๆ ที่เว็บแอปใช้
- รายการพื้นที่เก็บข้อมูลในเครื่องและพื้นที่เก็บข้อมูลเซสชันช่วยให้คุณเลือกต้นทางและแก้ไขคู่คีย์-ค่าของวิธีการจัดเก็บที่เชื่อมโยงได้
- รายการ IndexedDB มีฐานข้อมูลและช่วยให้คุณตรวจสอบที่เก็บออบเจ็กต์จากเบราว์เซอร์ได้
- รายการคุกกี้ช่วยให้คุณเลือกต้นทางและแก้ไขคู่คีย์-ค่าได้
- โทเค็นสถานะส่วนตัวและกลุ่มความสนใจช่วยให้คุณตรวจสอบโทเค็นและกลุ่มที่เกี่ยวข้องได้ (หากมี)
- รายการพื้นที่เก็บข้อมูลที่ใช้ร่วมกันช่วยให้คุณเลือกต้นทาง รวมถึงตรวจสอบและแก้ไขคู่คีย์-ค่าที่เชื่อมโยงได้
- รายการที่เก็บแคชประกอบด้วยแคชที่พร้อมใช้งาน และช่วยให้คุณตรวจสอบ กรอง และลบทรัพยากรของแคชได้
บริการที่ทำงานอยู่เบื้องหลัง: ตรวจสอบ ทดสอบ และแก้ไขข้อบกพร่องของบริการที่ทำงานอยู่เบื้องหลัง
- แท็บ Back-Forward Cache ช่วยให้คุณเรียกใช้การทดสอบใน Back-Forward Cache ในเบราว์เซอร์ได้ นอกจากนี้ยังรายงานปัญหาที่อาจป้องกันการแคชย้อนหลัง/ไปข้างหน้าด้วย
- แท็บการดึงข้อมูลในเบื้องหลังช่วยให้คุณบันทึกกิจกรรมจาก Background Fetch API ได้นานสูงสุด 3 วัน
- แท็บการซิงค์ในเบื้องหลังช่วยให้คุณบันทึกกิจกรรมจาก Background Sync API ได้นานสูงสุด 3 วัน
- แท็บการลดการติดตามการเข้าออกช่วยให้คุณระบุและลบสถานะของเว็บไซต์ที่ดูเหมือนจะทำการติดตามข้ามเว็บไซต์โดยใช้เทคนิคการติดตามการเข้าออกได้
- แท็บการแจ้งเตือนช่วยให้คุณบันทึกข้อความพุชได้นานสูงสุด 3 วัน
- แท็บตัวแฮนเดิลการชำระเงินช่วยให้คุณบันทึกเหตุการณ์ตัวแฮนเดิลการชำระเงินได้นานสูงสุด 3 วัน
- แท็บการซิงค์ในเบื้องหลังตามระยะเวลาช่วยให้คุณบันทึกเหตุการณ์สำคัญได้นานสูงสุด 3 วันในวงจรการซิงค์ในเบื้องหลังตามระยะเวลา เช่น การลงทะเบียนเพื่อซิงค์ การซิงค์ในเบื้องหลัง และการยกเลิกการลงทะเบียน
- แท็บการโหลดแบบคาดเดาช่วยให้คุณแก้ไขข้อบกพร่องของการโหลดแบบคาดเดาได้ โดยจะแสดงสถานะการคาดการณ์ ชุดกฎ และความพยายามในการโหลดแบบคาดเดา
- แท็บการรับส่งข้อความพุชช่วยให้คุณบันทึกข้อความพุชได้นานสูงสุด 3 วันและบันทึกข้อความเหล่านั้น
- แท็บ Reporting API จะตรวจสอบเว็บไซต์และรายงานการเรียก API ที่เลิกใช้งานแล้วและการละเมิดด้านความปลอดภัย
- แท็บเซสชันที่ผูกกับอุปกรณ์ช่วยให้คุณดูข้อมูลเกี่ยวกับเซสชันที่ผูกกับอุปกรณ์และตรวจสอบเหตุการณ์ที่เกี่ยวข้องได้
เฟรม: แบ่งหน้าและทรัพยากรออกเป็นหลายมุมมอง และแสดงข้อมูลที่เกี่ยวข้อง เช่น ความปลอดภัยและการแยก นโยบายรักษาความปลอดภัยเนื้อหา ความพร้อมใช้งานของ API และอื่นๆ
เปิดแผงแอปพลิเคชัน
วิธีเปิดแผงแอปพลิเคชัน
- เปิดเครื่องมือสำหรับนักพัฒนาเว็บ
- เปิดเมนูคำสั่งโดยกดปุ่มต่อไปนี้
- macOS: Command+Shift+P
- Windows, Linux, ChromeOS: Control+Shift+P
- เริ่มพิมพ์
applicationเลือกแสดงแอปพลิเคชัน แล้วกด Enter เครื่องมือสำหรับนักพัฒนาเว็บจะแสดงแผงแอปพลิเคชันที่ด้านบนของหน้าต่างเครื่องมือสำหรับนักพัฒนาเว็บ
หรือคุณจะเปิดแผงแอปพลิเคชันได้ด้วยวิธีต่อไปนี้
- ในแถบการดำเนินการที่ด้านบน ให้คลิก แผงเพิ่มเติม แล้วเลือกแอปพลิเคชันจากรายการแบบเลื่อนลง
- ที่มุมขวาบน ให้เลือก ตัวเลือกเพิ่มเติม > เครื่องมือเพิ่มเติม > แอปพลิเคชัน