Chrome拡張機能でbackgroundとcontentで値をやりとりしたい

Question

background.jsからlocalstorageの値をcontent_scriptsで取得したいのですが、何か上手い方法はないでしょうか？
response.dataの値をcontent_scripts内の関数で扱いたいです。以下の様にやってみたのですが上手くいきませんでしたが、希望している動作はこのような感じです。
この実装だと、chrome.runtime.sendMessageの第二引数の関数の処理が終わる前にgetJwt()が終わってしまいtokenがnullのまま処理が進んでしまいます。

//content_scripts
let token = null
let getKey = () => {
    getJwt()
    //tokenを使った処理
}
let getJwt = () => {
    chrome.runtime.sendMessage({ method: 'getItem', key: 'jwt' }, (response) => {
       token = response.data
    })
}

//background
chrome.runtime.onMessage.addListener(function (request, sender, sendResponse) {
    if (request.method == 'getItem')
        sendResponse({ data: localStorage.getItem(request.key) });
    return true;
});

Answer 1

content.js

chrome.runtime.sendMessage(
    { value: { contents: "call background.js" } }
);

chrome.runtime.onMessage.addListener(function (message, sender, sendResponse) {
    console.log(message);
});

background.js

chrome.runtime.onMessage.addListener(
    function (request, sender, sendResponse) {
		chrome.tabs.query({active: true, currentWindow: true}, function(tabs){
			chrome.tabs.sendMessage(tabs[0].id, window.localStorage.getItem("test"));
		});
    }
);

contentからbackgroundをキックして、さらにbackgroundから現在のタブのcontentにlocalstorageの
値を送ってあげる事で実装出来ました。こちらで如何でしょうか？

Comments

[mask_mus]

messageの値をcontent_scripts内の別の関数に渡すことは出来ないのでしょうか？

[yasutakatou]

当初ご質問された内容とズレている気もしますが、少なくともchrome.runtime.onMessage.addListenerからさらに別関数を呼ぶか、グローバル変数に値を入れるかすれば渡せます。

[mask_mus]

質問内容を編集したのですが、上記のコードと等価な機能を実現させたい場合、どのようにすればよいのでしょうか?

[yasutakatou]

すみません、掲載されているコードはbackground.jsですよね？localstorageの値を取得されたいのは
content_scriptsですよね。であれば、content_scriptsのtokenにlocalstorageの値を入れるのが目的である
はずなのでbackground.jsだけのコードでは意図通り実装しているかが分からないのと思います。
content_scripts側のコードの掲載をご検討ください。すみませんが、当初の質問内容と、やりたいことが
ズレてきているような気がしています。

[mask_mus]

掲載してるコードはcontent_scriptsです。やりたいことは当初から変わっていないつもりです。説明不足で混乱させてしまい、申し訳ありません。

[yasutakatou]

承知しました。理解できてなくてお手数おかけしてすみませんでした。
回答内容を修正しましたのでご確認いただけますでしょうか。手元ではこちらのコードでcontent.jsでlocalstorageの値を受け取れております。

[mask_mus]

content_scripts内のgetJwtでsendMessageを実行したあと、content_scripts内のonMessagaの到着を待ってgetJwtを終了させたいのですが、どのように実装すればよいのでしょうか？

[yasutakatou]

マニフェストを"persistent": falseにしても、let getJwtからchrome.runtime.sendMessageをやっても
background.jsにメッセージが飛ばないのでちと、最初のコードそのままだと実装できないと思われます。
申し訳ないですが僕の書いた例で「background.jsからlocalstorageの値をcontent_scriptsで取得したい」の
目的は果たせますのでそちらをご検討頂ければ幸いです。