Rumah  >  Artikel  >  hujung hadapan web  >  Apakah alat penyahpepijatan untuk javascript?

Apakah alat penyahpepijatan untuk javascript?

青灯夜游
青灯夜游asal
2022-09-20 15:43:082104semak imbas

Alat penyahpepijatan termasuk: 1. Alat pembangun penyemak imbas web, seperti menggunakan pernyataan konsol "console.log()", atau menggunakan pernyataan penyahpepijat untuk menjeda pelaksanaan kod; boleh Laraskan permintaan, menganalisis respons dan masalah nyahpepijat; 3. Sentry, yang boleh digunakan untuk memantau ralat dan mengekstrak semua maklumat yang diperlukan untuk melakukan tindakan pasca tindakan yang sesuai , yang boleh membantu pembangun menemui Kod mencari ralat yang salah dan menyelesaikannya.

Apakah alat penyahpepijatan untuk javascript?

Persekitaran pengendalian tutorial ini: sistem Windows 7, versi JavaScript 1.8.5, komputer Dell G3.

Kerentanan aplikasi, punca kebotakan untuk penyahpepijat bahagian hadapan. Jika anda telah bekerja pada bahagian hadapan, anda tahu betapa sukarnya untuk membetulkan kelemahan aplikasi.

Terutama apabila menggunakan JavaScript, ralat kecil kadangkala boleh mengambil masa berjam-jam untuk nyahpepijat. Walau bagaimanapun, kelemahan tidak dapat dielakkan merentas penyemak imbas, sistem pengendalian dan peranti.

Terdapat banyak alatan untuk pepijat, tetapi tidak setiap satu daripadanya boleh dipanggil "mimpi ngeri pepijat". Artikel ini akan memperkenalkan anda kepada pembantu kecil ini untuk menemui, mendiagnosis dan membaiki kelemahan.

Alat Pembangun Penyemak Imbas Web

Sebarang penyemak imbas web moden disertakan dengan alatan berkuasa untuk membantu anda nyahpepijat aplikasi anda. Ia boleh semudah pernyataan konsol menggunakan console.log(), tetingkap pop timbul menggunakan alert(), atau bahkan pernyataan penyahpepijat untuk menjeda pelaksanaan kod. Alat ini sangat berguna dalam tugas penyahpepijatan, terutamanya pernyataan penyahpepijat.

Anda juga boleh menggunakan pemeriksa rangkaian atau pemeriksa gaya CSS untuk menjadikan penyahpepijatan lebih mudah dan lancar. Anda hanya boleh mencari di Google untuk mengetahui lebih lanjut tentang alat pembangun penyemak imbas anda.

Posmen

Hampir semua aplikasi bahagian hadapan menghantar dan menerima respons dan permintaan JSON. Apl bersambung ke API yang boleh melakukan banyak perkara seperti pengesahan, pemindahan data pengguna dan juga perkara mudah seperti mendapatkan maklumat cuaca semasa untuk lokasi anda.

Posmen ialah salah satu alatan JS terbaik untuk menyahpepijat permintaan dan respons. Ia juga menyediakan perisian untuk sistem macOS, sistem Windows dan sistem Linux. Ia menjadikannya pantas dan mudah untuk menghantar permintaan REST, SOAP dan GraphQL secara langsung.

Menggunakan Posmen, anda boleh melaraskan permintaan, menganalisis respons dan membetulkan isu kerentanan. Ia berguna apabila anda tidak pasti sama ada masalahnya adalah di bahagian hadapan atau bahagian belakang.

sentry

Setelah apl dikeluarkan, ia akan tersedia pada pelbagai peranti yang dijalankan. Dalam mana-mana kitaran hayat pembangunan perisian, fasa ujian dilaksanakan sebagai proses standard. Fasa ini termasuk ujian unit, ujian sistem, ujian integrasi, dsb.

Walau bagaimanapun, sentiasa ada kemungkinan bahawa anda mungkin terlepas pandang pepijat dan membenarkannya meneruskan pengeluaran. Walaupun selepas dikeluarkan, anda tidak akan menyedari sebarang kelemahan yang masih ada tanpa sesiapa yang memberitahu anda. Pengguna akhir jarang melaporkan kelemahan melalui e-mel yang disediakan. Di sinilah Sentry berperanan.

Sistem pengelogan ralat berasaskan awan seperti Sentry boleh membantu anda mengelog kejadian ralat walaupun selepas dikeluarkan. Sentry menyediakan penyelesaian komprehensif merangkumi kebanyakan rangka kerja yang tersedia.

Bahasa dan rangka kerja yang sesuai untuk Sentry

BrowserStack

BrowserStack boleh bantu simulasi Konteks tepat di mana pengguna menghadapi ralat. Gabungan peranti, sistem pengendalian dan penyemak imbas yang berkuasa adalah satu kemestian mutlak. Anda boleh memanfaatkannya sepenuhnya dengan menggunakan alat pengelogan ralat seperti Sentry.

