[ manifest.json ]

ユーザのTab情報制御画面を使用するため、権限を追加

/* manifest.json */
	...
  "permissions": [
    "...", "tabs", "scripting"
  ],
	"host_permissions":[ /* 특정 URL에 script 주입을 위한 권한 */
	  "http://*/",
	  "https://*/"
	],
  ...

[ Background JS ]

異なるブラウザイベントを監視することによって、タスクを実行するコードを記述します.

タブURL変更の検出

chrome.tabs.onUpdated.addListener((tabId, changeInfo, tab)=>{
    if(changeInfo.status === 'complete'){
		    /* 탭 정보 변경 후, 수행할 로직 작성 */
    }
});

タブステータス変更時に発生

tabId:タブのIDを変更しましたchangeInfo:内容変更tab:変更されたタブオブジェクト

必要なchangeInfo:status(unload/loading/complete)をチェックしないと、ロード中の様々な変化もListerを起動し、不要な呼び出しを繰り返す.

保存されている管理URLとの比較

chrome.storage.sync.get((result) => {
    for(value in result){
        if(tab.url.includes(value)){
            /* 제어 대상 URL일 경우 */
        }
    }
});

chrome storageに格納されているURLリストを読み込む

tabオブジェクトのURL属性と記憶値の比較

コントロールタブを閉じる

ブロック:スクリーン黒

chrome.scripting.executeScript({
    target: {tabId: tabId},
    func: ()=>{document.body.appendChild(warningDiv)}
});

targetで作成したscriptを注入・実行

[結果]