Sometimes I receive the following notification "The site has been updated in the background"out of nowhere?

[kanodia]

Sometimes when I send a notification, I receive the following notification with the content as "The site has been updated in the background".

I never write this text. I think it is an one signal SDK bug. How can I fix this?

[jasonpang]

Hi there,

The message This site has been updated in the background is a forced message from the Chrome browser when our SDK cannot fetch the notification contents to retrieve. Notification contents are not sent to our background worker; instead we receive a signal to display a notification and then we fetch the notification contents from our server.

This behavior is most likely triggered by the user having multiple notifications pings, but only one message to receive.

[ghost]

Hii,
This is our php code for sending push notifications.some time we get write data and some times we get wrong data that the site has been updated in the background.
The same issue we face while sending notification from one signal Dashboard also.
Please let us know if we need to make any changes in this code.

$heading ); $message = array( "en" => $message ); $s = explode(",", $listofID); ``` $fields = array( 'app_id' => "xxxxxxxxxxxxxxxxx", ``` // 'included_segments' => array('All'), 'data' => array("foo" => "bar"), 'headings' => $heading, 'contents' => $message, 'include_player_ids' => $s, 'url' => $clickurl, 'chrome_web_icon' => $icon, 'firefox_icon' => $icon ); ``` $fields = json_encode($fields); print("\nJSON sent:\n"); print($fields); $ch = curl_init(); curl_setopt($ch, CURLOPT_URL, "https://onesignal.com/api/v1/notifications"); curl_setopt($ch, CURLOPT_HTTPHEADER, array('Content-Type: application/json', 'Authorization: Basic xxxxxxxxxxxxxxxx')); curl_setopt($ch, CURLOPT_RETURNTRANSFER, TRUE); curl_setopt($ch, CURLOPT_HEADER, FALSE); curl_setopt($ch, CURLOPT_POST, TRUE); curl_setopt($ch, CURLOPT_POSTFIELDS, $fields); curl_setopt($ch, CURLOPT_SSL_VERIFYPEER, FALSE); $response = curl_exec($ch); curl_close($ch); return $response; ``` } $response = sendMessage($listofID,$heading,$message,$clickurl,$icon); $return["allresponses"] = $response; $return = json_encode( $return); print("\n\nJSON received:\n"); print($return); print("\n"); ?>

[taufansatrio]

Any updates on this issue? I am also experiencing this and hoping for a fix/workaround

[jasonpang]

Hey @taufansatrio,

Sorry for the delay in getting back to you. The problem wouldn't be in your push code. It's possible our service worker is being overridden by another service worker that's not able to handle the incoming event which is why Chrome shows a forced message instead. Could you please provide the public URL to your site so that we can investigate the issue more? More importantly, please also let us know if you're using any third-party push providers in addition to ours, or if your site installs a service worker.

[jasonpang]

Hey @taufansatrio,

Our service workers OneSignalSDKWorker.js and OneSignalSDKUpdaterWorker.js aggressively overwrite other service workers that are registered with the topmost (site root) service worker scope; would it be possible to import your other service workers into our service worker alternatively?

So for example, currently the contents contents of both OneSignalSDKWorker.js and OneSignalSDKUpdaterWorker.js are the following:

importScripts('https://cdn.onesignal.com/sdks/OneSignalSDK.js');

Could you try to modify both the contents of OneSignalSDKWorker.js and OneSignalSDKUpdaterWorker.js to import your other service worker files like so?

importScripts('https://site.com/my-other-service-worker.js');
importScripts('https://cdn.onesignal.com/sdks/OneSignalSDK.js');

We recommend the above approach instead of importing our service worker into another file because our web SDK kicks out other workers that are registered on the root scope and replaces it with our files.

Please note that all of this only applies if you're trying to register service workers to the root scope 'https://site.com/other-worker.js'. If you're trying to register a service worker only under a specific sub-directory 'https://site.com/some-subdirectory/other-worker.js', that service worker should not be kicked out (though I could be wrong we haven't really tested that).

More about service workers can be read here.

[jasonpang]

If anybody else is experiencing the original issue mentioned, I've updated this comment to better explain it. Most likely a second SW issue.

[jasonpang]

Documenting all the ways:

This site has been updated in the background.

can occur:

Technically, why it occurs: When our service worker receives a push event, it has to fetch the actual notification from OneSignal's servers, since we have (at this time) not yet implemented the new web push payload protocol. If we successfully fetch a notification, we display it. Otherwise this error occurs if we can't display a backup notification.

