How can I receive the current and published weweb live version with JavaScript?

Developer corner
1

Hi there,

How can I get the current application version number (of our web app) and the published application version using JavaScript code? I need to know this information so I can write a JavaScript script that checks every 15 minutes if a new update is available, and shows the user a popup message asking them to refresh the web page.

Thanks,
Stefan

2

This can be done simply with pwa, are you self hosting?

3

Here is a snippet I use in custom js On App Load.

You can access the version number in your deployments. Save it somewhere and then check the cacheVersion against the deployed version number.

// Get the cache version of the application
let version = window.wwg_cacheVersion;

// Update the variable ['cacheVersion]
wwLib.wwVariable.updateValue('80e49d79-......-8cd291322232', version);

console.log("version: ", version)

return version;
1 Like
4

Hi there,

Thank you for your answer. I will test it here.

Thanks,
Stefan

5

Hi @MichaelLovell

I tried to use your suggestion. However, I do not see a way to determine the current live app version when the user is still using the old version.

@Broberto
Yes it is a self hosting. A code suggestion on PWA will be welcome.

Thanks,
Stefan

6

Hi there,

Another question, how can I edit the default PWA code from weweb to add my custom code for checking the app version number.

Thanks,
Stefan

7

You can edit the service worker to trigger a workflow on app updated, it’s really simple and ChatGPT should be able to do this for you. You should be able to make this with the GPT, in my case, it should be enough for you to go till the step 3. and do the banner in step 4. in WeWeb.

8

For context, I’m using self hosting. When I make a deployment I save a deployment log in my db with the version number. Then I use a workflow On App Load to check whether the cacheVersion matches the latest deployment version. If false, show a a banner message or force a refresh.

9

Hi there,

@Broberto
In ChatGPT, is step 3 not needed for weweb? It uses the default service worker code from weweb.

@MichaelLovell

When I make a deployment I save a deployment log in my db with the version number.
So you use a third-party service like Xano to fetch the version number? I want a solution without any dependencies.

Thanks,
Stefan

10

What I would do is use my prompt, and paste your service worker there for the ChatGPT to alter it accordingly. The prompt I shared is just an example, it’s not in a WeWeb context, even though very similar.

12

Hi there,

I am currently using this code, but the message box (set by a variable) is always on top. When I click the refresh button in my message box, the message box still keeps showing. Each refresh the code think there is a new version. Does anyone have any suggestions on what might be causing this issue and how to solve this problem?

My code, in the app load event:

if('serviceWorker' in navigator){
  navigator.serviceWorker.register('/serviceworker.js').then((registration) => {
    console.log('Service Worker registered with scope:', registration.scope);

    // Check for updates
    registration.onupdatefound = () => {
      const installingWorker = registration.installing;
      installingWorker.onstatechange = () => {
        if(installingWorker.state === 'installed'){
          if(navigator.serviceWorker.controller){
            // New update available
            notifyUserAboutUpdate();
          }
        }
      };
    };
  }).catch((error) => {
    console.error('Service Worker registration failed:', error);
  });
}

function notifyUserAboutUpdate(){
// variable AppUpdateAvailable (boolean)
variables['90b9e60d-521f-40fa-8514-287c0e724eac'] = true;
// window.location.reload();
}

Thanks,
Stefan

13

Hi there,

Does anyone have another working solution that matches the limitations of the weweb platform?

Thanks,
Stefan