js浏览器端录制电脑声卡的声音（电影音乐）编码成MP3和wav文件下载效果代码-html代码-BFW代码库

代码语言：html

所属分类：其他

代码描述：js浏览器端录制电脑声卡的声音（电影音乐）编码成MP3和wav文件下载效果代码

下面为部分代码预览，完整代码请点击下载或在bfwstudio webide中打开

<html>

<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
    <title>MP3 Recorder</title>
    <script type="text/javascript" src="//repo.bfw.wiki/bfwrepo/js/sprintf.min.js"></script>
    <script type="text/javascript" src="//repo.bfw.wiki/bfwrepo/js/lame.all.js"></script>
</head>

<body>


    <p>本工具可以录制在线视频的音乐（电脑声卡播放的声音），直接浏览器生成，数据不会传服务器</p>
    <p>操作步骤：点击power，选择分享整个屏幕或者对应标签页(没有影响)，勾选分享音频，然后点击start即可开始录制，点击stop结束录制，按文件名下载</p>
    <p>之后你可以修改文件名，然后上传到网易云音乐的云盘，这样你就可以在手机上听或者下载音乐了</p>


    <audio id="AudioPlayer" controls="controls">
  <source type="audio/mpeg">
</audio><br>

    <button id="btnPower" onclick="onPower()">Power</button>
    <button id="btnRecord" onclick="onRecord()" disabled="">Record</button>
    <button id="btnStop" onclick="onStop()" disabled="">Stop</button>

    <p>
        <a id="DownloadLink" download="recorded.mp3">recorded.mp3</a>
        <span id="status"></span>
    </p>

    <div id="log" style="width:100%; border:solid thin; margin:8px; padding:4px;">
        Waiting for scripts...<br> Window loaded.<br>
    </div>

    <script id="logger" type="text/javascript">
        //printf-style console output.
        function log(fmt,args) {
          var text= this.sprintf.apply(this,arguments);
          var element= document.querySelector('#log');
          element.innerHTML+= text+"<br>\n";
        }
        
        //printf-style status line.
        function status(fmt,args) {
          var text= this.sprintf.apply(this,arguments);
          var element= document.getElementById('status');
          element.innerHTML= text;
        }
        
        (function(window) {
          log("Window loaded.");
        })(window);
    </script>

    <script id="loadjs" type="text/javascript">
        //Load a supplemental javascript on demand.
        //cb is the function that will be called when the script is ready.
        function loadScript(name,path,cb) {
          var node= document.createElement('SCRIPT');
          node.type= 'text/javascript';
          node.src= path;
          var head= document.getElementsByTagName('HEAD');
          if(head[0]!=null)
            head[0].appendChild(node);
          if(cb!=null) {
            node.onreadystagechange= cb;
            node.onload= cb;
          }
        }
    </script>

    <script id="taskUI" type="text/javascript">
        //(C)2016 nlited systems inc. http://nlited.org
        var gAudio= null;       //Audio context
        var gAudioSrc= null;    //Audio source
        var gNode= null;        //The audio processor node
        var gIsLame= false;     //Has lame.min.js been loaded?
        var gLame= null;        //The LAME encoder library
        var gEncoder= null;     //The MP3 encoder object
        var gStrmMp3= [];       //Collection of MP3 buffers
        var gIsRecording= false;
        var gCfg= {             //Encoder configuration
          chnlCt:         2,    //1=mono, 2=stereo
          bufSz:          4096, //input buffer size (bytes), 16bit signed int.
          sampleRate:     44100,//Input sample rate (samples per second)
          bitRate:        128    //Output bit rate (9-128)
        };
        var gPcmCt= 0;          //Total input bytes
        var gMp3Ct= 0;          //Total output bytes
        
        //Power button
        function onPower(btn) {
          if(!gAudio) {
            PowerOn();
          } else {
            PowerOff();
          }
        }
        async function startCapture() {
          let captureStream = null;
        
          try {
            captureStream = await navigator.mediaDevices.getDisplayMedia({audio: { autoGainControl:false,echoCancellation:false,
                        googleAutoGainControl:false,noiseSuppression:false
                  } ,video: true});
          } catch(err) {
            console.error("Error: " + err);
          }
          return captureStream;
        }
        
        function PowerOn() {
          log("Powering up...");
          var caps= { audio: true };
          try {
            //Browser compatibility
            window.AudioContext= window.AudioContext || window.webkitAudioContext || AudioContext;
            navigator.getUserMedia= navigator.getUserMedia
              || navigator.webkitGetUserMedia
              || navigator.mozGetUserMedia
              || navigator.msGetUserMedia
              || MediaDevices.getUserMedia;
        
            //test
        
            if(!(gAudio= new window.AudioContext())) {
              log("ERR: Unable to create AudioContext.");
            } else {
              // navigator.getUserMedia(caps,onUserMedia,onFail);
              recorderStream=startCapture()
                recorderStream.then(v =>{
                    audio_track = v.getAudioTracks()
            audio_steam = new MediaStream(audio_track)
                onUserMedia(audio_steam)}
            )
            }
          } catch(ex) {
              console.log(ex)
            log("ERR: Unable to find any audio support.");
            gAudio= null;
          }
        
          function onFail(ex) {
            log("ERR: getUserMedia failed: %s",ex);
          }
        }
        
        //Called when audio capture has been created.
        function onUserMedia(stream) {
            console.log(stream);
          if(!(gAudioSrc= gAudio.createMediaStreamSource(stream))) {
            log("ERR: Unable to create audio source.");
          } else if(!gIsLame) {
            log("Fetching encoder...");
           // loadScript("lame","//repo.bfw.wiki/bfwrepo/js/lame.all.js",LameCreate);
            LameCreate();
          } else {
            LameCreate();
          }
        }
        
        //Called when the lame library has been loaded.
        function LameCreate() {
          gIsLame= true;
          if(!(gEncoder= M.........完整代码请登录后点击上方下载按钮下载查看