เป็นไปได้ไหมที่จะเปิดคอนโซลเครื่องมือสำหรับนักพัฒนาซอฟต์แวร์ใน Chrome บนโทรศัพท์ Android?


165

แอปพลิเคชัน AngularJS ทำงานได้ดีบนเดสก์ท็อป แต่แสดงผลไม่ถูกต้องบนมือถือ (รหัสจริงกำลังแสดง) นี่เป็นโทรศัพท์ Android

ฉันต้องการดูข้อผิดพลาดที่แสดงในคอนโซล

เป็นไปได้ไหมที่จะเปิดคอนโซล JS บนแอป chrome บนมือถือ (เหมือนบนเดสก์ท็อป)?

คำตอบ:


134

คุณสามารถทำได้โดยใช้การแก้จุดบกพร่องระยะไกลที่นี่เป็นเอกสารอย่างเป็นทางการ กระบวนการพื้นฐาน:

  1. เชื่อมต่ออุปกรณ์ Android ของคุณ
  2. เลือกอุปกรณ์ของคุณ: เครื่องมือเพิ่มเติม> ตรวจสอบอุปกรณ์*จากเครื่องมือ dev บนพีซี / mac
  3. อนุญาตบนมือถือของคุณ
  4. การแก้ไขข้อบกพร่องที่มีความสุข !!

* นี่คือตอนนี้ "อุปกรณ์ระยะไกล"


2
ฉันคิดว่าคำอธิบายโดยละเอียดมีอยู่ในลิงค์เอกสาร
PseudoAj

59
สิ่งนี้เป็นไปได้ไหมถ้าไม่มีคอมพิวเตอร์ภายนอก?
Eric Reed

59
คำถามถามถึงคอนโซลเครื่องมือสำหรับนักพัฒนาซอฟต์แวร์แบบเปิดใน Chrome บนโทรศัพท์ Android หรือไม่ soultion ของคุณต้องใช้เครื่องดีบั๊กแยกต่างหาก ในการแก้จุดบกพร่องคำตอบของคุณไม่ได้อยู่ในโทรศัพท์
Fennekin

5
ไม่มีวิธีอื่นที่ฉันรู้จัก @fennekin โปรดอัปเดตหากคุณคิดว่าจะมีวิธีที่ดีกว่า
PseudoAj

5
ตั้งแต่มกราคม 2019 ฉันไม่สามารถหาอุปกรณ์ตรวจสอบภายใต้เครื่องมืออื่น ๆ ได้ในที่สุดฉันก็พบมันที่ chrome: // ตรวจสอบและคุณต้องอนุญาตการดีบัก usb จากโทรศัพท์ของคุณ
Abhinav Singh

53

เมื่อคุณไม่มีพีซีในมือคุณสามารถใช้ Eruda ซึ่งเป็น devtools สำหรับเบราว์เซอร์มือถือhttps://github.com/liriliri/eruda
มันมีให้ในรูปแบบจาวาสคริปต์ที่สามารถฝังได้และ bookmarklet (การวาง bookmarklet ใน chrome จะลบ javascript: คำนำหน้าดังนั้นคุณต้องพิมพ์ด้วยตัวคุณเอง)


1
สหายที่ดีมากสำหรับเครื่องมือเช่น Termux ซึ่งทำให้การพัฒนาบนอุปกรณ์มือถือโดดเดี่ยวจริง! ฉันรวมeruda-webpack-pluginเข้ากับโครงการหนึ่งแล้ว: npm i eruba-webpack-plugin --save-optional.
vintproykt

วิธีที่ง่ายที่สุดในการรับสิ่งที่อยู่ในคอนโซล
makwana.a

ทางออกที่ดีเลิศ มันมีอยู่ใน CDN
netishix

ดูเหมือนจะไม่เหมาะกับฉัน การวางในแถบที่อยู่ (แล้วอ่าน 'javascript:') ดูเหมือนจะไม่ทำอะไรเลย
BT

@BT บางเว็บไซต์ จำกัด การโหลดสคริปต์จากโดเมนที่อนุญาตที่ระบุไว้ ลองในเว็บไซต์อื่น
trogper

