[Chome Extension]Webページ連動タイマーの実装
[ローカルストレージからデータを取得]
必要なデータはWebページからlocalStorageに保存されています.
→localStorageコンテンツの取得
1.データをインポートするTabのIDを取得する
chrome.tabs.onUpdated.addListener((tabId, changeInfo, tab)=>{
if(changeInfo.status === 'complete'){
if(tab.url.includes("URL주소"){ globalTabId = tabId; }
}
});
chrome.tabs.onUpdated.addListener((tabId, changeInfo, tab)=>{
if(changeInfo.status === 'complete'){
if(tab.url.includes("URL주소"){ globalTabId = tabId; }
}
});2.localStorageをインポートするスクリプトを注入
chrome.scripting.executeScript({
target: {tabId: globalTabId },
func: ()=>{return localStorage["key"];}
}, (result)=>{
console.log(result);
});[タイマー実装] setInterval(()=>{
if(globalTabId!=""){
chrome.scripting.executeScript({
/* ... */
});
}
}, 1000);
setInterval(()=>{
if(globalTabId!=""){
chrome.scripting.executeScript({
/* ... */
});
}
}, 1000);setInterval():関数を一定時間毎に実行[ Problem ]
Webページ通信
chrome.runtime.sendMessage & chrome.runtime.onMessage()
:chrome extensionに関連するnpmがインストールされていますが、chrome.ランタイムを認識できません
→社内JSのコミュニケーションの仕方を判断する
document.dispatchEvent & document.addEventListner
:同じDOMを共有しないため使用できません
[結果]
Reference
この問題について([Chome Extension]Webページ連動タイマーの実装), 我々は、より多くの情報をここで見つけました
https://velog.io/@dot2__/Chrome-Extension-웹-페이지-연동-타이머-구현하기
テキストは自由に共有またはコピーできます。ただし、このドキュメントのURLは参考URLとして残しておいてください。
Collection and Share based on the CC Protocol
Reference
この問題について([Chome Extension]Webページ連動タイマーの実装), 我々は、より多くの情報をここで見つけました https://velog.io/@dot2__/Chrome-Extension-웹-페이지-연동-타이머-구현하기テキストは自由に共有またはコピーできます。ただし、このドキュメントのURLは参考URLとして残しておいてください。
Collection and Share based on the CC Protocol