質問失礼します
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/'); });
バッドをするには、ログインかつ
こちらの条件を満たす必要があります。