Bhaveshpp

Professional Magento Developr - Healp eachother to grow

How to test firebase push notification?

21 May 2021 » firebase, javascript, php

I am working on firebase push notificatio Add bellow html code :


<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="initial-scale=1.0">
    <title>Firebase Messaging Demo</title>
    <style>
        div {
            margin-bottom: 15px;
        }
    </style>
</head>
<body>
    <div id="token"></div>
    <div id="msg"></div>
    <div id="notis"></div>
    <div id="err"></div>
    <script src="https://www.gstatic.com/firebasejs/8.6.2/firebase-app.js"></script>
    <script src="https://www.gstatic.com/firebasejs/7.16.1/firebase-messaging.js"></script>
    <script>
        MsgElem = document.getElementById("msg");
        TokenElem = document.getElementById("token");
        NotisElem = document.getElementById("notis");
        ErrElem = document.getElementById("err");
        // Initialize Firebase
        // TODO: Replace with your project's customized code snippet
        var config = {
            'messagingSenderId': '1234567890', //sender id
            'apiKey': 'api1234567890', // Api key
            'projectId': 'projectid', // Project id
            'appId': '1234567890', // App Id
        };
        firebase.initializeApp(config);

        const messaging = firebase.messaging();
        messaging
            .requestPermission()
            .then(function () {
                MsgElem.innerHTML = "Notification permission granted." 
                console.log("Notification permission granted.");

                // get the token in the form of promise
                return messaging.getToken()
            })
            .then(function(token) {
                TokenElem.innerHTML = "token is : " + token
            })
            .catch(function (err) {
                ErrElem.innerHTML =  ErrElem.innerHTML + "; " + err
                console.log("Unable to get permission to notify.", err);
            });

    </script>
</body>
</html>

Test your push notification using curl call

// Generated @ codebeautify.org
$ch = curl_init();

$data = [
    "data"=>[
        "notification" => "test.html",
        "title" => "test Notification",
        "body" => "test body",
        "icon" => "fevicon.ico"
    ],
    "to" => $_GET['to']
];

curl_setopt($ch, CURLOPT_URL, 'https://fcm.googleapis.com/fcm/send');
curl_setopt($ch, CURLOPT_RETURNTRANSFER, 1);
curl_setopt($ch, CURLOPT_POST, 1);
curl_setopt($ch, CURLOPT_POSTFIELDS, json_encode($data));

$headers = array();
$headers[] = 'Authorization: key=<SENDER KEY>';
$headers[] = 'Content-Type: application/json';
curl_setopt($ch, CURLOPT_HTTPHEADER, $headers);

$result = curl_exec($ch);
echo "<pre>";
print_r($result);

echo "<br/>";
echo "</pre>";
if (curl_errno($ch)) {
    echo 'Error:' . curl_error($ch);
}
curl_close($ch);

Pass push.php?to= to push notification to user Then you will get responce like this

{
    "multicast_id": 7370808702996159000,
    "success": 0,
    "failure": 1,
    "canonical_ids": 0,
    "results": [
        {
            "error": "MissingRegistration"
        }
    ]
}