Versi baru Reporting API telah tersedia. API ini lebih privat dan lebih mungkin didukung di seluruh browser.
Reporting API memberi tahu Anda tentang error yang terjadi di seluruh situs saat pengunjung menggunakannya. Laporan ini memberi Anda visibilitas pada intervensi browser, error browser, pelanggaran Kebijakan Keamanan Konten (CSP), pelanggaran COOP/COEP, peringatan penghentian penggunaan, dan lainnya.
Versi baru Reporting API telah tersedia. API baru lebih ramping dan lebih mungkin didukung di seluruh browser.
Ringkasan
Developer situs
Jika Anda sudah memiliki fungsi pelaporan untuk situs Anda: bermigrasi ke v1 dengan menggunakan header baru
(Reporting-Endpoints), tetapi tetap menggunakan header lama untuk beberapa waktu (Report-To).
Lihat Migrasi: contoh kode.
Jika Anda baru saja menambahkan fungsi pelaporan ke situs Anda: gunakan hanya header baru
(Reporting-Endpoints).
⚠️ Dalam kedua kasus, pastikan untuk menyetel header Reporting-Endpoints pada semua respons yang mungkin membuat laporan.
Developer layanan pelaporan
Jika Anda mengelola layanan endpoint atau mengoperasikannya sendiri, lebih banyak traffic akan terjadi saat Anda atau developer eksternal bermigrasi ke Reporting API v1 (header Reporting-Endpoints).
Baca terus untuk mengetahui detail dan contoh kodenya.
Pencatatan Log Error Jaringan
Mekanisme baru untuk Pencatatan Error Jaringan akan dikembangkan. Setelah tersedia, beralihlah dari Reporting API v0 ke mekanisme baru tersebut.
Demo dan kode
- Situs demo: API pelaporan baru (v1)
- Kode untuk situs demo
Perbedaan antara v0 dan v1
Yang berubah
- Platform API berbeda.
Report-To: { group: "main-endpoint", "max_age": 86400, "endpoints": [ { "url": ... }, { "url": ... }] }, { group: "default-endpoint", "max_age": 86400, "endpoints": [ { "url": ... }, { "url": ... }] } Document-Policy: ...; report-to main-endpoint
{0 menggunakan header Report-To untuk mengonfigurasi grup endpoint bernama, dan direktif report-to di header lain untuk mereferensikan grup endpoint ini.
Reporting-Endpoints: main-endpoint="https://reports.example/main", default="https://reports.example/default" Document-Policy: ...; report-to main-endpoint
v1 menggunakan header Reporting-Endpoints untuk mengonfigurasi endpoint
bernama. Seperti v0, versi ini menggunakan direktif report-to di header lain untuk mereferensikan grup endpoint ini.
- Cakupan laporan berbeda.
Dengan v0, Anda dapat menetapkan endpoint pelaporan hanya pada beberapa respons. Dokumen (halaman) lain di origin tersebut akan otomatis menggunakan endpoint sekitar ini.
Dengan v1, Anda perlu menyetel header Reporting-Endpoints pada semua respons yang dapat membuat laporan.
- Kedua API mendukung jenis laporan yang sama, dengan satu pengecualian: v1 tidak mendukung laporan Error Jaringan. Baca selengkapnya di langkah-langkah migrasi.
- v0 tidak dan tidak akan didukung di seluruh browser. v1 lebih mungkin didukung di beberapa browser pada masa mendatang.
Yang tidak berubah
- Format dan struktur laporan tidak berubah.
- Permintaan yang dikirim oleh browser ke endpoint tetap berupa permintaan
POSTdariContent-typeapplication/reports+json. - Pemetaan endpoint tertentu ke jenis laporan tertentu didukung di v0 dan v1.
- Peran endpoint
defaulttidak berubah. Reporting API v1 tidak berdampak pada
ReportingObserver.ReportingObserverterus mendapatkan akses ke semua laporan yang dapat diamati, dan formatnya identik.
Semua perbedaan antara v0 dan v1
Reporting API Lama (v0)Report-To header |
Header New Reporting API (v1)Reporting-Endpoints |
|
|---|---|---|
| Dukungan browser | Chrome 69+ dan Edge 69+. | Chrome 96+ dan Edge 96+. Firefox mendukungnya. Safari tidak menolak. Lihat sinyal browser. |
| Endpoint | Mengirim laporan ke beberapa pengumpul laporan (beberapa URL ditentukan per grup endpoint). | Mengirim laporan ke pengumpul laporan tertentu (hanya satu URL yang ditentukan per endpoint). |
| Platform API | Menggunakan header `Report-To` untuk mengonfigurasi grup endpoint bernama. |
Menggunakan header `Reporting-Endpoints` untuk mengonfigurasi endpoint bernama. |
| Jenis laporan yang dapat dibuat melalui API ini |
|
Tidak berubah, kecuali Network Error Logging (NEL): ini tidak didukung di Reporting API (v1) yang baru. |
| Cakupan laporan | Asal Anda. Header Report-To dokumen memengaruhi dokumen (halaman) lain dari origin tersebut.
Kolom url laporan masih bervariasi per dokumen.
|
Dokumen. Header Reporting-Endpoints dokumen hanya memengaruhi dokumen tersebut.
Kolom url laporan masih bervariasi per dokumen.
|
| Isolasi laporan (pengelompokan) | Dokumen (halaman) atau situs/asal yang berbeda yang membuat laporan pada waktu yang hampir bersamaan dan memiliki endpoint pelaporan yang sama akan dikelompokkan bersama: dokumen tersebut akan dikirim dalam pesan yang sama ke endpoint pelaporan. |
|
| Dukungan untuk load balancing / prioritas | Ya | Tidak |
Developer endpoint: Bersiaplah untuk menerima lebih banyak traffic
Jika Anda telah menyiapkan server sendiri sebagai endpoint pelaporan, atau jika Anda sedang mengembangkan atau memelihara pengumpul laporan sebagai layanan, akan ada lebih banyak traffic ke endpoint tersebut.
Hal ini karena laporan tidak dikelompokkan dengan Reporting API v1 seperti halnya dengan Reporting API v0. Oleh karena itu, saat developer aplikasi mulai bermigrasi ke Reporting API v1, jumlah laporan akan tetap sama, tetapi volume permintaan ke server endpoint akan meningkat.
Developer aplikasi: Bermigrasi ke Reporting-Endpoints (v1)
Apa yang perlu Anda lakukan?
Menggunakan Reporting API (v1) yang baru memiliki beberapa manfaat ✅:
- Sinyal browser positif, yang berarti dukungan lintas browser dapat diharapkan untuk v1 (tidak seperti v0 yang hanya didukung di Chrome dan Edge).
- API lebih ramping.
- Alat sedang dikembangkan di sekitar Reporting API (v1) yang baru.
Dengan mengingat hal ini:
- Jika situs Anda sudah menggunakan Reporting API v0 dengan header
Report-To, lakukan migrasi ke Reporting API v1 (lihat langkah-langkah migrasi). Jika situs Anda sudah menggunakan fungsi pelaporan untuk pelanggaran Kebijakan Keamanan Konten, periksa langkah-langkah migrasi khusus untuk pelaporan CSP. - Jika situs Anda belum menggunakan Reporting API dan Anda sekarang menambahkan fungsi pelaporan:
gunakan Reporting API baru (v1) (header
Reporting-Endpoints). Ada satu pengecualian untuk hal ini: jika Anda perlu menggunakan Network Error Logging, gunakanReport-To(v0). Pencatatan Error Jaringan saat ini tidak didukung di Reporting API v1. Mekanisme baru untuk Network Error Logging akan dikembangkan. Hingga mekanisme tersebut tersedia, gunakan Reporting API v0. Jika Anda memerlukan Network Error Logging bersama jenis laporan lainnya, gunakan keduaReport-To(v0) danReporting-Endpoints(v1). v0 memberi Anda Network Error Logging dan v1 memberi Anda laporan dari semua jenis lainnya.
Langkah migrasi
Tujuan Anda dalam migrasi ini adalah tidak kehilangan laporan yang biasa Anda dapatkan dengan v0.
Langkah 1 (lakukan sekarang): Gunakan kedua header:
Report-To(v0) danReporting-Endpoints(v1).Dengan ini, Anda mendapatkan:
- Laporan dari klien Chrome dan Edge yang lebih baru berkat
Reporting-Endpoints(v1). - Laporan dari klien Chrome dan Edge yang lebih lama berkat
Report-To(v0).
Instance browser yang mendukung
Reporting-Endpointsakan menggunakanReporting-Endpoints, dan instance yang tidak mendukung akan dikembalikan keReport-To. Format permintaan dan laporan sama untuk v0 dan v1.- Laporan dari klien Chrome dan Edge yang lebih baru berkat
Langkah 2 (lakukan sekarang): Pastikan header
Reporting-Endpointsdisetel pada semua respons yang mungkin membuat laporan.Dengan v0, Anda dapat memilih untuk menetapkan endpoint pelaporan hanya pada beberapa respons, dan dokumen (halaman) lain di origin tersebut akan menggunakan endpoint "sekitar" ini. Dengan v1, karena perbedaan dalam pencakupan, Anda perlu menetapkan header
Reporting-Endpointspada semua respons yang mungkin menghasilkan laporan.Langkah 3 (mulai nanti): Setelah semua atau sebagian besar pengguna Anda mengupdate ke penginstalan Chrome atau Edge yang lebih baru (96 dan yang lebih baru), hapus
Report-To(v0) dan pertahankan hanyaReporting-Endpoints.Satu pengecualian: jika Anda memerlukan laporan Network Error Logging, pertahankan
Report-Tohingga mekanisme baru tersedia untuk Network Error Logging.
Lihat contoh kode di buku panduan migrasi.
Langkah-langkah migrasi untuk pelaporan CSP
Ada dua cara untuk mengonfigurasi laporan pelanggaran Content-Security-Policy:
- Dengan header CSP saja melalui perintah
report-uri. Fitur ini memiliki dukungan browser yang luas, di Chrome, Firefox, Safari, dan Edge. Laporan dikirim dengan content-typeapplication/csp-reportdan memiliki format khusus untuk CSP. Laporan ini disebut "Laporan CSP Level 2" dan tidak mengandalkan Reporting API. - Dengan Reporting API, hal tersebut dilakukan melalui header
Report-To(lama) atauReporting-Endpoints(v1) yang lebih baru. Fitur ini hanya didukung di Chrome dan Edge. Permintaan laporan memiliki format yang sama dengan permintaan Reporting API lainnya, dan jenis kontenapplication/reports+jsonyang sama.
Menggunakan pendekatan pertama (hanya report-uri) tidak lagi direkomendasikan dan menggunakan pendekatan kedua memiliki beberapa manfaat. Secara khusus, API ini memungkinkan Anda menggunakan satu cara untuk menyiapkan pelaporan untuk semua jenis laporan serta menetapkan endpoint generik (karena semua permintaan laporan yang dibuat melalui Reporting API⏤CSP dan lainnya⏤memiliki format yang sama application/reports+json.
Namun, hanya beberapa browser yang mendukung report-to.
Oleh karena itu, sebaiknya Anda tetap menggunakan report-uri bersama dengan pendekatan Reporting API (Report-To
atau yang lebih baru, Reporting-Endpoints) untuk mendapatkan laporan pelanggaran CSP dari beberapa browser. Di browser yang mengenali report-uri dan report-to, report-uri akan diabaikan jika report-to ada. Di browser yang hanya mengenali report-uri, hanya report-uri yang akan dipertimbangkan.
Langkah 1 (lakukan sekarang): Jika Anda belum menambahkannya, tambahkan
report-tobersamareport-uri. Browser yang hanya mendukungreport-uri(Firefox) akan menggunakanreport-uri, dan browser yang juga mendukungreport-to(Chrome, Edge) akan menggunakanreport-to. Untuk menentukan endpoint bernama yang akan Anda gunakan direport-to, gunakan headerReport-TodanReporting-Endpoints. Hal ini memastikan Anda mendapatkan laporan dari klien Chrome dan Edge yang lebih lama dan lebih baru.Langkah 3 (mulai nanti): Setelah semua atau sebagian besar pengguna Anda mengupdate ke penginstalan Chrome atau Edge yang lebih baru (96 dan yang lebih baru), hapus
Report-To(v0) dan pertahankan hanyaReporting-Endpoints. Tetap aktifkanreport-uriagar Anda tetap mendapatkan laporan untuk browser yang hanya mendukungnya.
Lihat contoh kode untuk langkah-langkah ini di migrasi pelaporan CSP.
Migrasi: contoh kode
Ringkasan
Jika Anda menggunakan Reporting API lama (v0) untuk mendapatkan laporan pelanggaran untuk COOP
(header Cross-Origin-Opener-Policy), COEP (Cross-Origin-Embedder-Policy), atau kebijakan dokumen
(header Document-Policy): Anda tidak perlu mengubah header kebijakan ini saat bermigrasi
ke Reporting API v1. Yang Anda perlukan adalah bermigrasi dari header Report-To lama ke header
Reporting-Endpoints baru.
Jika Anda menggunakan Reporting API lama (v0) untuk mendapatkan laporan pelanggaran untuk CSP (header Content-Security-Policy), Anda mungkin perlu menyesuaikan Content-Security-Policy sebagai bagian dari migrasi ke Reporting API baru (v1).
Migrasi dasar
Report-To: { group: "main-endpoint", "endpoints": [ { "url": "https://reports.example/main" }] }, { group: "default-endpoint", "endpoints": [ { "url": "https://reports.example/default" }] }Reporting-Endpoints: main-endpoint="https://reports.example/main", default="https://reports.example/default" Report-To: { group: "main-endpoint", "max_age": 86400, "endpoints": [ { "url": "https://reports.example/main" }] }, { group: "default-endpoint", "max_age": 86400, "endpoints": [ { "url": "https://reports.example/default" }] }
Jika Anda sudah memiliki fungsi pelaporan di situs Anda, pertahankan Report-To hanya untuk sementara
(hingga sebagian besar klien Chrome dan Edge telah diupdate) untuk menghindari hilangnya laporan.
Jika Anda memerlukan Network Error Logging, tetap gunakan Report-To hingga penggantian Network Error Logging
tersedia.
Reporting-Endpoints: main-endpoint="https://reports.example/main", default="https://reports.example/default"Berikut tampilan kode Anda pada masa mendatang, setelah sebagian besar klien Chrome dan Edge diupdate dan mendukung API v1.
Perhatikan bahwa dengan v1, Anda masih dapat mengirim jenis laporan tertentu ke endpoint tertentu. Namun, Anda hanya dapat memiliki satu URL per endpoint.
Mengamati semua halaman
app.get("/", (request, response) => { response.set("Report-To", …) response.render(...) }); app.get("/page1", (request, response) => { response.render(...) });
Dengan v0, Anda dapat menetapkan endpoint pelaporan hanya pada beberapa respons. Dokumen (halaman) lain di origin tersebut akan otomatis menggunakan endpoint sekitar ini. Di sini, endpoint yang ditetapkan untuk "/" digunakan untuk semua respons, misalnya untuk page1.
// Use a middleware to set the reporting endpoint(s) for *all* requests. app.use(function(request, response, next) { response.set("Reporting-Endpoints", …); next(); }); app.get("/", (request, response) => { response.render(...) }); app.get("/page1", (request, response) => { response.render(...) });
Dengan v1, Anda perlu menyetel header Reporting-Endpoints di semua
respons yang mungkin menghasilkan laporan.
Migrasi pelaporan CSP
Content-Security-Policy: ...; report-uri https://reports.example/mainPenggunaan report-uri saja tidak lagi
direkomendasikan.
Jika kode Anda terlihat seperti di atas, lakukan migrasi. Lihat Contoh kode baru di bawah (berwarna hijau).
Content-Security-Policy: ...; report-uri https://reports.example/main; report-to main-endpoint Report-To: main-endpoint="https://reports.example/main"
Ini lebih baik: kode ini menggunakan report-to, pengganti report-uri yang lebih baru. Fitur ini tetap mempertahankan report-uri untuk kompatibilitas mundur; beberapa browser tidak mendukung report-to, tetapi mendukung report-uri.
Namun, kode ini bisa lebih baik: kode ini menggunakan Reporting API v0 (header Report-To). Bermigrasi ke v1: lihat contoh 'Kode baru' di bawah (berwarna hijau).
Content-Security-Policy: ...; report-uri https://reports.example/main; report-to main-endpoint Reporting-Endpoints: main-endpoint="https://reports.example/main" Report-To: ...
Pertahankan arahan report-uri bersama arahan report-to hingga arahan report-to didukung di seluruh browser. Lihat tabel kompatibilitas browser.
Simpan Report-To di samping Reporting-Endpoints untuk sementara. Setelah sebagian besar pengunjung Chrome dan Edge Anda mengupgrade ke browser versi 96+, hapus Report-To.
Bacaan lebih lanjut
- Memantau aplikasi web Anda dengan Reporting API (postingan utama tentang Reporting API)
- Spesifikasi: Reporting API lama (v0)
- Spesifikasi: Reporting API baru (v1)
Terima kasih banyak kepada Ian Clelland, Eiji Kitamura, dan Milica Mihajlija atas ulasan dan saran mereka terkait artikel ini.