Langganan Notifikasi Push

Untuk mengirim pesan push ke pengunjung situs web, pengguna harus terlebih dahulu mengizinkan Izin Notifikasi Push di browser mereka.
Pengguna yang menolak izin tidak akan dapat menerima pesan push.

Jika Anda memasang JavaScript SDK yang disediakan Vivoldi di situs web Anda, popup permintaan izin akan otomatis muncul di browser ketika pengunjung mengakses.
Jika pengguna mengizinkan, informasi langganan push akan disimpan di server Vivoldi dan dapat dilihat di dasbor pada [Pesan Push → Kirim Push Situs Web].

Misalnya, jika 100 pengguna memberikan izin, akan ada 100 data langganan di dasbor, dan saat pesan push dikirim, pesan akan dikirim ke semua pengguna di daftar tersebut.

Sisipkan skrip di bagian <head>...</head> seperti contoh berikut.

example.html 
<html>
<head>
<title>example page</title>
<script src="https://opencdn.vivoldi.com/js/webpush.min.js?v=202507301"></script>
<script>
const apiKey = 'oc3w9m4ytso9mv5e8yse9XXXXXXXXXX';
// Public Key of the domain registered on the “Push Message -> Domain Management” page.
const publicKey = 'XXXXXYTRlpG8mXXXXXiuBZ6BtjyOfgPsDArFYWF2PxZbY4egmDNias1gEfN_5wftScr39K8BbcjXXXXX';
const params = {apiKey:apiKey, publicKey:publicKey};
// Display notification permission pop-up (the pop-up will not appear if permission has already been granted)
function showNotificationPermission() {
    webpush.register(params);
}
</script>
</head>

<body>

<button type="button" onclick="showNotificationPermission()">Permission Request</button>

