リクエスト画面共有iframe内

Question

WebRTCとの画面共有を正常に実装するChrome拡張機能を構築しましたが、拡張機能を使用してiframe内で機能する必要があります。

これは可能ですか？私のコードの例は以下の通りです - iframe内で '不明な'ケースが常に実行されています。

function getUserScreen(sources, extensionId) { 
    const request = { 
      type: 'getUserScreen', 
      sources: sources 
    }; 
    return new Promise((resolve, reject) => { 
     chrome.runtime.sendMessage(extensionId, request, response => { 
      switch (response && response.type) { 
       case 'success': 
        log('success!'); 
        resolve(response.streamId); 
        break; 
       case 'error': 
        log('error!'); 
        reject(new Error(error.message)); 
        break; 
       default: 
        log('unknown!'); 
        reject(new Error('Unknown response')); 
        break; 
      } 
     }); 
    }).then(streamId => { 
     return navigator.mediaDevices.getUserMedia({ 
      video: { 
       mandatory: { 
        chromeMediaSource: 'desktop', 
        chromeMediaSourceId: streamId, 
        maxWidth: window.screen.width, 
        maxHeight: window.screen.height       
       } 
      } 
     }); 
    }); 
} 

Answer 1

1つの方法はmessageイベントを使用することです。 'メッセージ'イベントを使用すると、IFrameはウェブページとの通信に使用できるため、そのウェブページ上で拡張機能が実行する可能性のあるコンテンツスクリプトとも話すことができます。ここに見られるように、このアプローチは、Googleが推奨されます：あなたは

window.addEventListener("message", ev=> 
{ 
    if(ev.type == "CUSTOM_FROM_IFRAME") 
    chrome.runtime.sendMessage({type: ev.type, data: ev.data}, response => { 
    myIFrame_element.contentWindow.postMessage({type: "CUSTOM_FROM_CONTENTSCRIPT", data: response.data}, "*"); }); 
}); 

と背景ページから：コンテンツスクリプト

var msg = { type: "CUSTOM_FROM_IFRAME", data: "Say hi." }; 
parent.postMessage(msg, "*"); 

window.addEventListener("message", ev=>{ 
    if(ev.type == "CUSTOM_FROM_CONTENTSCRIPT") console.log("can proceed"); 
}); 

：https://developer.chrome.com/extensions/content_scripts#host-page-communication

のiframeから、それは次のようになりますコンテンツスクリプトコードを実行します。

chrome.tabs.executeScript(mypgage_tab_id, {src: contentscript.js});