Masalah Umum dan Bug Pelaporan

Saat Anda mengalami masalah dengan push web, mungkin sulit untuk men-debug masalah tersebut atau menemukan bantuan. Dokumen ini menguraikan beberapa masalah umum dan tindakan yang harus Anda lakukan jika menemukan bug di Chrome atau Firefox.

Sebelum kita membahas proses debug push, Anda mungkin mengalami masalah dengan proses debug pekerja layanan itu sendiri, file tidak diupdate, gagal mendaftar, atau umumnya hanya perilaku yang tidak biasa. Ada dokumen keren tentang proses debug service worker yang sangat saya rekomendasikan untuk Anda baca jika Anda baru dalam pengembangan service worker.

Ada dua tahap berbeda yang harus diperiksa saat mengembangkan dan menguji push web, masing-masing dengan kumpulan masalah umum/masalahnya sendiri:

  • Mengirim Pesan: Pastikan bahwa pengiriman pesan berhasil. Anda akan mendapatkan kode HTTP 201. Jika Anda tidak:
    • Periksa Error Otorisasi: Jika Anda menerima pesan error otorisasi, lihat bagian Masalah Otorisasi.
    • Error API Lainnya: Jika Anda menerima respons kode status non-201, lihat bagian Kode Status HTTP untuk mengetahui panduan tentang penyebab masalahnya.
  • Menerima Pesan: Jika Anda berhasil mengirim pesan, tetapi pesan tidak diterima di browser:

Jika Anda tidak dapat mengirim dan menerima pesan push dan bagian yang relevan dalam dokumen ini tidak membantu men-debug masalah, Anda mungkin telah menemukan bug dalam mekanisme push itu sendiri. Dalam hal ini, lihat bagian Mengajukan Laporan Bug untuk mengajukan laporan bug yang baik dengan semua informasi yang diperlukan untuk mempercepat proses perbaikan bug.

Satu hal yang ingin saya sampaikan sebelum kita mulai adalah Firefox dan Layanan AutoPush Mozilla memiliki pesan error yang bagus. Jika Anda mengalami masalah dan tidak yakin apa masalahnya, uji di Firefox dan lihat apakah Anda mendapatkan pesan error yang lebih bermanfaat.

Masalah otorisasi

Masalah otorisasi adalah salah satu masalah paling umum yang dihadapi developer saat memulai push web. Hal ini biasanya merupakan masalah pada konfigurasi Kunci Server Aplikasi (alias kunci VAPID) situs.

Cara termudah untuk mendukung push di Firefox dan Chrome adalah dengan menyediakan applicationServerKey dalam panggilan subscribe(). Sisi negatifnya adalah perbedaan antara kunci frontend dan server Anda akan mengakibatkan error otorisasi.

Di Chrome dan FCM

Untuk Chrome, yang menggunakan FCM sebagai layanan push, Anda akan menerima respons UnauthorizedRegistration dari FCM untuk berbagai error, yang semuanya melibatkan kunci server aplikasi.

Anda akan menerima error UnauthorizedRegistration dalam salah satu situasi berikut:

  • Jika Anda gagal menentukan header Authorization dalam permintaan ke FCM.
  • Kunci aplikasi yang digunakan untuk membuat pengguna berlangganan tidak cocok dengan kunci yang digunakan untuk menandatangani header Otorisasi.
  • Masa berlaku tidak valid di JWT Anda, yaitu masa berlaku melebihi 24 jam atau JWT telah habis masa berlakunya.
  • JWT salah format atau memiliki nilai yang tidak valid.

Respons error lengkap akan terlihat seperti ini:

<html>
  <head>
    <title>UnauthorizedRegistration</title>
  </head>
  <body bgcolor="#FFFFFF" text="#000000">
    <h1>UnauthorizedRegistration</h1>

    <h2>Error 400</h2>
  </body>
</html>

Jika Anda menerima pesan error ini di Chrome, pertimbangkan untuk mengujinya di Firefox untuk melihat apakah ini akan memberikan lebih banyak informasi terkait masalah tersebut.

Firefox dan Mozilla AutoPush

Firefox dan Mozilla AutoPush memberikan kumpulan pesan error yang sesuai untuk masalah Authorization.

Anda juga akan menerima respons error Unauthorized dari Mozilla AutoPush jika header Authorization tidak disertakan dalam permintaan push Anda.

{
  "errno": 109,
  "message": "Request did not validate missing authorization header",
  "code": 401,
  "more_info": "http://autopush.readthedocs.io/en/latest/http.html#error-codes",
  "error": "Unauthorized"
}

Jika masa berlaku JWT Anda telah berakhir, Anda juga akan menerima error Unauthorized dengan pesan yang menjelaskan bahwa masa berlaku token telah berakhir.

{
  "code": 401,
  "errno": 109,
  "error": "Unauthorized",
  "more_info": "http://autopush.readthedocs.io/en/latest/http.html#error-codes",
  "message": "Request did not validate Invalid bearer token: Auth expired"
}

Jika kunci server aplikasi berbeda antara saat pengguna berlangganan dan saat header Otorisasi ditandatangani, error Not Found akan ditampilkan:

