0

ストレージを使用している chrome 拡張機能があり、1 回のエンター クリックでストレージから値を取得できません。

入力フィールドは 1 つです。ユーザーが値を入力して Enter キーを押すと、拡張機能はストレージから値を取得し、ユーザーの入力をこの値に追加する必要があります。最初の Enter キーは機能しませんが、ユーザーが 2 回目に Enter キーを押すと、保存された値が表示されます。

問題は関数の順序にある​​と思いますが、どこが正確かわかりません。

正しい順序でコード化:

var repo, moduleCodes, url;

// Third process
function getStoredUrl() {
    chrome.storage.sync.get(function (item) {
        url = item.savedUrl;
    });
}

// Fourth process
function setVariables() {
    repo = document.getElementById("repo").value.toLowerCase();

    moduleCodes = {
        admin: "EHEALTHADM"
    };
}

// Second process
function openGraph() {

    getStoredUrl();
    setVariables();

    if (moduleCodes[repo] !== undefined) {
        // ERROR: field "test" doesn't have value url, but should to have
        document.getElementById("test").value = url;
        //window.open(url + moduleCodes[repo]);
    } else {
        returnError("Can't find repo " + repo, "repo");
    }
}

var enter = 13;

// First process
function inputRepoListener(e) {
    "use strict";

    if (e.keyCode === enter) {
        openGraph();
    }
}

コード全体は gitHub リポジトリで見ることができます: https://github.com/iriiiina/fisheyeGraph

4

1 に答える 1

1

これは、非同期メソッド呼び出しによって引き起こされる典型的な競合状態です。

への呼び出しstorage.sync.getは非同期です。つまり、ストレージ値が取得されている間、通常のプログラム フローが続行されます。これは、ストレージ値の取得が完了する前にurl、 id を持つ要素への (まだ空の) 変数の割り当ても行われることを意味しtestます。

解決策:ストレージ値が取得された後storage.sync.getに発生するすべての処理を のコールバックに移動します。たとえば、そのurlように割り当てると、機能します。

chrome.storage.sync.get(function (item) {
    url = item.savedUrl;
    document.getElementById("test").value = url;
});

したがって、この基準を満たすためにコードを再構築する必要があります。

于 2014-09-02T18:37:19.633 に答える