10

ฉันต้องการเห็นสิ่งที่ถูกพิมพ์ในคอนโซลคุณสามารถเพิ่มส่วน "พิมพ์" ที่ไหนสักแห่งใน HTML ของคุณเพื่อที่มันจะปรากฏบนหน้าเว็บ คุณสามารถทำได้ด้วยตัวเอง แต่มีไฟล์จาวาสคริปต์ที่ใช้สำหรับคุณ คุณสามารถอ่านได้ที่นี่:

http://www.hnldesign.nl/work/code/mobileconsole-javascript-console-for-mobile-devices/

รหัสนี้มาจาก Github ; คุณสามารถดาวน์โหลดและวางลงในไฟล์ javascipt และเพิ่มลงใน HTML ของคุณ


FYI: คุณอาจพบสถานการณ์ที่คอนโซลจะไม่ปรากฏขึ้น บนพื้นฐานของการสนทนาบางในตอนท้ายของเว็บไซต์อย่างเป็นทางการของคุณสามารถลองอย่างชัดเจนmobileConsole.init()มัน เคล็ดลับนั้นช่วยในกรณีของฉัน YMMV
RayLuo

1
ลิงก์นั้นยังใช้งานได้มันใช้เวลาโหลดนาน อย่างไรก็ตามฉันสามารถสรุปได้ว่าการสนทนาระหว่างฉันกับเจ้าของ lib นั้นจบลงด้วยการเพิ่มข้อมูลต่อไปนี้ลงในส่วน Notes ในหน้าหลักของเขา: "ถ้า mobileConsole ไม่เริ่มทำงาน (การตรวจจับอุปกรณ์เคลื่อนที่ล้มเหลว) คุณสามารถแทนที่ autostart ได้ overrideAutorun เป็น true หรือเพิ่มสคริปต์ต่อไปนี้ในหน้าของคุณ: if (!mobileConsole.status.initialized) { mobileConsole.init(); } "
RayLuo

7

โปรดทำสิ่งที่คุณโปรดปรานและเพียงกดปุ่มง่าย ๆ :

ดาวน์โหลดWeb Inspector (Open Source)จาก Play store

CAVEAT: ATTOW, เอาท์พุทคอนโซลไม่ยอมรับ params ที่เหลือ! คือถ้าคุณมีอะไรเช่นนี้:

console.log('one', 'two', 'three');

คุณจะเห็นเท่านั้น

หนึ่ง

เข้าสู่คอนโซล คุณจะต้องห่อ params ใน Array และเข้าร่วมด้วยตนเองดังนี้:

console.log([ 'one', 'two', 'three' ].join(' '));

เพื่อดูผลลัพธ์ที่คาดหวัง

แต่แอพนี้เป็นโอเพ่นซอร์ส ! แพทช์อาจใกล้เข้ามา ! Patcher อาจเป็นคุณ!


3

Kiwi Browser เป็น Chromium สำหรับมือถือและอนุญาตให้ติดตั้งส่วนขยายได้ ติดตั้งกีวีแล้วติดตั้งส่วนขยาย Chrome "คอนโซลมินิ JS" (เพียงค้นหาใน Google และติดตั้งจากเว็บไซต์ส่วนขยายของ Chrome แล้ว uBlock ยังใช้งานได้) มันจะพร้อมใช้งานในเมนูกีวีที่ด้านล่างและจะแสดงเอาต์พุตคอนโซลสำหรับหน้าปัจจุบัน


-1

คุณอาจลองใช้ Gear Browser มันสามารถตรวจสอบองค์ประกอบและตรวจแก้จุดบกพร่องเว็บไซต์บนมือถือ

https://gear4.app


5
แอพนี้สำหรับ iPhone เท่านั้น คำถามที่ระบุ Android
Pete
โดยการใช้ไซต์ของเรา หมายความว่าคุณได้อ่านและทำความเข้าใจนโยบายคุกกี้และนโยบายความเป็นส่วนตัวของเราแล้ว
Licensed under cc by-sa 3.0 with attribution required.