Sharing Pengalaman: Implementasi Service Worker di Odoo Website
Diposting pada 12 Apr 2026, 10:17
Halo teman-teman praktisi Odoo! Saya Diana, dari tim IT PT Maju Sejahtera. Saat ini kami pakai Odoo ERP untuk operasional dan juga modul Website-nya untuk platform e-commerce serta company profile. Belakangan ini, saya lagi eksplorasi bagaimana caranya meningkatkan performa dan user experience website kami, apalagi di kondisi jaringan yang kadang kurang stabil di beberapa area.
Saya tertarik banget dengan potensi service worker untuk caching aset statis, kemampuan offline, sampai notifikasi push. Nah, saya mau tanya, adakah di sini yang sudah pernah coba atau berhasil mengimplementasikan service worker di Odoo Website? Kira-kira, apakah Odoo punya 'kekhasan' atau best practice tertentu yang perlu diperhatikan saat mengintegrasikan service worker ini? Atau mungkin ada tips modul tambahan yang bisa mempermudah? Mohon sharing pengalamannya ya, teman-teman. Makasih banyak sebelumnya!
Balasan (1)
Halo Mba Diana, selamat datang di komunitas Odoo Indonesia!
Wah, ini pertanyaan yang menarik banget dan inisiatif yang luar biasa untuk meningkatkan performa serta user experience website Odoo-nya, apalagi mempertimbangkan kondisi jaringan yang kurang stabil. Ide untuk mengimplementasikan Service Worker itu memang langkah yang tepat untuk mencapai hal tersebut!
Secara default atau 'out-of-the-box', Odoo memang tidak menyediakan integrasi Service Worker untuk caching aset statis atau kemampuan offline secara umum pada modul Website publiknya. Jadi, tidak ada fitur bawaan yang bisa langsung diaktifkan dengan satu klik untuk fungsionalitas ini.
Namun jangan khawatir, karena Odoo dibangun di atas teknologi web standar (HTML, CSS, JavaScript), mengimplementasikan Service Worker itu sangat mungkin dilakukan, meskipun membutuhkan sedikit kustomisasi atau pengembangan. Kami sendiri pernah melakukan eksperimen dan implementasi serupa untuk kebutuhan spesifik.
Berikut adalah beberapa 'kekhasan' atau best practice yang perlu diperhatikan saat mengintegrasikan Service Worker di Odoo Website:
1. Kustomisasi JavaScript untuk Service Worker:
Ini adalah inti dari implementasi. Anda perlu menulis file JavaScript terpisah (misalnya `sw.js`) yang berisi logika Service Worker Anda. File ini kemudian harus didaftarkan dari salah satu template Odoo Website Anda (biasanya di `` atau di akhir ``) menggunakan `navigator.serviceWorker.register('/sw.js', {scope: '/'})`. Pastikan file `sw.js` bisa diakses dari root domain Anda.
2. Strategi Caching yang Tepat:
Aset Statis Odoo: Odoo memiliki cara manajemen aset yang unik, di mana file CSS dan JS seringkali dibundel dan URL-nya mengandung hash untuk cache busting (contoh: `/web/assets/...`). Saat melakukan caching, Anda bisa menggunakan strategi `Cache-First` atau `Stale-While-Revalidate` untuk aset seperti CSS, JS, gambar, dan font. Pastikan Service Worker Anda bisa mengenali dan meng-cache URL aset ini.
Konten Dinamis: Website Odoo sangat dinamis, apalagi untuk e-commerce. Meng-cache halaman produk atau daftar kategori secara agresif bisa berisiko menampilkan data lama. Untuk konten dinamis, strategi `Network-First` dengan `Cache-Fallback` lebih disarankan, atau `Stale-While-Revalidate` jika Anda yakin data tidak berubah terlalu cepat.
3. Rute dan Scope Service Worker:
Pastikan Service Worker Anda terdaftar dengan scope yang benar (`{scope: '/'}`) agar bisa mengontrol seluruh halaman website Anda.
4. Halaman Offline (Offline Fallback):
Sangat disarankan untuk membuat halaman HTML sederhana yang akan ditampilkan saat pengguna benar-benar offline dan konten yang diminta tidak ada di cache. Anda bisa membuat halaman ini sebagai template di Odoo, lalu meng-cache URL-nya.
5. Fitur Notifikasi Push (Lebih Kompleks):
Untuk notifikasi push, ini membutuhkan beberapa langkah tambahan dan pengembangan di sisi backend Odoo:
Izin Pengguna: Service Worker akan meminta izin pengguna untuk notifikasi.
Penyimpanan Langganan: Setelah pengguna memberikan izin, Service Worker akan mendapatkan objek `PushSubscription`. Informasi ini (biasanya berisi `endpoint`, `p256dh key`, dan `auth key`) perlu disimpan di backend Odoo (misalnya di model kustom) untuk setiap pengguna yang berlangganan.
Logika Pengiriman Notifikasi: Di backend Odoo, Anda perlu menambahkan kode Python kustom yang bisa membaca data langganan ini dan mengirimkan pesan push menggunakan pustaka Web Push (melalui layanan seperti FCM atau VAPID). Odoo sendiri tidak memiliki "server push notification" bawaan untuk pengguna website publik.
6. Pengembangan dan Debugging:
Service Worker bisa sedikit tricky saat di-debug. Manfaatkan DevTools di browser Anda (tab Application -> Service Workers) untuk memantau status, cache, dan log dari Service Worker Anda.
7. Integrasi ke Modul Odoo Kustom:
Untuk menjaga struktur kode tetap rapi dan bisa di-deploy dengan mudah di Odoo, semua file (Service Worker JS, template untuk registrasi, dan model/controller Python jika ada notifikasi push) sebaiknya diatur dalam modul Odoo kustom Anda sendiri.
Untuk modul tambahan yang bisa mempermudah, sayangnya belum ada modul umum di Odoo App Store yang secara komprehensif menangani implementasi Service Worker (caching, offline, push notif) untuk website publik Odoo secara plug-and-play. Sebagian besar kebutuhan ini akan melibatkan pengembangan kustom berupa modul Odoo baru yang berisi:
File JavaScript `sw.js` di direktori `static/src/js/` atau `static/description/`.
XML untuk menimpa atau menambahkan script pendaftaran Service Worker ke template Odoo Website yang relevan (misalnya `website.layout`).
Jika ada notifikasi push, Anda juga butuh model dan controller Python kustom untuk menyimpan data langganan dan mengirimkan notifikasi.
Implementasi Service Worker ini memang butuh pemahaman mendalam tentang siklus hidup Service Worker dan strategi caching, tapi benefitnya untuk performa dan UX website Odoo Anda akan sangat signifikan.
Semoga pengalaman kami dan tips ini bisa membantu ya, Mba Diana. Jangan sungkan untuk berbagi progress atau pertanyaan lanjutan! Kami siap berdiskusi lebih jauh. Semangat terus!
Wah, ini pertanyaan yang menarik banget dan inisiatif yang luar biasa untuk meningkatkan performa serta user experience website Odoo-nya, apalagi mempertimbangkan kondisi jaringan yang kurang stabil. Ide untuk mengimplementasikan Service Worker itu memang langkah yang tepat untuk mencapai hal tersebut!
Secara default atau 'out-of-the-box', Odoo memang tidak menyediakan integrasi Service Worker untuk caching aset statis atau kemampuan offline secara umum pada modul Website publiknya. Jadi, tidak ada fitur bawaan yang bisa langsung diaktifkan dengan satu klik untuk fungsionalitas ini.
Namun jangan khawatir, karena Odoo dibangun di atas teknologi web standar (HTML, CSS, JavaScript), mengimplementasikan Service Worker itu sangat mungkin dilakukan, meskipun membutuhkan sedikit kustomisasi atau pengembangan. Kami sendiri pernah melakukan eksperimen dan implementasi serupa untuk kebutuhan spesifik.
Berikut adalah beberapa 'kekhasan' atau best practice yang perlu diperhatikan saat mengintegrasikan Service Worker di Odoo Website:
1. Kustomisasi JavaScript untuk Service Worker:
Ini adalah inti dari implementasi. Anda perlu menulis file JavaScript terpisah (misalnya `sw.js`) yang berisi logika Service Worker Anda. File ini kemudian harus didaftarkan dari salah satu template Odoo Website Anda (biasanya di `` atau di akhir ``) menggunakan `navigator.serviceWorker.register('/sw.js', {scope: '/'})`. Pastikan file `sw.js` bisa diakses dari root domain Anda.
2. Strategi Caching yang Tepat:
Aset Statis Odoo: Odoo memiliki cara manajemen aset yang unik, di mana file CSS dan JS seringkali dibundel dan URL-nya mengandung hash untuk cache busting (contoh: `/web/assets/...`). Saat melakukan caching, Anda bisa menggunakan strategi `Cache-First` atau `Stale-While-Revalidate` untuk aset seperti CSS, JS, gambar, dan font. Pastikan Service Worker Anda bisa mengenali dan meng-cache URL aset ini.
Konten Dinamis: Website Odoo sangat dinamis, apalagi untuk e-commerce. Meng-cache halaman produk atau daftar kategori secara agresif bisa berisiko menampilkan data lama. Untuk konten dinamis, strategi `Network-First` dengan `Cache-Fallback` lebih disarankan, atau `Stale-While-Revalidate` jika Anda yakin data tidak berubah terlalu cepat.
3. Rute dan Scope Service Worker:
Pastikan Service Worker Anda terdaftar dengan scope yang benar (`{scope: '/'}`) agar bisa mengontrol seluruh halaman website Anda.
4. Halaman Offline (Offline Fallback):
Sangat disarankan untuk membuat halaman HTML sederhana yang akan ditampilkan saat pengguna benar-benar offline dan konten yang diminta tidak ada di cache. Anda bisa membuat halaman ini sebagai template di Odoo, lalu meng-cache URL-nya.
5. Fitur Notifikasi Push (Lebih Kompleks):
Untuk notifikasi push, ini membutuhkan beberapa langkah tambahan dan pengembangan di sisi backend Odoo:
Izin Pengguna: Service Worker akan meminta izin pengguna untuk notifikasi.
Penyimpanan Langganan: Setelah pengguna memberikan izin, Service Worker akan mendapatkan objek `PushSubscription`. Informasi ini (biasanya berisi `endpoint`, `p256dh key`, dan `auth key`) perlu disimpan di backend Odoo (misalnya di model kustom) untuk setiap pengguna yang berlangganan.
Logika Pengiriman Notifikasi: Di backend Odoo, Anda perlu menambahkan kode Python kustom yang bisa membaca data langganan ini dan mengirimkan pesan push menggunakan pustaka Web Push (melalui layanan seperti FCM atau VAPID). Odoo sendiri tidak memiliki "server push notification" bawaan untuk pengguna website publik.
6. Pengembangan dan Debugging:
Service Worker bisa sedikit tricky saat di-debug. Manfaatkan DevTools di browser Anda (tab Application -> Service Workers) untuk memantau status, cache, dan log dari Service Worker Anda.
7. Integrasi ke Modul Odoo Kustom:
Untuk menjaga struktur kode tetap rapi dan bisa di-deploy dengan mudah di Odoo, semua file (Service Worker JS, template untuk registrasi, dan model/controller Python jika ada notifikasi push) sebaiknya diatur dalam modul Odoo kustom Anda sendiri.
Untuk modul tambahan yang bisa mempermudah, sayangnya belum ada modul umum di Odoo App Store yang secara komprehensif menangani implementasi Service Worker (caching, offline, push notif) untuk website publik Odoo secara plug-and-play. Sebagian besar kebutuhan ini akan melibatkan pengembangan kustom berupa modul Odoo baru yang berisi:
File JavaScript `sw.js` di direktori `static/src/js/` atau `static/description/`.
XML untuk menimpa atau menambahkan script pendaftaran Service Worker ke template Odoo Website yang relevan (misalnya `website.layout`).
Jika ada notifikasi push, Anda juga butuh model dan controller Python kustom untuk menyimpan data langganan dan mengirimkan notifikasi.
Implementasi Service Worker ini memang butuh pemahaman mendalam tentang siklus hidup Service Worker dan strategi caching, tapi benefitnya untuk performa dan UX website Odoo Anda akan sangat signifikan.
Semoga pengalaman kami dan tips ini bisa membantu ya, Mba Diana. Jangan sungkan untuk berbagi progress atau pertanyaan lanjutan! Kami siap berdiskusi lebih jauh. Semangat terus!