源码在末了，喜好就给个Star ！

萌新跪求优化指点，请Forks

萌新瑟瑟发抖

话说在那末慌张的大三将近找练习了而本身还在玩这些真的好吗？T_T

这个小东西是我在近来处理项目问题中制造的。

背景是如许的：作为前端的萌新，被主程老大们吓得瑟瑟发抖。语音及时通信！这个是近来项目中的一个里程碑，也是一个难点地点。主程老大们的主意是，浏览器灌音，切片，经由过程服务器转存再经由过程播送Url的体式格局举行转发。使得各个客户端都可以及时通信。

处理要领：大神 muaz-khan WebRTC中的 MediaStreamRecorder 举行浏览器灌音和切片（敬拜），运用七牛云 存储，转发并取得切片语音的Url！末了末了，就是拼接语音啦，所以就产生了这个cc-audiobuffer东西。

直接看完成

cc-audiobuffer采用了ES6封装类来完成，而且运用babel转义。

一连播放的完成

• 递归的头脑，只需缓冲区中另有Audio，就继承播放。

• 事宜监听，监听Audio对象中的 ended 事宜作为下一段语音播放的标志。

play() {
        const _this = this
        if (this.isHasBuffer()) {
            this.currentAudio = this.shiftBuffer()
            this.currentAudio.play()
            _this.currentAudio.addEventListener('ended', function () {
                _this.play()
            }, false)
        }else{
            this.currentAudio=null
        }
    }

语音提早加载的完成

• 在语音的Url到场缓冲区的时刻，运用Audio对象的preload属性完成。

let audio = new Audio(url)
audio.preload = "auto"
this.AudioUrlBag.push(audio)

动态语音加载的完成

• CCAudioBuffer有pushBuffer('url') 要领，假如缓冲区有Audio正在播放的话，此要领将新的Audio到场行列，假如缓冲区中没有Audio播放，将会将Audio到场缓冲区同时自动播放新的Audio。

 pushBuffer(url) {
        if(!this.isHasCurrentAudio()){
            let audio = new Audio(url)
            audio.preload = "auto"
            this.AudioUrlBag.push(audio)
            this.play()
        }
        else{
            let audio = new Audio(url)
            audio.preload = "auto"
            this.AudioUrlBag.push(audio)
        }
    }

想试一下吗？

装置

npm:

npm install cc-audiobuffer

import CCAudioBuffer from 'cc-audiobuffer'

script：

<script src="dist/cc-audiobuffer.js"></script>

运用

无参数建立

let CCAudioBuffer = new CCAudioBuffer()

CCAudioBuffer.pushBuffer('url')

当有新的url语音地点传过来的时刻，CCAudioBuffer会提早加载而且自动播放语音。不论什么时候挪用pushBuffer('url'),这些语音都邑顺次进入缓冲区且一连播放直到缓冲区为空。

有参数建立

let CCAudioBuffer= new CCAudioBuffer([new Audio('url'),new Audio('url'),new Audio('url')])

CCAudioBuffer.play()

CCAudioBuffer.pushBuffer('url')

当你有参数建立时，参数规定是Audio对象的一个数组。

接下来须要挪用play() 接口保证参数内的Audio播放。

pushBuffer() 的作用和无参数建立一样。

深思一下

近来真是忙成象拔蚌，这个东西做的很急，自我安慰下。

源码很短很短，也没有考虑到对象内部的一些私有封装什么的。照样想今后有时间能重写一下。

也写写些要求啥的，愿望讨教人人，问问人人有无优化计划什么的，也给小生我上门课。

末了这里是Gayhub源码

喜好给个Star！指教给个Forks！

戳我