Qvault’s Offline Mode in Electron

In preparation to add Bitcoin and cryptocurrency key generation in Qvault, one of the features that was just added was “Offline Mode”. There is now a toggle switch at the top of the app that, when switched off, ensures that no network requests can be made by the app.

Qvault has always been able to be used offline, assuming the user chose not to sign up for Qvault’s cloud backup option. Now, even if a user is storing their encrypted vault files on Qvault servers, the user can choose to go offline and work locally temporarily.

How Does it Work?

Electron has an API that allows developers to intercept and modify web requests. By intercepting all webRequests before they are made using the onBeforeRequest hook, we can check them see if we want to allow each request or not. For example:

// callback({cancel: true}) stops the request before it is sent.
// callback({cancel: false}) sends the webRequest

mainWindow.webContents.session.webRequest.onBeforeRequest({
    // Intercept all webRequests
    urls: [ '<all_urls>' ]
  }, (details, callback) => {
    // allow all filesystem calls
    if (details.url.substring(0, details.url.indexOf(':')) == 'file'){
      callback({cancel: false});
      return;
    }
    // don't allow any network calls if in offlineMode
    if (!onlineMode){
      callback({cancel: true});
      return;
    }
    // allow al other network calls
    callback({cancel: false});
  });

Hopefully this helps anyone else looking to control webRequests in Electron, and helps our users understand ‘offline mode’ in Qvault! Thanks for reading.

By Lane Wagner

The documentation for Electron’s API: https://electronjs.org/docs/api/web-request#webrequestonbeforerequestfilter-listener

A link to our implementation: https://github.com/Q-Vault/qvault/blob/master/main/setupWebRequests.js

Download Qvault: https://qvault.io

Star our Github: https://github.com/Q-Vault/qvault