是否有可能保存在浏览器中的JavaScript纯音频流? [英] Is it possible to save an audio stream with pure JavaScript in the browser?

查看:273
本文介绍了是否有可能保存在浏览器中的JavaScript纯音频流?的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我想作一个网页,访问者可以通过点击链接(不活流,但它使用流的无线电档案链接),我想在纯JavaScript做,而无需在服务器后端存储的音频流浏览器。
我在其他地方FFmpeg的的JavaScript的端口,可以连接code和保存视频/音频在利用所谓的斑点浏览器。但是下载图书馆是巨大的,据我记得17 MB。其实我只需要流复制的音频流,而不是一个真正的编码过程。
我通常使用类似的命令来保存的程序:

 的ffmpeg -i http://stream.example.com/stream_20160518_0630.mp3 -c复制-t 3600 programme.mp3

我在想,是不是可以通过编译FFmpeg的子集成JavaScript它仅提供真正需要的数据流复制?


解决方案

  VAR音频=新的音频();
VAR毫秒=新MediaSource的();
变种块= [];
audio.src = URL.createObjectURL(毫秒);ms.addEventListener('sourceopen',函数(E){
    VAR sourceBuffer = ms.addSourceBuffer('音频/ MPEG');
    VAR流;    功能泵(流){
        返回stream.read(),那么(数据=方式> {
            chunks.push(data.value)            sourceBuffer.appendBuffer(data.value);
        })
    };    sourceBuffer.addEventListener('updateend',()=> {
        泵(流);
    },FALSE);    取(http://stream001.radio.hu:443/stream/20160606_090000_1.mp3)
        。然后(RES =>泵(流= res.body.getReader()))    audio.play()
},FALSE);//停止流,当你想和保存您拥有所有块
stopBtn.onclick =功能(){
    VAR BLOB =新的斑点(块)
    的console.log(BLOB)
    //创建对象的URL,追加链接,触发点击下载
    //或的saveAs(BLOB,'stream.mp3')的需要:https://github.com/eligrey/FileSaver.js
}

I would like to make a webpage where visitors can save audio streams by clicking on links (not live streams, but links from a radio archive which uses streams), I want to do this without a server backend with pure JavaScript in the browser. I read somewhere about the JavaScript port of FFMpeg, which can encode and save video / audio in the browser utilizing so called blobs. However download library is huge, as far as I remember 17 MB. In fact I would need only stream copying the audio streams, not a real encoding process. I usually use similar commands to save a programme:

ffmpeg -i http://stream.example.com/stream_20160518_0630.mp3 -c copy -t 3600 programme.mp3

I wonder, is it possible to compile a subset of FFMpeg into JavaScript which provides only the really needed stream copying?

解决方案

var audio = new Audio();
var ms = new MediaSource();
var chunks = [];
audio.src = URL.createObjectURL(ms);

ms.addEventListener('sourceopen', function(e) {
    var sourceBuffer = ms.addSourceBuffer('audio/mpeg');
    var stream;

    function pump(stream){
        return stream.read().then(data => {
            chunks.push(data.value)

            sourceBuffer.appendBuffer(data.value);
        })
    };

    sourceBuffer.addEventListener('updateend', () => {
        pump(stream);
    }, false);

    fetch("http://stream001.radio.hu:443/stream/20160606_090000_1.mp3")
        .then(res=>pump(stream = res.body.getReader()))

    audio.play()
}, false);

// stop the stream when you want and save all chunks that you have
stopBtn.onclick = function(){
    var blob = new Blob(chunks)
    console.log(blob)
    // Create object url, append to link, trigger click to download
    // or saveAs(blob, 'stream.mp3') need: https://github.com/eligrey/FileSaver.js
}

这篇关于是否有可能保存在浏览器中的JavaScript纯音频流?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