Application Real-Time Monitoring Service：Diagnostik kesalahan JS

Portal

1. Masuk ke ARMS Console. Di panel navigasi sisi kiri, pilih Browser Monitoring > Browser Monitoring.

2. Di halaman Browser Monitoring, pilih wilayah di bilah navigasi atas dan klik nama aplikasi yang ingin dikelola.

3. Di halaman yang muncul, pilih Application > JS Error Diagnosis di panel navigasi sisi kiri.

   Di halaman JS error diagnosis, Anda dapat mengatur periode yang diperlukan di pojok kanan atas.

Lihat gambaran kesalahan aplikasi

Bidang Error Overview menampilkan statistik dan tren kesalahan JS dalam periode yang dipilih, termasuk metrik berikut:

• Errors: jumlah total kesalahan JS yang terjadi dalam periode yang dipilih.

• JS Error Rate: jumlah tampilan halaman (PV) dengan kesalahan JS dibandingkan dengan total PV dalam periode yang dipilih.

• Affected Users: jumlah dan persentase pengguna yang terkena dampak kesalahan JS.

Di bagian Error Overview, lakukan operasi berikut:

• Arahkan pointer ke kurva. Jumlah kesalahan, tingkat kesalahan, dan jumlah pengguna terdampak pada titik waktu yang sesuai dengan titik belok kurva akan muncul secara mengambang.

• Arahkan pointer ke titik belok kurva. Saat pointer berubah menjadi bentuk tangan, klik titik tersebut. Kotak dialog Exception Insight akan muncul. Untuk informasi lebih lanjut, lihat Lihat Wawasan Pengecualian.

• Di bagian kurva, tahan tombol kiri mouse, seret untuk memilih area, lalu perbesar untuk melihat bagian kurva yang dipilih. Klik Reset Zoom di pojok kanan atas untuk mengembalikan tampilan.

Lihat wawasan pengecualian

Di kotak dialog Exception Insight, informasi tentang kesalahan JS pada titik waktu tertentu ditampilkan, termasuk metrik berikut:

• Errors: Total kesalahan JS pada titik waktu tertentu.

• JS Error Rate: jumlah PV dengan kesalahan JS dibandingkan dengan total PV pada titik waktu tertentu.

• Affected Users: jumlah dan persentase pengguna yang terkena dampak kesalahan JS.

• Frequent Errors Top 5: 5 kesalahan JS yang paling sering terjadi pada titik waktu tertentu, termasuk informasi tentang kesalahan JS, jumlah kesalahan, dan jumlah pengguna terdampak yang ditangkap oleh ARMS.

• Page Error Rate Top 5: 5 halaman dengan tingkat kesalahan JS tertinggi pada titik waktu tertentu, termasuk nama halaman dengan kesalahan JS, tingkat kesalahan JS halaman, dan jumlah PV.

Di kotak dialog Exception Insight, Anda dapat melakukan operasi berikut:

• Klik tab Frequent Errors Top 5, lalu klik Diagnose di kolom Operation. Halaman JS error details akan muncul. Untuk informasi lebih lanjut, lihat Lihat Detail Kesalahan.

• Klik tab Page Error Rate Top 5. Di tab yang muncul, klik Analyze di kolom Operation yang sesuai dengan halaman yang ingin dilihat. Gambaran kesalahan halaman akan muncul.

Lihat halaman berdasarkan tingkat kesalahan

Di tab Page Ranked by Error Rate, halaman diurutkan berdasarkan tingkat kesalahan JS dalam periode yang dipilih secara menurun, termasuk metrik berikut:

• Page: halaman tempat kesalahan JS terjadi.

• Error Rate: jumlah PV dengan kesalahan JS di halaman dibandingkan dengan total PV dalam periode yang dipilih.

• Page View: jumlah tampilan halaman.

Klik Analyze di kolom Operation. Gambaran kesalahan halaman akan muncul.

Lihat kesalahan sering muncul

Di tab Frequent Errors, kesalahan JS diurutkan berdasarkan jumlah kemunculan dalam periode yang dipilih secara menurun, termasuk metrik berikut:

• Error Information: Informasi kesalahan JS yang ditangkap oleh ARMS.

• Page: Halaman tempat terjadinya kesalahan JS.

• Errors: jumlah kemunculan kesalahan JS.

• Affected Users: jumlah dan persentase pengguna yang terkena dampak kesalahan JS.

Klik Diagnose di kolom Operation untuk pergi ke tab Error Detail. Untuk informasi lebih lanjut, lihat Lihat Detail Kesalahan.

