Created
April 7, 2025 10:39
-
-
Save jalallinux/8e42f1f3df9479788f3a8e72723765c0 to your computer and use it in GitHub Desktop.
Get and Test FCM push notification
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| importScripts('https://www.gstatic.com/firebasejs/10.8.1/firebase-app-compat.js'); | |
| importScripts('https://www.gstatic.com/firebasejs/10.8.1/firebase-messaging-compat.js'); | |
| firebase.initializeApp({ | |
| apiKey: "__apiKey__", | |
| authDomain: "__authDomain__", | |
| projectId: "__projectId__", | |
| storageBucket: "__storageBucket__", | |
| messagingSenderId: "__messagingSenderId__", | |
| appId: "__appId__", | |
| }); | |
| const messaging = firebase.messaging(); |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| <!DOCTYPE html> | |
| <html lang="en"> | |
| <head> | |
| <meta charset="UTF-8" /> | |
| <meta name="viewport" content="width=device-width, initial-scale=1.0" /> | |
| <title>FCM Token Viewer</title> | |
| <script src="https://www.gstatic.com/firebasejs/9.6.11/firebase-app-compat.js"></script> | |
| <script src="https://www.gstatic.com/firebasejs/9.6.11/firebase-messaging-compat.js"></script> | |
| </head> | |
| <body> | |
| <h2>Firebase Messaging Token</h2> | |
| <pre id="token">Loading...</pre> | |
| <h2>Receive notifications</h2> | |
| <button onclick="sendNotification()">Send notification</button> | |
| <script> | |
| function showNotification() { | |
| new Notification("🔥 Test notification title", { | |
| body: "Test notification body.", | |
| icon: "https://firebase.google.com/images/social.png" | |
| }); | |
| } | |
| function sendNotification() { | |
| if (!("Notification" in window)) { | |
| alert("Browser don't support notification."); | |
| return; | |
| } | |
| if (Notification.permission === "granted") { | |
| showNotification(); | |
| } else if (Notification.permission !== "denied") { | |
| Notification.requestPermission().then(permission => { | |
| if (permission === "granted") { | |
| showNotification(); | |
| } | |
| }); | |
| } | |
| } | |
| // TODO: Replace with your Firebase config | |
| const firebaseConfig = { | |
| apiKey: "__apiKey__", | |
| authDomain: "__authDomain__", | |
| projectId: "__projectId__", | |
| storageBucket: "__storageBucket__", | |
| messagingSenderId: "__messagingSenderId__", | |
| appId: "__appId__", | |
| }; | |
| // Initialize Firebase | |
| firebase.initializeApp(firebaseConfig); | |
| const messaging = firebase.messaging(); | |
| // Request permission and get token | |
| messaging | |
| .getToken({ vapidKey: "__VAPID__" }) | |
| .then((currentToken) => { | |
| console.log(currentToken); | |
| if (currentToken) { | |
| document.getElementById("token").textContent = currentToken; | |
| } else { | |
| document.getElementById("token").textContent = "No registration token available. Request permission to generate one."; | |
| } | |
| }) | |
| .catch((err) => { | |
| console.error("An error occurred while retrieving token. ", err); | |
| document.getElementById("token").textContent = "Error: " + err.message; | |
| }); | |
| </script> | |
| </body> | |
| </html> |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment