title: firebase cloud messaging onMessage function not working if user block the permission
body: <p>I'm trying to send a web notification using FCM.</p>
  
  <p>When page load, it will ask the permission and send the web notification to the user. Also, the latest data will append to the frontend without refresh. Below code works fine when a user gives the permission to receive the web notification in the browser.</p>
  
  <p>However, when page load if user didn't accept the web notification then <code>onMessage</code> function is not working and the latest data not append to the frontend. It works when the user clicks the refresh manually.</p>
  
  <p>The requirement is if there is any new data added to the database then it should append to the frontend without refresh. I thought to append the latest data using <code>onMessage</code> function. Is this the right approach or any other solution? Please help..</p>
  
  <p>JavaScript</p>
  
  <pre><code>// Initialize Firebase
      var config = {
          apiKey: "***"
          , authDomain: "***"
          , databaseURL: "***"
          , projectId: "***"
          , storageBucket: "***"
          , messagingSenderId: "***"
      };
      firebase.initializeApp(config);
  
      // Retrieve Firebase Messaging object.
      const messaging = firebase.messaging();
      messaging.requestPermission()
      .then(function() {
          console.log('Notification permission granted.');
          if(isTokenSentToServer()){
              console.log('Token already saved');
          } else {
              getRegToken();
          }
  
      }).catch(function(err) {
          console.log('Unable to get permission to notify.', err);
      });
  
      function getRegToken(argument){
          messaging.getToken()
          .then(function(currentToken) {
              if (currentToken) {
                  saveToken(currentToken);
                  console.log(currentToken);
                  setTokenSentToServer(true);
              } else {
                  console.log('No Instance ID token available. Request permission to generate one.');
                  setTokenSentToServer(false);
              }
              }).catch(function(err) {
                  console.log('An error occurred while retrieving token. ', err);
                  showToken('Error retrieving Instance ID token. ', err);
                  setTokenSentToServer(false);
              });
      }
  
      function setTokenSentToServer(sent) {
          window.localStorage.setItem('sentToServer', sent ? 1 : 0);
      }
  
      function isTokenSentToServer() {
          return window.localStorage.getItem('sentToServer') == 1;
      }
      function saveToken(currentToken){
          $.ajax({
              url: 'action.php',
              method: 'post',
              data: 'token=' + currentToken
          }).done(function(result){
              console.log(result);
          })
      }
  
      messaging.onMessage(function(payload){
          console.log('Message recevied', payload);
          notificationTitle = payload.data.title,
          notificationOptions = {
            body: payload.data.body,
            icon: payload.data.icon
          };
          var notification = new Notification(notificationTitle,notificationOptions);
          $(".target").append("&lt;p&gt;"+notificationTitle+"&lt;br&gt;"+payload.data.body+"&lt;/p&gt;");
      });
  </code></pre>
  
  <p>HTML</p>
  
  <pre><code>&lt;div class="target"&gt;&lt;/div&gt;
  </code></pre>