Redeem Now
Read More
Read now
Menu Close
    Start a Project Request quote Reading list Switch to dark mode

    How to receive push notification in your web browser

    As all developers know we can push notifications in our mobile device even when our app is not running.

    We can do same in our web browser too.

    How is it possible to get notified even when our web page is not running in our web browser.

    There is a simple concept known as Service Worker. These service worker are like all time running observers which waits for notification. They work on behalf for your website which shows notification to you even when your site is not running.

    We know that today we have email, sms, newsletters and many more medium to connect to our users but still we need more better way to connect to our users.

    Every technique have their own pros and cons. If we talk about Web Push notification, then there is one biggest advantage of web push notification. User gets immediately notified as when he/she opens his/her web browser. It is the quickest way to get notified.

    How to implement this feature in your webpage.

    You just have follow these simple steps to enable push notification on your web browser.

    1. Register Service worker
    2. Get GCM WebDesigned to work with the SSL certificate websites that means or FCM API key and create web app manifest.
    3. Link manifest to your browser.

    Step 1: How to Register service worker in web browser.

    Step 2: Goto FCM console and create a project. Create manifest for your web site.

    Step 3: Link Manifest to your web site.

    Service worker content:

    get_data.json returns json data which will be used by service worker.

    To push you just need to hit a curl command:
    PHP code:

    You can visit Push Notification demo for working demo of push notification.

    Note: Web push notification works only in localhost and SSL https enabled sites.


    That’s all for how to receive push notification in your web browser, still have any issue feel free to ask query.
    You can comment or raise a ticket.

    . . .

    Leave a Comment

    Your email address will not be published. Required fields are marked*

    Be the first to comment.

    Back to Top
    Hire Us!
    Brief us about your requirements and we'll get back to you.
    Woo! Hooy!
    We have just recieved your project brief and our expert will contact you shortly.
    Send Again

    Table of Content

    Hide Index