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