Para capturar la transmisión de audio de salida desde una pestaña en el manifiesto v2, se podría usar la API chrome.tabCapture.capture en el script de fondo para obtener la transmisión. Pero, en el manifiesto v3, tabCapture se movió al primer plano y no está disponible en el script de fondo. Tampoco está disponible en scripts de contenido.
Después de probar algunas cosas, finalmente pude hacer que tabCapture funcione en un script emergente. Sin embargo, en mi caso de uso, la ventana emergente no puede permanecer abierta durante mucho tiempo para que se capture la transmisión. En cambio, me topé con el método getMediaStreamId de tabCapture que me da un streamId. Entonces, se me ocurrió esto:
chrome.tabs.query({ active: true, currentWindow: true }, (tabs) => { var tab = tabs[0]; chrome.tabCapture.getMediaStreamId({consumerTabId: tab.id}, (streamId) => { chrome.tabs.sendMessage(tab.id, { action: 'streamId', streamId: streamId }); }); }); En el script anterior que está presente en el archivo popup.js , después de obtener el streamId, lo envío al script de contenido. Y estoy atascado aquí sobre cómo crear una transmisión a partir de este streamId para que la transmisión pueda ser capturada/grabada. La documentación menciona el uso getUserMedia() pero no he tenido suerte allí. Esto es lo que se me ocurrió con un poco de ayuda de otras preguntas de SO (pero no funciona, aparece este error DOMException: Error starting tab capture ):
navigator.mediaDevices.getUserMedia({ audio: { mandatory: { chromeMediaSource: 'tab', chromeMediaSourceId: streamId } } })¿Cómo puedo hacer que tabCapture funcione en el manifiesto v3? Es lo que estoy tratando de averiguar.
aquí hay una solución para capturar audio dentro de la ventana emergente de extensión, a diferencia del trabajador de servicio.
manifiesto.json
{ "name": "Audio Share", "version": "0.1", "manifest_version": 3, "permissions": [ "tabs", "activeTab", "tabCapture" ], "host_permissions": [ "https://*/" ], "action": { "default_popup": "home.html", "default_action": "home.js" } }casa.js
function saveToFile(blob, name) { const url = window.URL.createObjectURL(blob); const a = document.createElement("a"); document.body.appendChild(a); a.style = "display: none"; a.href = url; a.download = name; a.click(); URL.revokeObjectURL(url); a.remove(); } function captureTabAudio() { chrome.tabCapture.capture({audio: true, video: false}, (stream) => { // these lines enable the audio to continue playing while capturing context = new AudioContext(); var newStream = context.createMediaStreamSource(stream); newStream.connect(context.destination); const recorder = new MediaRecorder(stream); const chunks = []; recorder.ondataavailable = (e) => { chunks.push(e.data); }; recorder.onstop = (e) => saveToFile(new Blob(chunks), "test.wav"); recorder.start(); setTimeout(() => recorder.stop(), 5000); }) } document.addEventListener('DOMContentLoaded', function () { document.getElementById("share-audio-button").addEventListener("click", function () captureTabAudio(); }) });inicio.html
<html> <head> <script src="home.js"></script> </head> <body> <h1>Audio Share</h1> <button id="share-audio-button">Share Audio</button> </body> </html>