Masalah umum dan pelaporan bug

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

Sebelum kita membahas proses debug push, Anda mungkin mengalami masalah saat men-debug service worker itu sendiri, file tidak diupdate, gagal mendaftar, atau perilaku yang tidak biasa. Ada dokumen yang sangat bagus tentang men-debug pekerja layanan yang sangat saya rekomendasikan untuk Anda baca jika Anda baru mengenal pengembangan pekerja layanan.

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

  • Mengirim Pesan: Pastikan pengiriman pesan berhasil. Anda akan mendapatkan kode HTTP 201. Jika Anda bukan:
    • Periksa Error Otorisasi: Jika Anda menerima pesan error otorisasi, lihat bagian Masalah Otorisasi.
    • Error API Lainnya: Jika Anda menerima respons kode status selain 201, lihat bagian Kode Status HTTP untuk mengetahui panduan tentang penyebab masalah.
  • 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 bahwa Firefox dan Layanan AutoPush Mozilla memiliki pesan error yang bagus. Jika Anda mengalami kesulitan dan tidak yakin apa masalahnya, uji di Firefox dan lihat apakah Anda mendapatkan pesan error yang lebih membantu.

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(). Kelemahannya adalah setiap perbedaan antara kunci front end dan server akan menyebabkan 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 Authorization.
  • 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 menguji di Firefox guna melihat apakah pesan tersebut akan memberikan lebih banyak insight tentang masalah tersebut.

Firefox dan Mozilla AutoPush

Firefox dan Mozilla AutoPush menyediakan serangkaian pesan error yang mudah dipahami 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 di 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 Authorization 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 dalam JWT (misalnya jika nilai "alg" adalah nilai yang tidak diharapkan), 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. Berikut adalah daftar kode status HTTP dan artinya terkait dengan push web.

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 dibuat.
400 Permintaan tidak valid. Salah satu header Anda tidak valid atau diformat dengan buruk.
404 Tidak Ditemukan. Dalam hal ini, Anda harus menghapus PushSubscription dari backend dan menunggu kesempatan untuk mendaftarkan ulang pengguna.
410 Hilang. Langganan tidak lagi valid dan harus dihapus dari backend Anda. Hal ini dapat direproduksi dengan memanggil `unsubscribe()` pada `PushSubscription`.
413 Ukuran payload terlalu besar. Ukuran payload minimum yang harus didukung oleh layanan push adalah 4.096 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 membantu, periksa spesifikasi Web Push Protocol untuk melihat apakah kode status dirujuk bersama dengan 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 pekerja layanan, hal ini biasanya menunjukkan bahwa browser gagal mendekripsi pesan yang diterimanya.

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

Firefox DevTools dengan pesan dekripsi.

Untuk memeriksa apakah ini masalahnya di Chrome, lakukan hal berikut:

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

Data internal GCM Chrome.

  1. Picu pesan push, dan 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 service worker dan tidak melihat error dekripsi, browser mungkin gagal terhubung ke layanan push.

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

Log pesan penerimaan internal GCM.

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

Status koneksi internal GCM.

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

Mengajukan laporan bug

Jika tidak ada satu pun langkah di atas yang membantu mengatasi masalah Anda dan tidak ada tanda-tanda apa masalahnya, laporkan masalah pada browser yang Anda gunakan:

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

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

  • Browser yang Anda gunakan untuk pengujian (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 maupun situs yang dihosting, hal ini sering kali mempercepat diagnosis dan penyelesaian masalah.

Langkah berikutnya

Codelab