วิธีดีบักหน้าเว็บใน Chrome สำหรับ Android บนคอมพิวเตอร์
เบ็ดเตล็ด / / December 02, 2021
หากเป็นหน้าบนคอมพิวเตอร์ หน้าหนึ่งสามารถแก้ไขข้อบกพร่องได้อย่างง่ายดายโดยใช้ตัวเลือกจากเมนูบริบทคลิกขวาของ Chrome แต่นั่นไม่ใช่ตัวเลือกของหน้าต่างๆ บนมือถือ ดังนั้น วันนี้ผมจะแสดงให้คุณเห็นถึงวิธีแก้ไขข้อบกพร่อง เว็บเพจมือถือ บนคอมพิวเตอร์ของคุณโดยใช้ Chrome สำหรับ Android และ Android SDK
การดีบักหน้าเว็บ
ขั้นตอนที่ 1: ดาวน์โหลดและติดตั้ง Android SDK บนคอมพิวเตอร์ของคุณและเรียกใช้ โปรแกรมติดตั้งจะขอให้คุณดาวน์โหลด Java หากคุณยังไม่ได้ติดตั้ง
เป็นครั้งแรกที่คุณเรียกใช้ Android SDK บนคอมพิวเตอร์ของคุณ ระบบจะขอให้คุณดาวน์โหลด API และเครื่องมือต่างๆ หากจุดประสงค์เดียวของคุณในการติดตั้ง Android SDK คือการดีบักหน้า ให้ยกเลิกการเลือกทุกอย่างยกเว้น
เครื่องมือแพลตฟอร์ม Android SDK และคลิก ติดตั้งแพ็คเกจ ปุ่ม.![Android Sdk](/f/74a1883ec05811f42a9b825d6303afed.png)
ขั้นตอนที่ 2: หลังจากติดตั้งเครื่องมือแพลตฟอร์ม Android แล้ว ให้เปิด กล่องรัน (Windows+R) และวิ่ง %userprofile%\AppData\Local\Android\android-sdk\platform-tools เพื่อเปิดไดเร็กทอรีเครื่องมือแพลตฟอร์ม Android
![เรียกใช้คำสั่ง](/f/7e942104c8171b6868baf98310bebc2a.png)
ขั้นตอนที่ 3: ตอนนี้กดแป้น Ctrl+Shift ค้างไว้แล้วคลิกขวาในโฟลเดอร์เพื่อเปิดพรอมต์คำสั่งที่นั่น คุณยังสามารถเปิดพรอมต์คำสั่งโดยใช้กล่องเรียกใช้และไปที่โฟลเดอร์ด้วยตนเอง
![คำสั่งคำสั่ง](/f/b089652c3f2e708f13453547bfbc7742.png)
ขั้นตอนที่ 4: เมื่อทำเสร็จแล้ว เปิด Chrome บนโทรศัพท์ Android ของคุณ เปิด การตั้งค่า—>เครื่องมือสำหรับนักพัฒนา และตรวจสอบตัวเลือกเปิดใช้งานการดีบักเว็บ USB
![การดีบัก USB Chrome](/f/7495cb509991b51d4665b526c610a7cc.png)
ขั้นตอนที่ 5: ตอนนี้บนพรอมต์คำสั่งให้เรียกใช้คำสั่ง adb forward tcp: 9222 localabstract: chrome_devtools_remote และเปิดเบราว์เซอร์ Chrome บน Windows เมื่อดำเนินการสำเร็จ
ขั้นตอนที่ 6: เปิดหน้าที่คุณต้องการแก้ไขข้อบกพร่องบนเบราว์เซอร์ Chrome ของ Android แล้วเปิด URL localhost: 9222 บนเบราว์เซอร์ Chrome ของคอมพิวเตอร์ของคุณ
![การคัดเลือก](/f/f6d4eb45f04f0319744ea921ac694028.png)
เพียงเท่านี้ คุณจะเห็นหน้าทั้งหมดที่เปิดอยู่บนเบราว์เซอร์ Android ของคุณเป็นรูปขนาดย่อในคอมพิวเตอร์ของคุณ หากต้องการเปิดหน้าแก้ไขข้อบกพร่อง เพียงคลิกที่ภาพขนาดย่อของเว็บไซต์ที่เกี่ยวข้อง คุณจะสามารถติดตามการเปลี่ยนแปลงการดีบักที่คุณทำบนคอมพิวเตอร์ของคุณโดยตรงบน Android แบบเรียลไทม์
บทสรุป
ฉันแน่ใจว่าเคล็ดลับนี้จะช่วยให้นักพัฒนาเว็บจำนวนมากเพิ่มประสิทธิภาพหน้าเว็บสำหรับสมาร์ทโฟนได้ ฉันได้ใช้เคล็ดลับในการกำหนดค่าหน้าเว็บของฉันและมันได้ผลอย่างมีเสน่ห์ อย่างไรก็ตาม หากคุณรู้วิธีที่ดีกว่าในการดีบักหน้าเว็บของสมาร์ทโฟนบนคอมพิวเตอร์ โปรดแชร์กับเรา