เครื่องมือพัฒนา Chrome: [VM] ไฟล์จากจาวาสคริปต์

139

ฉันเพิ่มเบรกพอยต์ในไฟล์ javascript ของฉัน (jaydata.js) และได้กด "ก้าวข้ามการเรียกใช้ฟังก์ชันถัดไป" เมื่อมันมาถึงสายที่:

},

ไฟล์อื่นชื่อ "[VM] (8312)" โผล่ขึ้นมา ฉันยังคงคลิก "ก้าวข้ามการเรียกใช้ฟังก์ชันถัดไป" และตอนนี้หน้าจอของฉันคือ:

ป้อนคำอธิบายรูปภาพที่นี่

สคริปต์ที่แปลกและลึกลับเหล่านี้มีชื่อว่า "[VM] (XXXX") และมาจากที่ใด

debugging google-chrome-devtools

— AllieCat
แหล่งที่มา

1

ไฟล์ VM เหล่านี้จะปรากฏขึ้นเมื่อคุณแก้ไขไฟล์ซึ่งกำลังดีบั๊กในเวลาเดียวกัน Chrome สูญเสียการซิงก์และเมื่อจุดพักถูกวางไว้บนไฟล์มันจะหยุดโค้ดที่ตำแหน่งอื่น ๆ ในไฟล์ในหน่วยความจำที่ใดที่หนึ่ง เช่น test.html จะอนุญาตจุดพัก แต่เมื่อ Chrome หยุดให้ทำเช่นนั้นที่ VM99: test.html ที่ตำแหน่งอื่น วิธีแก้ปัญหาคือปิด Chrome เปลี่ยนชื่อไฟล์เช่น test2.html แล้วเริ่มใหม่อีกครั้ง (การล้างประวัติแคช ฯลฯ ไม่ทำงานและ Chrome จะทำการโหลด VM99: test.html ต่อไปหากคุณลองทำเช่นนี้

— QuentinUK

112

[VM] (scriptId)ไม่มีความหมายพิเศษ เป็นชื่อจำลองเพื่อช่วยให้เราสามารถแยกรหัสซึ่งไม่ได้ผูกกับชื่อไฟล์โดยตรงเช่นรหัสที่สร้างโดยใช้evalและเพื่อน ๆ

ในอดีตสคริปต์เหล่านี้ทั้งหมดมีเพียงป้ายกำกับ (program)ในอดีตที่ผ่านมาทั้งหมดของสคริปต์เหล่านี้ถูกระบุเพียง

หากคุณสนใจเพียงแค่ค้นหา"[VM]"ในซอร์สโค้ดของ Chromiumคุณจะพบว่าตัวเลขเหล่านี้ไม่มีความหมายที่สำคัญนอกเครื่องมือนักพัฒนาซอฟต์แวร์

อัพเดท 2015-06-25

[VM] (scriptId)ถูกเปลี่ยนชื่อไปVMscriptId เมื่อครู่ก่อนและนี่คือลิงก์โดยตรงไปยังผลการค้นหาในกรณีที่ค่าเปลี่ยนแปลงอีกครั้ง

— Rob W
แหล่งที่มา

1

Chrome จะกดไฟล์ [VM] แทนไฟล์ live js หรือไม่ ถ้าเป็นเช่นนั้นทำไม

— Matt

@Matt คุณหมายความว่าอย่างไร "กดไฟล์ [VM] แทนไฟล์ live js"

— Rob W

@RobW ไม่สนใจ; เบราว์เซอร์ของฉันกำลังแคชไฟล์ js (แม้จะมีการอัปเดตแคชบัสเตอร์ของฉัน)

— แมตต์

1

[VM] (scriptId)ถูกเปลี่ยนชื่อVMscriptId เป็นเมื่อครู่ก่อนแต่ฉันได้เก็บคำตอบไว้ในสถานะปัจจุบันเพื่อไม่ทำให้คำถามเป็นโมฆะ ลิงค์ codesearch ล่าสุดคือ: cs.chromium.org/%22VM%5C%22%20+%22 (ลิงก์โดยตรงไปยังผลการค้นหาในกรณีที่ค่าเปลี่ยนแปลงอีกครั้ง: chromium.googlesource.com/chromium/blink/+/ )

— Rob W

ฉันเพิ่งพบปัญหานี้โดยไม่มีหลักฐานใด ๆ - ดูเหมือนว่าจะเกี่ยวข้องกับการใช้ iFrames หลักฐานของฉันคือเมื่อฉันตั้งเบรกพอยต์ในรหัสใน iFrame ฉันจะได้รับปัญหา [VM] แต่เมื่อฉันเปิด iFrame ในหน้าต่างของตัวเองฉันก็จะถึงจุดพักได้ดี เพียงแค่แน่ใจว่าสิ่งนี้มีคุณสมบัติเป็นหนึ่งใน "เพื่อน" ของ eval ตามที่อธิบายไว้ในคำตอบ

— อันตราย

42

เมื่อใดก็ตามที่คุณโหลดเนื้อหา HTML ผ่าน AJAX และเนื้อหานั้นมี<script>แท็กสคริปต์จะถูกประเมินโดยใช้ eval () และรับรู้โดยมุมมองแหล่งที่มาของ Chrome ว่าเป็นไฟล์ใหม่ที่เริ่มต้นด้วย 'VM' คุณสามารถไปที่แท็บเครือข่ายค้นหาคำขอ AJAX และดูการตอบกลับ HTML อย่างครบถ้วนรวมถึงสคริปต์ของคุณ

— แซมคอฟฟ์แมน
แหล่งที่มา

3

วิธีนี้ใช้สำหรับการดีบัก ถ้าฉันใช้แท็กสคริปต์ด้วยsrc=/test.jsแล้วทำให้เกิดข้อผิดพลาดที่ติดตามกลับไปที่ test.js การติดตามกลับมีชื่อไฟล์ที่ถูกต้อง แต่หลังจากนั้น stacktraces มีเวทมนต์ของ VM สิ่งนี้ทำให้เป็นไปไม่ได้ที่จะได้รับซอร์สโค้ด [จากแหล่งกำเนิดเดียวกัน] สำหรับไฟล์ในสแต็กเทรซมากกว่าหนึ่งครั้งและคุณไม่สามารถแคชได้เนื่องจากคุณไม่รู้ว่าไฟล์ใดที่อยู่ในสแต็คในอนาคต นี่คือการแก้ไขในเครื่องมือ Dev แต่ไม่ได้อยู่ใน webapps

— Carl Smith

นี่อาจเป็นสาเหตุที่พบบ่อยที่สุดที่เกิดขึ้นในเว็บแอปพลิเคชั่นที่ทันสมัยและอีกตัวอย่างที่ดีว่าทำไมเราควรแยกโค้ดออกจากเนื้อหา

— alexw

37

เมื่อใช้ eval จาวาสคริปต์จะถูกโยนลงใน Chrome Debugger VM ในการดู js ที่สร้างขึ้นด้วย eval ภายใต้ Chrome Debugger Sources ให้ตั้งค่าแอตทริบิวต์นี้ที่ส่วนท้าย (ขอบคุณ Splaktar) ของ js:

//@ sourceURL=dynamicScript.js

เป็นไปได้หรือไม่ที่จะดีบักการโหลด JavaScript แบบไดนามิกโดยเครื่องมือดีบั๊กบางตัวเช่น WebKit, FireBug หรือ IE8

— มีมลทิน
แหล่งที่มา

9

ไวยากรณ์มีการเปลี่ยนแปลงแล้วในตอนนี้: // # sourceURL = dynamicScript.js

— ThiagoPonte

1

มันควรจะอยู่ที่ส่วนท้ายของ JavaScript ไม่ใช่จุดเริ่มต้น

— Splaktar

เคยมองหาบางสิ่งเช่นนี้ ขอบคุณ

— David Kierans

ขอบคุณ! มันมีประโยชน์มาก!

— Eve juan

4

สำหรับเครื่องมือดีบั๊ก Firefox กล่าวว่าUsing //@ to indicate sourceURL pragmas is deprecated. Use //# instead

— Nighto

6

หากคุณต้องการดีบักไฟล์ JS แบบฉีดโดยใช้โปรแกรมในโครเมี่ยมคุณสามารถใช้ debugger;คำสั่งได้เร็วกว่าการค้นหาว่าสคริปต์ของคุณอยู่ที่ไหนและเร็วกว่าการสร้างไฟล์ด้วยsourceurl sourceurl

มันทำงานเหมือนเบรกพอยต์และระบุรหัสของคุณโดยอัตโนมัติในแท็บแหล่งโครเมี่ยมทุกที่ที่คุณใช้debugger;คำสั่ง

โปรดทราบว่าแหล่งที่มาของสคริปต์เป็นไฟล์ VMXXX

— Rodrirokr
แหล่งที่มา

สิ่งนี้ดูเหมือนจะไม่ตอบคำถาม

— Grant Miller

ไม่ดีของฉันฉันปล่อยให้ตัวเองไปโดยคำตอบอื่น ๆ สำหรับคำถามนี้

— Rodrirokr

1

Super! นี่คือสิ่งที่ฉันต้องการ ไม่จำเป็นต้องค้นหาว่า VM ใส่รหัสของคุณโดยเอ็นจิน JS

— Oleg Bolden

การเชื่อมต่อระหว่างคำตอบนี้กับคำถามคืออะไร

— Ravindra Thorat

ด้วยdebugger;คำสั่งที่เขาสามารถ demystify ที่ลึกลับ 'แปลกและลึกลับสคริปต์ชื่อ "[VM] (XXXX"' ลึกลับมาจากถ้าเขาต้องการเช่นนั้น

— Rodrirokr

4

ฉันพบว่า VM ได้รับการสร้างขึ้นจากส่วนขยาย Chrome บางส่วน - พวกเขาแทรก CSS / JS ลงในหน้าและ Chrome ใช้ไฟล์ VM เพื่อเรียกใช้

— เพียร์ส
แหล่งที่มา

0

เมื่อคุณทำการดีบั๊กหน้าต่างลูก (iframe) ซอร์สซึ่งต่อมาถูกยกเลิกการโหลดไฟล์ซอร์สของคุณจะได้รับคำนำหน้า VM และพื้นหลังสีเหลือง

— JosdeHa
แหล่งที่มา

0

ฉันพบปัญหาเดียวกัน ปัญหาคือรหัสของแอพของฉันถูกพิจารณาว่าเป็นกล่องดำโดยไม่ได้ตั้งใจ เมื่อฉันพยายามที่จะก้าวเข้าไปในรหัสมันยังคงเปิดVMXXXXแท็บเหล่านี้

หลังจากลบการตั้งค่า blackbox สำหรับไฟล์ js ของแอพของฉันฉันสามารถผ่านโค้ดของฉันได้

— Justin Noel
แหล่งที่มา

0

เพื่อป้องกันสิ่งนี้

(function ()
 {
  var originalEval = eval;
  eval =
   function (script)
   {
    return originalEval(script + "\n//# sourceURL=blackbox-this.js");
   }
 }());

และจากนั้น Blackbox ^.*blackbox-this.js$

เช่นเดียวกันสำหรับ setInterval / setTimeout เมื่อได้รับสตริง (แต่นั่นเป็นวิธีปฏิบัติที่ไม่ดีใช่ไหม?;)

มันเหมาะกับคุณหรือไม่?

— RahmanRezaee
แหล่งที่มา

-1

ฉันมีปัญหาเดียวกันเมื่อฉันทำการดีบั๊กแอปพลิเคชันเชิงมุมของฉัน การดูสคริปต์ VM จำนวนมากเกินไปซึ่งไม่สามารถทำ blackboxed ได้จริงใช้เวลานานในการดีบัก ฉันค่อนข้างเลือก mozilla / IE explorer เพื่อดีบัก

— Sameeksha Kumari
แหล่งที่มา