Comment utiliser localForage de manière synchrone

Question

J'ai une application mobile Cordova qui stocke des données hors ligne dans localStorage. Récemment, les utilisateurs ont commencé à recevoir l'erreur QUOTA_EXCEEDED_ERR parce que localStorage est limité à 5 Mo. J'ai décidé d'utiliser le framework "localForage", mais j'ai remarqué qu'il fonctionne de manière asynchrone. Comme je ne veux pas réécrire toutes mes applications complexes en fonctions de rappel, je voulais savoir s'il existait un moyen d'utiliser "localForage" de manière synchrone (en attendant que la fonction getItem renvoie une valeur).

Voici un exemple de code de ce que j'essaie de faire :

localforage.setItem('testKey', 'testValue', function() {
  var value = getValue('testKey');

  console.log(value); // here I get undefined, but I want to get a value
});

function getValue(key) { // I want this function to return value
  var result;
    localforage.getItem(key, function(value) {
    result = value;
  });

  return result;
}

Je veux que getValue() renvoie une valeur sans modifier aucun autre code.

Answer 1

Selon cette lien

localForage dispose d'une double API qui vous permet d'utiliser des callbacks de style Node ou des Promesses. ou des Promesses. Si vous n'êtes pas sûr de savoir laquelle vous convient le mieux, il est recommandé d'utiliser les Promesses.

Vous pouvez donc utiliser n'importe lequel d'entre eux si vous le souhaitez. Si vous utilisez des promesses vous pouvez utiliser async/await pour attendre le résultat

localforage.setItem('testKey', 'testValue', async function() {
  var value = await getValue('testKey')

  console.log(value); // here I get undefined, but I want to get a value
});

 async function getValue(key) { 
  var result = await localforage.getItem(key);
  return result;
}

jsfiddle

Answer 2

https://localforage.github.io/localForage/#data-api-getitem utiliser async / await :

try {
    const value = await localforage.getItem('somekey');
    // This code runs once the value has been loaded
    // from the offline store.
    console.log(value);
} catch (err) {
    // This code runs if there were any errors.
    console.log(err);
}

Answer 3

localforage.setItem('testKey', 'testValue', async function() {//declare function as async
  var value = await getValue('testKey'); //wait for the value

  console.log(value); // "testValue" value should show in console
});

//declare function as async
async function getValue(key) {
  var result = await localforage.getItem(key); //wait for the localforage item

  return result;
}

JSFiddle ici : https://jsfiddle.net/mvdgxorL/

Answer 4

Je n'ai pas testé cela et je n'ai aucune expérience avec localForage, mais je suppose que si vous définissez votre résultat comme la valeur de retour de la callback et que vous la renvoyez, c'est ce que vous recherchez.

function getValue(key) { 
  var result = localforage.getItem(key, function(err, value) {
    return value;
  });
  return result;
}