Apabila anda log pepijat, anda boleh menghasilkan semula senario yang tepat dengan merujuk persekitaran dan menciptanya semula dalam BrowserStack.

Mereka menawarkan harga yang lebih rendah untuk pekerja bebas dan lesen percuma untuk projek sumber terbuka.

JSHint

Ini ialah analisis kod statik yang mengesan ralat dan potensi isu dalam Alat kod JS yang boleh membantu pembangun mencari masalah yang sukar ditemui.

JSHint mengimbas atur cara yang ditulis dalam JavaScript dan melaporkan ralat biasa dan kemungkinan kelemahan, yang mungkin ralat sintaks, kelemahan yang disebabkan oleh penukaran jenis tersirat, pembolehubah bocor atau beberapa masalah lain.

Berikut ialah contoh fungsi yang saya gunakan untuk menonton JSHint run:

Firebug

Firebug ialah alat yang sangat berkuasa yang boleh membantu anda mencari ralat dalam kod anda dan menyelesaikannya.

Di sini kami menggunakan Firebug untuk mengendalikan kod Javascript.

Mula-mula kita perlu memuatkan halaman dan membuka Firebug.

Kadangkala anda perlu memuat semula halaman.

Bilangan ralat dalam bar status

Paparkan ralat pada halaman semasa

Tunjukkan butiran ralat

Kod nyahpepijat langkah demi langkah

Anda boleh melaksanakan kod langkah demi langkah. Ini sangat berguna untuk penyahpepijatan kod.

Gunakan penyahpepijatan titik putus

Penyahpepijat titik putus boleh menamatkan pelaksanaan kod Anda boleh melihat ralat dengan menentukan julat kod . Tidak dalam julat kod yang ditentukan. Ini berguna untuk penyahpepijatan ralat.

Jika anda mengklik butang "Step over", Firebug akan mengemas kini semua pembolehubah sehingga anda menamatkan pelaksanaan titik putus dalam tetingkap kanan.

Gunakan ungkapan untuk membuat titik putus berfungsi

Anda boleh menulis ungkapan yang akan menyebabkan titik putus berfungsi apabila keadaan benar Hentikan pelaksanaan kod.

Fiddler

Fiddler ialah pelayan proksi tempatan dan penyemak imbas perlu ditetapkan sebagai tempatan pelayan proksi Ia hanya boleh digunakan semasa melayari Internet Fiddler akan memantau semua permintaan pelayar dan mempunyai keupayaan untuk memasukkan data ke dalam permintaan pelayar.

Dalam proses pembangunan bahagian hadapan web, fiddler ialah alat nyahpepijat yang paling biasa digunakan. Dalam kebanyakan kes, fungsi menu lalai fiddler pada asasnya boleh memenuhi keperluan nyahpepijat pembangun Walau bagaimanapun, jika senario penyahpepijatan yang lebih kompleks perlu dipenuhi, keperluan penyahpepijatan pembangun tidak lagi boleh dipenuhi hanya melalui menu pemetik fiddler.

Jika pengguna perlu mengubah suai pengepala permintaan http atau mengubah suai pengepala respons permintaan http, satu-satunya cara ialah menetapkan titik putus Terdapat dua cara untuk menetapkan titik putus:

Cara pertama : Buka Fiddler dan klik Peraturan->Titik Putus Automatik ->Sebelum Permintaan (kaedah ini akan mengganggu semua sesi, klik Peraturan->Dilumpuhkan).

Kedua: Masukkan arahan dalam baris arahan: bpu http://www.qq.com Kaedah ini hanya akan mengganggu http://www.qq.com arahan bpu pada baris arahan.

Walau bagaimanapun, kedua-dua kaedah ini akan berhenti apabila program mencapai titik putus, dan anda perlu mengklik "Run to Completion" secara manual untuk memulakan semula, yang sangat menyusahkan. Selain itu, URI permintaan http tidak boleh diubah suai melalui fungsi menu fiddler. Pada masa ini, kelebihan Skrip Fiddler dicerminkan Intipati Skrip Fiddler sebenarnya ialah fail skrip CustomRules.js yang ditulis dalam bahasa JScript.NET Sintaks adalah serupa dengan C# Dengan mengubah suai CustomRules.js Permintaan dan Respons http, tanpa mengganggu program, juga boleh melakukan pemprosesan khas untuk URI yang berbeza Selain itu, menu boleh disesuaikan mengikut keperluan pembangun.

HttpWatch

HttpWatch ialah perisian komersial dan dibenamkan dalam penyemak imbas dalam bentuk pemalam. Ia hanyalah seorang profesional Web Sniffer .

[Cadangan berkaitan: tutorial video javascript, Video pengaturcaraan asas]

Atas ialah kandungan terperinci Apakah alat penyahpepijatan untuk javascript?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!

Kenyataan:
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn
Artikel sebelumnya:Adakah javascript bahasa sql?Artikel seterusnya:Adakah javascript bahasa sql?