Menguji implementasi Crashlytics (Web)

Pilih platform: iOS+ Android Web Flutter Unity


Gunakan panduan ini jika Anda telah mengikuti panduan memulai, dan masih belum melihat error di dasbor Crashlytics.

Memaksa error untuk menguji implementasi Anda

  1. Tambahkan kode ke aplikasi yang dapat Anda gunakan untuk memaksa error pengujian.

    Tambahkan tombol pengujian atau pemicu rute ke aplikasi React, Next.js, atau Angular Anda yang menampilkan error runtime saat diklik:

    // Trigger an unhandled exception on button click or route load
function handleTestCrash() {
  throw new Error("Crashlytics Web SDK Test Unhandled Error!");
}

    Jika Anda mengonfigurasi pengambilan error otomatis dengan <FirebaseCrashlytics> (React atau Next.js), provideCrashlytics (Angular), atau <CrashlyticsRoutes> (React Router), menampilkan error ini akan otomatis mengambil pengecualian dan menjadwalkannya untuk diupload.

  2. Build dan jalankan aplikasi Anda, lalu picu error pengujian agar aplikasi Anda mengirimkan laporan error pertamanya ke Firebase.

  3. Di Firebase console, buka dasbor DevOps & Engagement > Crashlytics untuk memeriksa laporan error pengujian Anda:

    1. Pilih aplikasi web Anda dari pemilih drop-down di bagian atas halaman.

    2. Muat ulang halaman. Pengecualian pengujian Anda akan muncul di tabel Masalah dalam beberapa menit.

Jika Anda telah me-refresh konsol dan masih tidak melihat error pengujian setelah lima hingga sepuluh menit, lihat bagian berikutnya tentang memecahkan masalah penyiapan.

Memecahkan masalah penyiapan Anda

Jika Anda memicu error pengujian dan masih tidak melihat laporan di dasbor Crashlytics setelah lima hingga sepuluh menit, coba jalankan kembali alur penyiapan atau verifikasi konfigurasi project berikut di konsol:

  • Jalankan kembali alur penyiapan Crashlytics: Anda dapat menjalankan kembali perintah penyiapan CLI Firebase (firebase crashlytics:setup) dengan aman atau menyelesaikan penyiapan di Firebase console seperti yang dijelaskan dalam Langkah 1 panduan memulai. Menjalankan ulang penyiapan akan otomatis mengaktifkan API yang tidak ada dan memperbaiki bucket firebase-telemetry Cloud Logging dan sink perutean.

  • Periksa penagihan dan izin IAM: Pastikan project Firebase Anda menggunakan paket harga Blaze bayar sesuai penggunaan dan akun Anda memiliki izin Pemilik di project saat menjalankan langkah penyiapan.

  • Verifikasi pembatasan kunci API firebasetelemetry.googleapis.com: Di halaman Credentials di Google Cloud console, pilih kunci API yang dikonfigurasi di objek firebaseConfig Anda (misalnya, Browser key (auto created by Firebase)). Jika kunci mengaktifkan pembatasan API, pastikan Firebase Telemetry API (firebasetelemetry.googleapis.com) disertakan dalam daftar API yang diizinkan. Jika target ini tidak ada dari kunci API yang dibatasi, permintaan upload jaringan akan gagal dengan error HTTP 403 (Forbidden) di konsol browser Anda.

  • Periksa API Google Cloud yang diaktifkan: Di halaman Enabled APIs & services di konsol Google Cloud, pastikan Firebase Telemetry API (firebasetelemetry.googleapis.com), Firebase Telemetry Admin API (firebasetelemetryadmin.googleapis.com), Cloud Logging API (logging.googleapis.com), dan Cloud Storage (storage.googleapis.com) diaktifkan untuk project Anda.

  • Verifikasi analisis log di bucket logging: Di halaman Logs Storage di konsol Google Cloud, pastikan bucket firebase-telemetry (lokasi global) ada dan telah mengaktifkan analisis log, lalu periksa halaman Log Router untuk mengonfirmasi bahwa sink firebase-telemetry-routing ada.

Merekam dan mengosongkan pengecualian pengujian secara manual

Jika Anda ingin segera memverifikasi transmisi end-to-end tanpa menunggu batching memori atau pembatalan muatan halaman, gunakan recordError bersama dengan flush:

import { recordError, flush, getCrashlytics } from '@firebase/crashlytics';
import { app } from './lib/firebase'; // Shared initialization script

const crashlytics = getCrashlytics(app);

async function triggerImmediateTestCrash() {
  const error = new Error("Crashlytics Web SDK Test Handled Error!");
  // Capture the error with immediate priority and custom diagnostic metadata
  recordError(crashlytics, error, {
    priority: 'IMMEDIATE',
    testEvent: true,
    environment: 'staging_verification'
  });
  // Force an immediate upload before the browser terminates or reloads
  await flush(crashlytics);
  console.log("Test error flushed to Crashlytics successfully.");
}

Langkah berikutnya

  • Dapatkan laporan error yang dapat dibaca — Siapkan upload peta sumber (.js.map) otomatis agar stack trace produksi Anda menampilkan nama file dan nomor baris asli.

  • Menyesuaikan laporan error — Pelajari cara melaporkan pengecualian yang ditangani, menambahkan kunci kustom, memaksa penghapusan data telemetri, dan mengonfigurasi pengambilan sampel.