Вы можете записать вкладку в Firefox, как это:
var constraints = { video: { mediaSource: "browser" } };
navigator.mediaDevices.getUserMedia(constraints)
.then(stream => video.srcObject = stream)
.catch(log);
var offset =() => video.srcObject.getVideoTracks()[0].applyConstraints({
mediaSource: "browser",
scrollWithPage: false,
viewportOffsetX: x.value,
viewportOffsetY: y.value
})
.catch(log);
var log = msg => div.innerHTML += "<br>" + msg;
<script src="https://webrtc.github.io/adapter/adapter-latest.js"></script>
<span title="This is an experimental API that should not be used in production code."><i class="icon-beaker"> </i></span> <strong>This is an experimental technology</strong><br>Because this technology's specification has not stabilized, check the compatibility table for the proper browsers versions. Also note that the syntax and behavior of an experimental technology is subject to change in future versions of browsers as the spec changes.</p>
Capture offset:<br>
<input id="x" min="0" max="500" value="0" oninput="offset()" type="range">
<input id="y" min="0" max="500" value="0" oninput="offset()" type="range"><br>
<video id="video" height="120" width="320" autoplay></video><br>
<div id="div"></div><br>
Обратите внимание, что для этого фрагмента здесь работать в браузере, вы сначала должны view this page in https.
И затем, по соображениям безопасности, вы должны добавить ,stacksnippets.net к списку сайтов в media.getusermedia.screensharing.allowed_domains под о: конфигурации, чтобы это работало.
Наконец, вы также должны установить media.navigator.permission.disabled в true в о: конфигурации поскольку Firefox не реализует Tab Chooser.
Ничего из этого не потребуется в расширении.
В расширении вы должны использовать ограничение browserWindow для передачи во внешнем идентификаторе окна вкладки, которую вы хотите захватить.
Предупреждение: Вы можете удалить ,stacksnippets.net и media.navigator.permission.disabled впоследствии, из-за рисков, присущих безопасности. Сообщения SO могут потенциально украсть вашу информацию о банковском счете таким образом, путем iframing общих банковских URL-адресов, к которым вы можете войти, только для вас (и теперь их!), Чтобы увидеть, эффективно заканчивая ограничения кросс-происшествия. Без шуток!
Это может быть сделано, если записанный элемент является элементом холста, как бы я сделал для всей html-части в документе. Поправьте меня, если я ошибаюсь. Было бы лучше, если бы был пример – Muthu
. Мой ответ состоит из двух предложений, кажется, что вы проигнорировали первый. – the8472
Я пробовал таким образом, и я получаю canvasCaptureMediaStream, и, пытаясь записать, он записывает как одно изображение на время, пока я не остановлю запись. Движения мыши и операции внутри документа не записываются – Muthu