DEV Community

Jaydeep Kachhadiya
Jaydeep Kachhadiya

Posted on

How to send notification on browser?

Browser Send Notification

1) old version Browser not supported.
2) you can easily set a link on click notification
ex: redirect home.html page
3) data keyword in below code used you have pass parameter check name,UserId
bcoz can you find easily send notification successfully or not

Code:

 <html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title></title>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.0/jquery.min.js"></script>
</head>
<body>
    <script type="text/javascript">
        $(document).ready(function () {
            var Message = "Hello ,I am jaydeep!";
            var Title = "Notification";
            var theURL = "";
            var Icon = "";

            if (Notification.permission !== "granted")
                Notification.requestPermission();

            try {
                if (!Notification) {
                    alert('Desktop notifications not available in your browser. Try Chromium.');
                    return;
                }
                if (Notification.permission !== "granted")
                    Notification.requestPermission();
                else {
                    NotificationOption(Message, Title, Icon, theURL);
                }
            } catch (e) {

            }
        });

        function NotificationOption(theBody, theTitle, theIcon, theURL) {
            if (theIcon == "")
                theIcon = "images/favicon.ico";

            var options = {
                body: theBody,
                icon: theIcon,
                data: 'Success Send',
                tag: 'message1'
                //vibrate: [200, 100, 200]
            }
            var notify = new Notification(theTitle, options);

            if (theURL != "") {
                notify.onclick = function () {
                    window.open(theURL);
                };
            }
        }
    </script>
</body>

</html>

Enter fullscreen mode Exit fullscreen mode

Output:
Output of browser notification

Top comments (0)