{
  "errno": 102,
  "message": "Request did not validate invalid token",
  "code": 404,
  "more_info": "http://autopush.readthedocs.io/en/latest/http.html#error-codes",
  "error": "Not Found"
}

Terakhir, jika Anda memiliki nilai yang tidak valid di JWT (misalnya jika nilai "alg" adalah nilai yang tidak terduga), Anda akan menerima error berikut dari Mozilla AutoPush:

{
  "code": 401,
  "errno": 109,
  "error": "Unauthorized",
  "more_info": "http://autopush.readthedocs.io/en/latest/http.html#error-codes",
  "message": "Request did not validate Invalid Authorization Header"
}

Kode status HTTP

Ada berbagai masalah yang dapat menyebabkan kode respons non-201 dari layanan push. Di bawah ini adalah daftar kode status HTTP dan artinya terkait dengan web push.

Kode Status Deskripsi
429 Terlalu banyak permintaan. Server aplikasi Anda telah mencapai batas kapasitas dengan layanan push. Respons dari layanan harus menyertakan header 'Retry-After' untuk menunjukkan berapa lama sebelum permintaan lain dapat dilakukan.
400 Permintaan tidak valid. Salah satu {i>header<i} Anda tidak valid atau formatnya buruk.
404 Tidak Ditemukan. Dalam hal ini, Anda harus menghapus PushSubscription dari backend dan menunggu kesempatan untuk membuat pengguna berlangganan lagi.
410 Pergi. Langganan ini tidak lagi valid dan harus dihapus dari backend Anda. Hal ini dapat direproduksi dengan memanggil `unsubscribe()` di `PushSubscription`.
413 Ukuran payload terlalu besar. Payload ukuran minimum yang harus didukung layanan push adalah 4096 byte (atau 4 kb). Ukuran yang lebih besar dapat menyebabkan error ini.

Jika kode status HTTP tidak ada dalam daftar ini dan pesan error tidak berguna, periksa spesifikasi Web Push Protocol untuk melihat apakah kode status dirujuk beserta skenario kapan kode status tersebut dapat digunakan.

Masalah enkripsi payload

Jika Anda berhasil memicu pesan push (yaitu mengirim pesan ke layanan push web dan menerima kode respons 201), tetapi peristiwa push tidak pernah diaktifkan di service worker, hal ini biasanya menunjukkan bahwa browser gagal mendekripsi pesan yang diterima.

Jika demikian, Anda akan melihat pesan error di konsol DevTools Firefox seperti berikut:

Firefox DevTools dengan pesan dekripsi.

Untuk memeriksa apakah hal ini merupakan masalah di Chrome, lakukan tindakan berikut:

  1. Buka about://gtag-internals dan klik tombol "Start Recording".

Rekaman internal Chrome GCM.

  1. Picu pesan push, lalu lihat di bagian "Log Kegagalan Dekripsi Pesan".

Log dekripsi internal GCM.

Jika ada masalah dengan dekripsi payload, Anda akan melihat error yang mirip dengan yang ditampilkan di atas. (Perhatikan pesan AES-GCM decryption failed di kolom detail.)

Ada beberapa alat yang dapat membantu men-debug enkripsi jika ini adalah masalah Anda:

Masalah koneksi

Jika Anda tidak menerima peristiwa push di pekerja layanan dan tidak melihat error dekripsi, browser mungkin gagal terhubung ke layanan push.

Di Chrome, Anda dapat memeriksa apakah browser menerima pesan dengan memeriksa 'Log Pesan Terima' (sic) di about://gcm-internals.

Internal GCM menerima log pesan.

Jika Anda tidak melihat pesan tiba tepat waktu, pastikan status koneksi browser Anda adalah CONNECTED:

Status koneksi internal GCM.

Jika profil tidak 'TERHUBUNG', Anda mungkin perlu menghapus profil saat ini dan membuat profil baru. Jika cara tersebut masih belum menyelesaikan masalah, harap ajukan laporan bug seperti yang disarankan di bawah.

Melaporkan bug

Jika tidak ada satu pun langkah di atas yang membantu mengatasi masalah Anda dan tidak ada tanda-tanda masalahnya, ajukan masalah terkait browser yang mengalami masalah:

Untuk Chrome, Anda dapat menyampaikan masalah di sini: https://bugs.chromium.org/p/chromium/issues/list Untuk Firefox, Anda sebaiknya menyampaikan masalah di: https://bugzilla.mozilla.org/

Untuk memberikan laporan bug yang baik, Anda harus memberikan detail berikut:

  • Browser yang telah Anda uji (misalnya, Chrome versi 50, Chrome versi 51, Firefox versi 50, Firefox versi 51).
  • Contoh PushSubscription yang menunjukkan masalah.
  • Sertakan contoh permintaan (yaitu konten permintaan jaringan ke layanan push, termasuk header).
  • Sertakan juga contoh respons dari permintaan jaringan.

Jika Anda dapat memberikan contoh yang dapat direproduksi, baik kode sumber atau situs web yang dihosting, hal ini sering kali mempercepat diagnosis dan pemecahan masalah.

Langkah berikutnya

Codelab