Chrome扩展程序捕获标签音频 [英] Chrome Extension Capture Tab Audio

问题描述

我试图创建一个Chrome扩展程序，用于捕获活动选项卡中的音频，并将其发送到其他服务器或通过URL访问。

我正在使用 chrome.tabCapture.capture API ，并且可以成功获取标签音频的 MediaStream ，但我不知道该做什么。

Chrome文档与MediaStream无关，因此我浏览了一些文档这里，并与JS调试器玩，看看有什么方法可用，但无法找到一种方式发送MediaStream的地方。 解决方案

现在可以使用 MediaRecorder 在JS中本地记录流。这里有一个演示，w3c规范是 here

方法 startRecording 在演示中需要将 window.stream 设置为MediaStream实例。

  //当Chrome 47移动到稳定的
 var mediaRecorder时，嵌套的try块会被简化; 
 var recordedBlobs; 
 window.stream = myMediaStreamInstance; 
函数startRecording（）{
 var options = {mimeType：'video / webm'，bitsPerSecond：100000}; 
 recordedBlobs = []; 
尝试{
 mediaRecorder = new MediaRecorder（window.stream，options）; 
} catch（e0）{
 console.log（'Unable to create MediaRecorder with options Object：'，e0）; 
 try {
 options = {mimeType：'video / webm，codecs = vp9'，bitsPerSecond：100000}; 
 mediaRecorder =新MediaRecorder（window.stream，选项）; 
} catch（e1）{
 console.log（'Unable to create MediaRecorder with options Object：'，e1）; 
试试{
 options ='video / vp8'; // Chrome 47 
 mediaRecorder = new MediaRecorder（window.stream，options）; 
} catch（e2）{
 alert（'MediaRecorder is not supported by this browser.\\\
\\\
'+ 
'尝试Firefox 29或更高版本，或Chrome 47或更高版本，从chrome：// flags。启用启用实验性Web平台功能。 
 console.error（'创建MediaRecorder时出现异常：'，e2）; 
 return; 
 
 
 $ b console.log（'创建MediaRecorder'，mediaRecorder'，选项'，选项）; 
 
 //在这里做UI清理
 mediaRecorder.onstop = function（）{/ ** stop * /}; 
 mediaRecorder.ondataavailable = function（）{/ ** data avail * /}; 
 mediaRecorder.start（10）; //收集10ms数据
 console.log（'MediaRecorder started'，mediaRecorder）; 
} 
  

1. https://www.w3.org/TR/mediastream-recording/


2. https://simpl.info/mediarecorder/

I'm trying to create a Chrome extension that captures the audio from the active tab and either sends it to another server or makes it accessible via a URL.

I'm using the chrome.tabCapture.capture API and can successfully get a MediaStream of the tab's audio, but I don't know what to do after that.

The Chrome docs have nothing about MediaStreams so I've looked through some documentation here and played with the JS debugger to see what methods are available, but can't find a way to send the MediaStream somewhere.

解决方案

It's now possible to record a stream locally in JS using MediaRecorder. There is a demo here and the w3c spec is here

The method startRecording in the demo requires window.stream to be set to the MediaStream instance.

// The nested try blocks will be simplified when Chrome 47 moves to Stable
var mediaRecorder;
var recordedBlobs;
window.stream = myMediaStreamInstance;
function startRecording() {
  var options = {mimeType: 'video/webm', bitsPerSecond: 100000};
  recordedBlobs = [];
  try {
    mediaRecorder = new MediaRecorder(window.stream, options);
  } catch (e0) {
    console.log('Unable to create MediaRecorder with options Object: ', e0);
    try {
      options = {mimeType: 'video/webm,codecs=vp9', bitsPerSecond: 100000};
      mediaRecorder = new MediaRecorder(window.stream, options);
    } catch (e1) {
      console.log('Unable to create MediaRecorder with options Object: ', e1);
      try {
        options = 'video/vp8'; // Chrome 47
        mediaRecorder = new MediaRecorder(window.stream, options);
      } catch (e2) {
        alert('MediaRecorder is not supported by this browser.\n\n' +
            'Try Firefox 29 or later, or Chrome 47 or later, with Enable experimental Web Platform features enabled from chrome://flags.');
        console.error('Exception while creating MediaRecorder:', e2);
        return;
      }
    }
  }
  console.log('Created MediaRecorder', mediaRecorder, 'with options', options);

  // do UI cleanup here
  mediaRecorder.onstop = function() {/** stop */};
  mediaRecorder.ondataavailable = function() {/** data avail */};
  mediaRecorder.start(10); // collect 10ms of data
  console.log('MediaRecorder started', mediaRecorder);
}

1. https://www.w3.org/TR/mediastream-recording/
2. https://simpl.info/mediarecorder/

这篇关于Chrome扩展程序捕获标签音频的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！