</body>
</html>
sw.min.js 
'use strict';const a0_0x5374e1=a0_0xe038;(function(_0x1227c0,_0x51a60b){const _0x31ab77=a0_0xe038,_0x20d84d=_0x1227c0();while(!![]){try{const _0x12de05=parseInt(_0x31ab77(0x189))/0x1+-parseInt(_0x31ab77(0x188))/0x2+-parseInt(_0x31ab77(0x175))/0x3+parseInt(_0x31ab77(0x196))/0x4+parseInt(_0x31ab77(0x191))/0x5*(parseInt(_0x31ab77(0x179))/0x6)+parseInt(_0x31ab77(0x190))/0x7*(-parseInt(_0x31ab77(0x18a))/0x8)+parseInt(_0x31ab77(0x181))/0x9*(parseInt(_0x31ab77(0x173))/0xa);if(_0x12de05===_0x51a60b)break;else _0x20d84d['push'](_0x20d84d['shift']());}catch(_0x40c5f5){_0x20d84d['push'](_0x20d84d['shift']());}}}(a0_0x3c7d,0xc9d27));function a0_0xe038(_0x596680,_0x1be660){const _0x3c7dc3=a0_0x3c7d();return a0_0xe038=function(_0xe03880,_0x22c065){_0xe03880=_0xe03880-0x170;let _0x16ce5f=_0x3c7dc3[_0xe03880];return _0x16ce5f;},a0_0xe038(_0x596680,_0x1be660);}function a0_0x3c7d(){const _0x45d9ad=['waitUntil','notification','20673aXYLrA','navigator','title','focus','icon','toLowerCase','image','168378lbyyZD','193689SqVukM','41896sLUVSk','macintosh','close','registration','userAgent','body','1253fKQvUq','2054765fkWElD','install','includes','openWindow','badge','4620004XrYmFj','notificationclick','ko-KR','url','showNotification','parse','바로가기','window','platform','mac','actions','1490bVkBER','action','1993722LznGRH','navigate','button','activate','12Yewkpl','push','matchAll','data','then','addEventListener'];a0_0x3c7d=function(){return _0x45d9ad;};return a0_0x3c7d();}self['addEventListener'](a0_0x5374e1(0x192),_0x220cef=>{self['skipWaiting']();}),self[a0_0x5374e1(0x17e)](a0_0x5374e1(0x178),_0x4e57ea=>{const _0x4e29f9=a0_0x5374e1;_0x4e57ea[_0x4e29f9(0x17f)](clients['claim']());}),self[a0_0x5374e1(0x17e)](a0_0x5374e1(0x17a),function(_0x5b8772){const _0x578b75=a0_0x5374e1,_0x6a0810=JSON[_0x578b75(0x19b)](_0x5b8772[_0x578b75(0x17c)]['text']()),_0x41c647=navigator['language'],_0x3709b8=_0x41c647==='ko'||_0x41c647===_0x578b75(0x198),_0x398015=self[_0x578b75(0x182)]['platform']['toLowerCase']()[_0x578b75(0x193)](_0x578b75(0x171)),_0x570dee=self[_0x578b75(0x182)]['userAgent']['toLowerCase']()[_0x578b75(0x193)](_0x578b75(0x18b)),_0x417e2c={'tag':'renotify','renotify':!![],'body':_0x6a0810[_0x578b75(0x18f)],'icon':_0x6a0810[_0x578b75(0x185)],'badge':_0x6a0810[_0x578b75(0x195)],'requireInteraction':!![],'vibrate':[0x12c,0x64,0x190,0xc8,0x1f4],'data':_0x6a0810,'actions':[{'action':'go','type':_0x578b75(0x177),'title':_0x3709b8?_0x578b75(0x19c):'GO'},{'action':_0x578b75(0x18c),'type':'button','title':_0x3709b8?'닫기':'CLOSE'}]};_0x6a0810[_0x578b75(0x187)]&&(_0x417e2c[_0x578b75(0x187)]=_0x6a0810[_0x578b75(0x187)]),(_0x398015||_0x570dee)&&delete _0x417e2c[_0x578b75(0x172)],_0x5b8772['waitUntil'](self[_0x578b75(0x18d)][_0x578b75(0x19a)](_0x6a0810[_0x578b75(0x183)],_0x417e2c));}),self[a0_0x5374e1(0x17e)](a0_0x5374e1(0x197),function(_0x278188){const _0x1737d2=a0_0x5374e1;_0x278188['notification'][_0x1737d2(0x18c)]();const _0x381024=self['navigator'][_0x1737d2(0x170)][_0x1737d2(0x186)]()[_0x1737d2(0x193)]('mac'),_0x419533=self[_0x1737d2(0x182)][_0x1737d2(0x18e)][_0x1737d2(0x186)]()[_0x1737d2(0x193)](_0x1737d2(0x18b));if(_0x381024||_0x419533)_0x278188[_0x1737d2(0x17f)](clients[_0x1737d2(0x17b)]({'type':_0x1737d2(0x19d)})[_0x1737d2(0x17d)](_0x55a8eb=>{const _0x25611a=_0x1737d2;_0x55a8eb['length']>0x0?(_0x55a8eb[0x0][_0x25611a(0x176)](_0x278188[_0x25611a(0x180)][_0x25611a(0x17c)][_0x25611a(0x199)]),_0x55a8eb[0x0][_0x25611a(0x184)]()):clients[_0x25611a(0x194)](_0x278188[_0x25611a(0x180)]['data'][_0x25611a(0x199)]);}));else switch(_0x278188[_0x1737d2(0x174)]){case'go':_0x278188[_0x1737d2(0x17f)](clients[_0x1737d2(0x194)](_0x278188[_0x1737d2(0x180)][_0x1737d2(0x17c)][_0x1737d2(0x199)]));break;case _0x1737d2(0x18c):break;default:_0x278188['waitUntil'](clients[_0x1737d2(0x194)](_0x278188[_0x1737d2(0x180)][_0x1737d2(0x17c)][_0x1737d2(0x199)]));}});

Cara menerapkan notifikasi push

  1. 1 Di menu [Developer API] pada dasbor, buat API Key, lalu daftarkan domain di [Pesan Push → Manajemen Domain] dan periksa publicKey.
  2. 2 Eksekusi otomatis tepat setelah halaman dimuat dapat diblokir oleh browser. Panggil webpush.register() di dalam interaksi pengguna, seperti klik tombol.
  3. 3 Simpan file sw.min.js lalu unggah ke jalur root situs Anda. Contoh: https://example.com/sw.min.js

Di halaman sampel, klik tombol Permission Request untuk memastikan popup izin notifikasi muncul. Jika memilih Izinkan, Anda dapat melihat data langganan di dasbor pada halaman [Kirim Push Situs Web].