chrome extensionと外部サイトでやり取りをしたい

Question

質問失礼します
chrome拡張の開発中なのですが、行き詰まってしまいました。

やりたいことは、
アイコンをクリックし、extension内に置いてあるHTMLをポップアップで開く。
開いたページはiframeて外部サイトを読んでいます。

外部サイトにあるボタンを/クリックしたら、
例えば「おしたよ！」というメッセージが、外部サイトからiframeの親ページに送りたい

iframeの親ページも、extension外の普通のページでのやり取りなら問題なく通信できるのですが、
extension内のページとのやりとりになると、出来なくなってしまいます…

正しく通信できる方法を御教授お願い致します。
もしくは別の方法があれば教えてほしいです。

エラー文章↓

Failed to execute 'postMessage' on 'DOMWindow': The target origin provided ('chrome-extension://extensionID') does not match the recipient window's origin ('外部サイトのURL').

manifest.json↓

{
"manifest_version": 2,
"name": "test",
"version": "0.0.1",
"description": "extension",
"icons": {
"16": "test/common/images/sample_16.png"
},
"background": {
"scripts": ["test/common/js/background.js"]
},
"browser_action": {
"default_icon": "test/common/images/sample_19.png",
"default_title": "extension"
},
"content_scripts": [{
"matches": ["<all_urls>"],
"js": ["test/common/js/popup.js", "test/common/js/background.js", "test/common/js/lib/jquery-2.2.4.min.js"]
}],
"permissions":[
"tabs"
]

}

popup.js↓

//ポップアップページの内のjs
// メッセージを受信したとき
function receiveMessage(event) {
alert(event.originalEvent.data);
}

background.js↓

chrome.browserAction.onClicked.addListener(function(tab) {
chrome.windows.getCurrent(null, function(windows){

var array = [];
var option = 'width=600,height=600,left=0,top=0'
var url = 'test/popup.html';

window.open(url, 'windowname', option);
});
});

inneriframe.js↓

//iframeで呼び出している外部サイト内のjs
$('.btn').click(function(){
window.parent.postMessage('おしたよ！', 'chrome-extension://extensionID/');
});

Answer 1

エラーメッセージに

does not match

と書いていますし、extension の id が間違っているのではないでしょうか？

[manifest.json]

{
  "name": "test",
  "version": "1.0.0",
  "manifest_version": 2,
  "description": "test"
}

[popup.html]

<script src="popup.js"></script>
<iframe src="http://localhost:3000/a.html"></iframe></body>

[popup.js]

window.onmessage = eve => console.log(eve.data)

[外部のサイト]

<script>
    window.onclick = eve => window.parent.postMessage("a", "chrome-extension://abcdefghijklmnopqrst")
</script>
<p>this is iframe</p>

これで chrome-extension://abcdefghijklmnopqrst/popup.html にアクセスして表示される iframe をクリックすると console に

a

と出ます