howler插件说明

1、中文参考网址：http://www.npmdoc.org/howlerzhongwenwendanghowler-jszhongwenjiaochengjiexi.html。

2、英文参考网址：https://github.com/goldfire/howler.js。

3、插件本身是根据文件名访问（后缀需要.wav）。

4、作弊信号查询，语音播放，接口是url+id，在不改变接口的情况下，需要请求时，在url后面增加.wav，在源码文件中，取url时，再把.wav后缀去掉。

a、使用npm安装：npm install howler@2.2.1

b、作为依赖：

import {Howl, Howler} from 'howler';

c、修改源码部分为：709行，

// self._src = url;（原来）

self._src = url.replace('.wav','');（改为）

d、实际使用，主要代码如下：

/**

* 根据返回数据流进行语音播放

*/

kyxhypwjjm(): void {

const that = this;

const url = "sbyw/pb/kyxhypwjjm";

const pubheaderparams1 = this.commservice.getpubheaderParams1(null);

const pubheaderparams2 = this.commservice.getpubheaderParams2();

//howl

const howlerurl = this.commservice.uploadFileurl + url + ".wav?dlid="+this.nowfileid;

let howl;

$(function() {

howl = new Howl({

src: [howlerurl + "&random=" + new Date().getTime()],

preload: true,

html5: false,

xhr: {

method: "GET",

headers: {

"session-token": that.commservice.getToken(),

"xc_sso_sessionid": pubheaderparams2.access_token,

"xc_client_sessionid": pubheaderparams1.signkey,

"Authorization": pubheaderparams2.Authorization,

"Content-Range": "bytes=0-"

},

withCredentials: true

},

onload: function() {

console.log("load success");

},

onplay: function() {

console.log("onplay success");

},

onend: function() {

console.log("onend success");

that.audiostop();

},

onstop: function() {

console.log("onstop success");

},

onloaderror: function(e) {

console.log("load fail..");

}

});

});

const myVideoLock = setInterval(() => {

if (howl) {

clearInterval(myVideoLock);

that.nowhowl = howl;

that.audioplay();

}

}, 100);

}

audioplay():void {

const that = this;

that.nowhowl.load();

that.nowhowl.play();

}

audiostop():void {

if(this.nowhowl.playing(this.nowfileid)) {

this.nowhowl.stop();

}

}