创建html, 引入TencentSOE SDK,代码如下
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> <script src="http://imgcache.qq.com/open/qcloud/soe/TencentSOE-0.0.1.js"></script> </head> <body> <input type="text" value="about"> <button>开始录音</button> <button>结束录音</button> <!-- 显示当前状态 --> <span></span> <!-- 显示测评结果 --> <div></div> </body> </html>编写录音代码:开始录音、结束录音、展示结果,代码如下
let recorder = new TencentSOE({ InitUrl: 'http://127.0.0.1:3000/cgi/init', TransUrl: 'http://127.0.0.1:3000/cgi/trans', success(res) { console.log('创建成功'); }, error(err) { console.log('创建失败'); }, }); startBtn.onclick = function () { result.innerHTML = ''; status.textContent = '初始化中'; recorder.init({ RefText: word.value, success(res) { status.textContent = '录音转码中...'; recorder.start(); }, error(err) { console.log('err', err); } }); }; stopBtn.onclick = function () { recorder.stop({ success(res) { status.textContent = '已结束'; createAudioLinkFromBlob(res, 'wav'); }, error(err) { console.log('err', err); } }); }; // 创建音频、下载链接 function createAudioLinkFromBlob(res, type) { let audio = document.createElement('audio'); let alink = document.createElement('a'); let score = document.createElement('span'); let blobUrl = URL.createObjectURL(res.blob); alink.download = 'demo.' + type; alink.textContent = 'demo.' + type; alink.href = blobUrl; audio.src = blobUrl; audio.setAttribute('controls', ''); score.textContent = '分数:' + res.PronAccuracy; let container = document.createElement('div'); container.appendChild(audio); container.appendChild(alink); container.appendChild(score); result.appendChild(container); }此文已由腾讯云+社区在各渠道发布