• No messages to fetch from OneSignal
• A third-party service worker is running, which will still receive the push event, but will not know what to do. There is another service worker besides our own that is forced to handle the incoming message event (whichever service worker is active at the time an incoming message is received is the worker that handles the message event), but does not have any message to display (since we sent the message and if the active service worker isn't ours it doesn't know where to retrieve the message from; we retrieve the message from our servers). Examples of how you can end up with another service worker is: you're using two push providers at once (e.g. OneSignal and PushCrew) since each installs its own service worker, or if you're using Google Polymer (it comes with a service worker).
• An IndexedDB error occurs (ServiceWorker.js:693 DOMException: Failed to execute 'transaction' on 'IDBDatabase': The database connection is closing.(…)) which prevents our service worker from being able to retrieve the necessary settings so the method fails, no notification is displayed, and they get this message
  • About this, just confirmed that as long as all the tabs to the site and the service worker stops running, the error will self-correct (after all IndexedDB just wants to close the connection). Subscription is unaffected and I was able to see a real sent notification after. I did have to manually stop the service worker since it was still running.
• Internet connection fails when the notification is being retrieved, or possibly some ultra power saving modes on some devices will let the GCM signal through, but Chrome won't be able to make normal network requests to our server to retrieve the notification due to the ultra power saving mode (Josh says this may not be accurate)

[aumouth]

I have this issue ("This site has been upgraded in the backgrou..") too.

I have a service worker for a Web App Install Banner, as specified at https://developers.google.com/web/fundamentals/engage-and-retain/app-install-banners/

The Web App Install Banner calls for the following JS code output by my website to the browser ...
<script> // https://developers.google.com/web/fundamentals/engage-and-retain/app-install-banners/ if ('serviceWorker' in navigator) { window.addEventListener('load', function() { navigator.serviceWorker.register('/service-worker.js', {scope: '/'}).then(function(registration) { // Registration was successful console.log('ServiceWorker registration successful with scope: ', registration.scope); }).catch(function(err) { // registration failed :( console.log('ServiceWorker registration failed: ', err); }); }); } </script>

How would I modify the above for usage with OneSignal, considering the comment above about OneSignal aggressively overwriting others, and editing the OneSignal[...].js to import.

[vedmant]

I have the same issue with very basic install from OneSIgnal documentation. Safari works normally, but Chrome shows "This site has been updated in the background"

[miguelmobilat]

I have the same problem in flutter web, it seems that there is a conflict between the service workers with flutter and onesignal.

<!DOCTYPE html>
<html lang="es">


<head>
  <base href="$FLUTTER_BASE_HREF">

  <meta charset="UTF-8">
  <meta content="IE=Edge" http-equiv="X-UA-Compatible">
  <meta content="A new Flutter project." name="description">

  <!-- iOS meta tags & icons -->
  <meta content="yes" name="apple-mobile-web-app-capable">
  <meta content="black" name="apple-mobile-web-app-status-bar-style">
  <meta content="back_office" name="apple-mobile-web-app-title">
  <link href="icons/Icon-192.png" rel="apple-touch-icon">

  <!-- Favicon -->
  <link href="favicon.png" rel="icon" type="image/png" />

  <title>back_office</title>
  <link href="manifest.json" rel="manifest">
  <script
    src="https://maps.googleapis.com/maps/api/js?key=KEY&loading=async&callback"></script>
  <script src="https://cdn.onesignal.com/sdks/web/v16/OneSignalSDK.page.js" defer></script>
  <script defer src="flutter.js"></script>

  <style>
    body {
      margin: 0;
      padding: 0;
      background-color: #101820;
    }

    .container {
      width: 100vw;
      height: 100vh;
      display: flex;
      /* Default Axis is X*/
      justify-content: center;
      /* Main Axis */
      align-items: center;
      /* Cross Axis */
    }

    .indicator {
      width: auto;
    }
  </style>
</head>

<body>
  <div id="loading" class="container">
    <img class="indicator" src="./assets/loading.svg" />
  </div>
  <script>
    const serviceWorkerVersion = null;
  </script>
  <script>
    window.addEventListener('load', function (ev) {
      var loading = document.querySelector('#loading');
      _flutter.loader.loadEntrypoint({
        serviceWorker: {
          serviceWorkerVersion: serviceWorkerVersion,
        },
        onEntrypointLoaded: async function (engineInitializer) {
          let appRunner = await engineInitializer.initializeEngine();
          loading.style.display = 'none'
          await appRunner.runApp();
        }
      });
    });
  </script>
  <script>
    window.OneSignalDeferred = window.OneSignalDeferred || [];
    OneSignalDeferred.push(function (OneSignal) {
      OneSignal.init({
        appId: "KEY",
      });
    });
  </script>
</body>

</html>

[dongph9x]

@vedmant @miguelmobilat
It seems like onesignal's sw is conflicting with some sw, I solved it
Solution: change the path and scope of OneSignalSDKWorker.js so that it is unique
link docs: https://documentation.onesignal.com/docs/onesignal-service-worker-faq#integrating-multiple-service-workers
please search to text: It is ok to put multiple service workers in the same location path, but MUST have unique scope path.

Config Ex:
serviceWorkerParam: { scope: "/onesignal/push-notifications/" },
serviceWorkerPath: "onesignal/push-notifications/OneSignalSDKWorker.js",