Search code examples
javascriptweb-workerindexeddb

Accessing IndexedDB from multiple javascript threads

Overview: I am trying to avoid a race condition with accessing an IndexedDB from both a webpage and a web-worker.

Setup: Webpage that is saving items to the local IndexedDB as the user works with the site. Whenever a user saves data to the local DB the record is marked as "Unsent".

Web-worker background thread that is pulling data from the IndexedDB, sending it to the server and once the server receives it, marking the data in the IndexedDB as "Sent".

Problem: Since access to the IndexedDB is asynchronous, I can not be guaranteed that the user won't update a record at the same time the web-worker is sending it to the server. The timeline is shown below:

  1. Web-worker gets data from DB and sends it to the server
  2. While the transfer is happening, the user updates the data saving it to the DB.
  3. The web-worker gets the response from the server and then updates the DB to "Sent"
  4. There is now data in DB that hasn't been sent to the server but marked as "Sent"

Failed Solution: After getting the response from the server, I can recheck to row to see if anything has been changed. However I am still left with a small window where data can be written to the DB and it will never be sent to the server.

Example: After server says data is saved, then:

IndexedDB.HasDataChanged(
    function(changed) { 
        // Since this is async, this changed boolean could be lying.
        // The data might have been updated after I checked and before I was called.
        if (!changed){ 
          IndexedDB.UpdateToSent() }
    });

Other notes: There is a sync api according to the W3 spec, but no one has implemented it yet so it can not be used (http://www.w3.org/TR/IndexedDB/#sync-database). The sync api was designed to be used by web-workers, to avoid this exact situation I would assume.

Any thoughts on this would be greatly appreciated. Have been working on it for about a week and haven't been able to come up with anything that will work.

Solution

  • I think I found a work around for this for now. Not really as clean as I would like, but it seems to be thread safe.

    I start by storing the datetime into a LastEdit field, whenever I update the data. From the web-worker, I am posting a message to the browser.

    self.postMessage('UpdateDataSent#' + data.ID + '#' + data.LastEdit);

    Then in the browser I am updating my sent flag, as long as the last edit date hasn't changed. 

    // Get the data from the DB in a transaction
if (data.LastEdit == lastEdit)
{
    data.Sent = true;
    var saveStore = trans.objectStore("Data");
    var saveRequest = saveStore.put(data);
    console.log('Data updated to Sent');
}

    Since this is all done in a transaction in the browser side, it seems to work fine. Once the browsers support the Sync API I can throw it all away anyway.