微信小程序实现长文本分段播放
接上篇 微信小程序实现语音合成功能 解决腾讯智能语音插件中文最大支持100个汉字的问题
场景:需要合成100汉字以上的文本进行语音播报
注意:本文示例代码是在上篇基础上进行改进。
上代码
<scriprt>
// 创建音频组件
const innerAudioContext = uni.createInnerAudioContext();
innerAudioContext.autoplay = false;
innerAudioContext.src = '';
// 音频播放方法
play(id){
var that = this;
if(that.oldId == id && that.currentTime > 0){// 控制是否是当前已经播报过,现在处于暂停的文章
//暂停之后点击播放继续播放
innerAudioContext.play();
innerAudioContext.onEnded((res) => {
})
}else{//新文章
var extras = that.content;// 要播报的文本
var lastExtras;
// 提取汉字(由于笔者要播报的来自富文本,所以需要提取文字)
if(extras != null && extras != ''){
// 去掉html标签
lastExtras = extras.replace(/<[^>]+>/g,"");
// 只留汉字和数字
lastExtras = lastExtras.replace(/[^\u4e00-\u9fa5_0-9]/gi,"");
}
// 定义每次截取长度
var fixedLength = 80;
// 是否继续读取文章标识
var readFlag = true;
// 定义循环因子
var i = 0;
while(readFlag){
// 循环播报文本
let voiceText = lastExtras.substr(i*fixedLength,fixedLength);
i++;
if(voiceText.length <= 0){
readFlag = false;
}
}
for (let j = 0; j < i; j++) {
const voiceText = lastExtras.substr((0+j)*fixedLength,fixedLength);
setTimeout(()=>{
that.voiceHC(j,voiceText);
console.log('第'+j+'次进入播报')
},75*250*j)// 延时时间需要自己估算。读者朋友们可以自行调整
}
}
that.oldId = id;
},
voiceHC(i,lastExtras){
console.log('第'+i+'次调用,内容:'+lastExtras);
var encoded = encodeURI(lastExtras);
plugin.textToSpeech({
content: lastExtras,
speed: 0,
volume: 0,
voiceType: 0,
language: 1,
projectId: 0,
sampleRate: 16000,
success: function(data) {
let url = data.result.filePath;
if(url && url.length > 0){
innerAudioContext.autoplay = true;
innerAudioContext.src = url;
innerAudioContext.onPlay(() => {
});
innerAudioContext.onError((res) => {
console.log(res.errMsg)
});
}
},
fail: function(error){
console.log(error);
}
})
}
</script>