Chrome-Erweiterung warten, bis Einstellungen in einem Event-Handler geladen werden

Question

Ich entwickle eine Chrome-Erweiterung mit Einstellungen (im Grunde zwei Flags), die im lokalen Chrome-Speicher beibehalten werden.

sparen:

function save_options() { 
    var checkbox1checked = $("#checkbox1").prop("checked"); 
    var checkbox2checked = $("#checkbox2").prop("checked"); 
    chrome.storage.sync.set({ 
    checkbox1: checkbox1checked, 
    checkbox2: checkbox2checked 
    }, function() { 
    $("#status").text("Settings saved."); 
    window.setTimeout(function() { 
     $("#status").text(""); 
    }, 2000); 
    }); 
} 

Abrufen:

function restore_options() { 
    chrome.storage.sync.get({ 
    checkbox1: true, 
    checkbox2: false 
    }, function(items) { 
    $("#checkbox1").prop("checked", items.checkbox1); 
    $("#checkbox2").prop("checked", items.checkbox2); 
    }); 
} 

Und dann in meinem Content-Skript schrieb ich eine Funktion abrufen kann ich die gespeicherten Einstellungen in Ordnung auf der Seite Optionen wie diese speichern und abrufen die Einstellungen einfach so:

var checkbox1Checked = true; 
var checkbox2Checked = false; 
    function getSettings() { 
     chrome.storage.sync.get({ 
     checkbox1: true, 
     checkbox2: false 
     }, function(items) { 
     checkbox1Checked = items.checkbox1; 
     checkbox2Checked = items.checkbox2; 
     }); 
    } 

Und ich bin ein Event-Handler für die 'Pas hinzufügen te‘Ereignis wie folgt aus:

window.addEventListener('paste', handlePaste, true); 

Und in der handlePaste Funktion, ich rufe die GetSettings() Funktion. Das Problem ist jedoch, dass die weitere Logik des Ereignisses entscheidet, ob das Ereignis basierend auf den Erweiterungseinstellungen abgebrochen werden soll.

Meine Logik ist nach dem Aufruf von getSettings(), aber anscheinend wird es ausgeführt, bevor die Variablen mit den aktualisierten Werten initialisiert werden, da ich erst ab dem zweiten Auftreten des Einfügeereignisses die korrekte Funktionalität sehen kann.

Also suche ich nach einer Möglichkeit, irgendwie auf das Laden der Einstellungen zu warten und dann mit der Ausführung des Event-Handlers fortzufahren. Dinge, die ich bereits versucht habe:

1. Ich habe versucht, meine Logik in den Rückruf für die Einstellungen Abruf zu schreiben. Dies funktioniert jedoch nicht, da die Handler-Funktion nach der Registrierung des Callbacks zurückkehrt und zusätzliche Handler weiterhin ausgeführt werden, während der asynchrone Vorgang ausgeführt wird, wodurch das spätere Annullieren des Ereignisses unmöglich wird.

2. Ich habe versucht zu warten, dass die Einstellungen mit window.setTimeout und anderen ähnlichen Lösungen geladen werden, ohne Erfolg.

3. Es ist mir aufgefallen, dass ich, wenn ich die Einstellungen speichere, irgendeine Art von Nachricht von der Optionsseite an alle Seiten senden kann, auf denen die Inhaltsskripte laufen und sie jetzt über die geänderten Einstellungen informieren. Ich habe das noch nicht versucht und bin mir nicht sicher, ob das überhaupt möglich ist.

4. Ich habe versucht, das Ereignis irgendwie zu klonen, dann annulliere es und wenn die Einstellungen geladen sind, feuere das geklonte Ereignis falls notwendig erneut ab. Aber ich hatte Schwierigkeiten mit dem Klonen eines Paste Events.

Wie soll ich dieses Problem lösen? Jede Hilfe wird sehr geschätzt, bitte beachten Sie, dass dies meine erste Chrome-Erweiterung ist (ich entwickle es für den persönlichen Gebrauch).

Answer 1

Das Inhaltsskript sollte die Einstellungen abrufen, sobald es gestartet und dann beendet wird. Die Ausführung sollte in der Rückruffunktion des Aufrufs chrome.storage.sync.get() fortgesetzt werden, die chrome.storage.onChanged.addListener() verwenden sollte, um einen Ereignishandler für das Ereignis chrome.storage.onChanged hinzuzufügen, damit die abgerufenen Einstellungen auf dem neuesten Stand gehalten werden können. Die abgerufenen Einstellungen sollten in einer Variablen gespeichert werden, auf die der Einfüge-Ereignishandler zugreifen kann, damit er immer auf die aktuellen Werte der Einstellungen zugreifen kann.

zB

var checkbox1Checked, checkbox2Checked; 
chrome.storage.sync.get({ 
    checkbox1: true, 
    checkbox2: false 
}, function(items) { 
    checkbox1Checked = items.checkbox1; 
    checkbox2Checked = items.checkbox2; 
    chrome.storage.sync.onChanged.addListener(function(changes, area) { 
     if (area !== "sync") return; 
     if (changes.checkbox1) { 
      checkbox1Checked = changes.checkbox1.newValue; 
     } 
     if (changes.checkbox2) { 
      checkbox2Checked = changes.checkbox2.newValue; 
     } 
    }); 
    window.addEventListener('paste', handlePaste, true); 
}); 

Nun ist die Paste Event-Handler können die Einstellungen zugreifen sofort in den Variablen checkbox1Checked und checkbox2Checked ohne chrome.storage.sync.get() anrufen zu müssen. Der Handler wird in der Callback-Funktion chrome.storage.sync.get() hinzugefügt, sodass er nicht aufgerufen werden kann, bevor die Einstellungsvariablen initialisiert wurden.