Push notification js

How to make notifications for a computer browser and for a smartphone. A working example of a script for sending notifications to a browser.

Push notification js
Push notification

Often the question arises of how to make the browser send notifications when working with your site. I myself faced this issue, so below I want to attach a JS code that shows how it works. I hope it will be useful for you.

To work, we need a JS plugin (library) from this link.

JS files that we need to work are here.

This is what our script will look like.

  • timeout - This item is unnecessary for me, I want the message to be closed manually.
function start(){
	Push.create("Hello world!", {
    body: "How's it hangin'?",
    icon: '/avatar.png',
	//timeout: 10000,
	requireInteraction: true,
	vibrate: [200, 100],
    onClick: function () {
        window.focus();
        this.close();
    }
});
}

Full page with the code for sending push notifications to the browser.

index.html

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0"/>
    <title>Push nof</title>
    <!-- jQuery -->
    <script src="https://code.jquery.com/jquery-3.5.1.min.js"></script>
	<script src="push.min.js"></script>
	<script src="serviceWorker.min.js"></script>
	   
</head>
<body>
<h1> PUSH NOTIFICATION</h1>
<a href="javascript:void(0)" onclick="start()">Active</a>
</body>
</html>

<script>
function start(){
	Push.create("Hello world!", {
    body: "How's it hangin'?",
    icon: '/avatar.png',
	//timeout: 10000,
	requireInteraction: true,
	vibrate: [200, 100],
    onClick: function () {
        window.focus();
        //this.close();
    }
});
}
</script>

You can download all files from the link below.


https://www.mirrored.to/files/0QDWVVVV/push.rar_links
https://www.upload.ee/files/13999321/push.rar.html
https://www62.zippyshare.com/v/UphfX5KS/file.html