Skip to content

Instantly share code, notes, and snippets.

@dy
Last active January 14, 2023 13:25
Show Gist options
  • Save dy/9ccb5a182cf9eecc793f2f855ae4a3e6 to your computer and use it in GitHub Desktop.
Save dy/9ccb5a182cf9eecc793f2f855ae4a3e6 to your computer and use it in GitHub Desktop.
Record youtube / any <video>/<audio> clip
// paste the code below into browser console in any youtube page and call `record(from, to)`
// from and to are in seconds
async function record(from, to) {
var mediaElement=document.querySelector('video')
var recordedChunks = [];
var mimeType = 'audio/webm;codecs="opus"'
var ac = new AudioContext();
var mediaSource = new MediaElementAudioSourceNode(ac, {mediaElement});
var recordingDest = ac.createMediaStreamDestination();
mediaSource.connect(recordingDest);
mediaSource.connect(ac.destination);
var mediaRecorder = new MediaRecorder(recordingDest.stream, {mimeType});
mediaRecorder.ondataavailable = event => {
console.log("data-available");
if (event.data.size > 0) {
recordedChunks.push(event.data);
download();
} else {
// ...
}
};
mediaRecorder.start();
function download() {
var blob = new Blob(recordedChunks, {
type: mimeType
});
var url = URL.createObjectURL(blob);
var a = document.createElement("a");
document.body.appendChild(a);
a.style = "display: none";
a.href = url;
a.download = "test.webm";
a.click();
window.URL.revokeObjectURL(url);
}
mediaElement.currentTime = from
mediaElement.play()
setTimeout(event => {
console.log("stopping");
mediaRecorder.stop();
mediaElement.stop()
mediaSource.disconnect();
}, (to-from)*1000);
}
// paste code below into browser console in any youtube page and call `record(from, to)`
async function record(from, to) {
var mediaElement=document.querySelector('video')
var recordedChunks = [];
var mimeType = 'video/webm'
var stream = mediaElement.captureStream(25); //optional fps arg
var mediaRecorder = new MediaRecorder(stream, {mimeType});
mediaRecorder.ondataavailable = event => {
if (event.data.size > 0) {
recordedChunks.push(event.data);
download();
} else {
// ...
}
};
mediaRecorder.start();
mediaElement.currentTime = from; // from 2:36
mediaElement.play();
function download() {
var blob = new Blob(recordedChunks, {
type: mimeType
});
var url = URL.createObjectURL(blob);
var a = document.createElement("a");
document.body.appendChild(a);
a.style = "display: none";
a.href = url;
a.download = "test.webm";
a.click();
window.URL.revokeObjectURL(url);
}
mediaElement.currentTime = from
mediaElement.play()
setTimeout(event => {
console.log("stopping");
mediaRecorder.stop();
mediaElement.stop()
mediaSource.disconnect();
}, (to-from)*1000);
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment