97 lines
2.9 KiB
JavaScript
97 lines
2.9 KiB
JavaScript
import axios from 'axios';
|
|
|
|
export const initSw = async () => {
|
|
if (!('serviceWorker' in navigator) || !('PushManager' in window)) {
|
|
console.warn('Push messaging is not supported in this browser.');
|
|
return;
|
|
}
|
|
|
|
try {
|
|
const registration = await navigator.serviceWorker.register('/service-worker.js');
|
|
console.log('Service Worker Registered');
|
|
|
|
await initPush();
|
|
} catch (err) {
|
|
console.error('Service Worker registration failed:', err);
|
|
}
|
|
}
|
|
|
|
/**
|
|
* Request permission and trigger subscription
|
|
*/
|
|
const initPush = async () => {
|
|
if (Notification.permission === 'denied') {
|
|
alert('You have blocked notifications. Please click the Lock icon in your address bar to enable them.');
|
|
return;
|
|
}
|
|
|
|
// 2. Request permission (this will only pop up if status is 'default')
|
|
const permission = await Notification.requestPermission();
|
|
|
|
if (permission !== 'granted') {
|
|
console.warn('Notification permission denied or dismissed.');
|
|
return;
|
|
}
|
|
|
|
await subscribeUser();
|
|
}
|
|
|
|
/**
|
|
* Subscribe the user to the Push Manager
|
|
*/
|
|
const subscribeUser = async () => {
|
|
const registration = await navigator.serviceWorker.ready;
|
|
|
|
// Check if a subscription already exists
|
|
let pushSubscription = await registration.pushManager.getSubscription();
|
|
if (pushSubscription) {
|
|
await pushSubscription.unsubscribe();
|
|
console.log('Unsubscribed old record...');
|
|
}
|
|
|
|
const subscribeOptions = {
|
|
userVisibleOnly: true,
|
|
applicationServerKey: urlBase64ToUint8Array(
|
|
import.meta.env.VITE_VAPID_PUBLIC_KEY
|
|
)
|
|
};
|
|
|
|
try {
|
|
pushSubscription = await registration.pushManager.subscribe(subscribeOptions);
|
|
console.log('New Subscription created.');
|
|
} catch (err) {
|
|
console.error('Failed to subscribe user:', err);
|
|
return;
|
|
}
|
|
|
|
|
|
// Send a subscription to Laravel backend
|
|
if (pushSubscription) {
|
|
console.log('Received PushSubscription:', JSON.stringify(pushSubscription));
|
|
await storePushSubscription(pushSubscription);
|
|
}
|
|
}
|
|
|
|
export const storePushSubscription = async (pushSubscription) => {
|
|
try {
|
|
const response = await axios.post('/api/push', pushSubscription);
|
|
console.log('Successfully stored subscription:', response.data);
|
|
} catch (err) {
|
|
console.error('Error storing subscription on server:', err);
|
|
}
|
|
}
|
|
|
|
/**
|
|
* Helper to convert VAPID key
|
|
*/
|
|
function urlBase64ToUint8Array(base64String) {
|
|
if (!base64String) {
|
|
console.error('VITE_VAPID_PUBLIC_KEY is missing from .env');
|
|
return new Uint8Array();
|
|
}
|
|
const padding = '='.repeat((4 - base64String.length % 4) % 4);
|
|
const base64 = (base64String + padding).replace(/-/g, '+').replace(/_/g, '/');
|
|
const rawData = window.atob(base64);
|
|
return Uint8Array.from([...rawData].map((char) => char.charCodeAt(0)));
|
|
}
|