Lihat detail kesalahan

Informasi berikut ditampilkan di tab Error Detail:

• Summary

  • Name

  • Type

  • Date: waktu ketika kesalahan JS terdeteksi.

  • Device

  • OS

  • Browser

  • IP

  • Connection Type

  • Region

  • Line

  • Column

  • URL

  • File: jalur file tempat kesalahan JS terjadi.

  • App Version

• Stack Info: informasi terkait lokasi kesalahan JS.

• User Behavior Trace: jejak perilaku pengguna, digunakan untuk melacak balik kesalahan.

Di tab Error Detail, Anda dapat melakukan operasi berikut:

• Untuk menentukan lokasi tepat kesalahan JS, klik ikon segitiga di sisi kiri tumpukan di bagian Stack Info untuk menampilkan baris. Klik Choose Sourcemap. Di kotak dialog Sourcemap File, pilih file source map yang ada atau unggah file source map baru, lalu klik OK.

  

  ARMS menggunakan file source map untuk mengambil lokasi tepat kesalahan JS.

• Untuk melihat jejak perilaku pengguna, buka bagian Melacak Balik Perilaku Pengguna.

• Untuk melihat distribusi kesalahan JS, klik tab Error View.

Melacak balik perilaku pengguna

Di tab Error Detail, bagian User Behavior Trace menampilkan jejak perilaku pengguna untuk membantu melacak balik kesalahan.

Lihat distribusi kesalahan

Tab Error View dari halaman diagnosis kesalahan JS menampilkan distribusi kesalahan JS tertentu, termasuk metrik berikut:

• Time View: Hanya distribusi kesalahan spesifik halaman yang ditampilkan di bagian ini.

• Browser View

• OS View

• Device View

• Version View

• Geographical View: Statistik dikumpulkan berdasarkan provinsi, kotamadya, atau wilayah otonom di tab Tampilan Cina, dan berdasarkan negara atau wilayah di tab Tampilan Dunia.

Di tab Error View, Anda dapat melakukan operasi berikut:

• Di bagian Time View, gerakkan pointer ke peta distribusi untuk melihat jumlah kesalahan.

• Di Browser View, OS View, Device View, dan Version View, gerakkan pointer ke peta distribusi untuk melihat jumlah dan persentase kesalahan.

• Di tab China View atau World View di bagian Geographical View, klik panah di sebelah nama kolom Errors pada tabel di sebelah kanan untuk beralih antara urutan menaik dan menurun.

Tanya Jawab Umum

• Bagaimana cara mengaktifkan atau menonaktifkan pelacakan balik perilaku pengguna?

  Secara default, fitur ini diaktifkan. Untuk menonaktifkannya, tambahkan item konfigurasi SDK behavior: false ke config. Untuk informasi lebih lanjut tentang item konfigurasi SDK, lihat Referensi SDK.

• Setelah pelacakan balik perilaku pengguna diaktifkan, kesalahan di kode SDK ARMS bl.js alih-alih di kode sumber ditemukan berdasarkan informasi yang dicetak di console.log. Bagaimana cara menyelesaikan masalah ini?

  

  Alasannya adalah bahwa ARMS menulis ulang log dari objek console untuk memantau konten yang dicetak oleh konsol browser. Solusi:

  • Metode 1 (direkomendasikan): Atur blackboxing untuk browser Chrome.

    1. Buka browser Chrome, tekan Ctrl+Shift+I untuk mengakses panel alat pengembang, lalu klik ikon Pengaturan.

    2. Di panel navigasi sisi kiri panel Settings, klik Blackboxing. Di halaman yang muncul, klik Add pattern. Di bidang Pattern, masukkan /bl.*\.js$. Lalu, klik Add.

       

  • Metode 2: Gunakan item konfigurasi SDK behavior: false untuk menonaktifkan pelacakan balik perilaku pengguna.

    <script>
        ! (function ( c , b, d, a ) {
            c [a] || ( c[a] = {});
            c [a].config = {
                pid: "xxxxx",
                imgUrl: "https://arms-retcode.aliyuncs.com/r.png?",
                sendResource: true,
                enableLinkTrace: true,
                behavior: false
            };
            with(b) with(body) with(insertBefore(createElement("script"), firstChild)) setAttribute("crossorigin", "", src = d)
        })(window, document, "https://retcode.alicdn.com/retcode/bl.js", "__bl");
    </script>

  Setelah penanganan di atas, kesalahan di kode sumber dapat ditemukan berdasarkan informasi yang dicetak di console.log.