6
3

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

More than 5 years have passed since last update.

chrome拡張機能:オプションページの様な自作ページをタブで開く

Posted at

拡張内にファイルを配置し、chrome.tabs.create()でurlにファイル名を指定するだけ。manifest.jsonへの記載も不要。

background.js
chrome.tabs.create({url: 'custom_page.html'}, tab => {});

自作ページでスクリプトを読み込むには、オプションページ同様script要素で読み込めばいい。

custom_page.html
<script src="custom_page.js"></script>

ただし、chrome.tabs.create()のコールバック関数内でchrome.tabs.sendMessage()を実行しても、まだタブ側のスクリプトが読み込まれていないのでメッセージは受信できない。なので、必要な情報はタブを開く前にlocalStorageに保存しておき、自作ページでそれを読み込む形にした。

background.js
localStorage.aaa = 'aaa';
chrome.tabs.create({url: 'custom_page.html'}, tab => {});
custom_page.js
let aaa = localStorage.aaa;
6
3
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
6
3

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?