Home >Web Front-end >JS Tutorial >WeChat mini program recording and playback recording function example tutorial
This article mainly introduces the WeChat mini program recording and playback recording functions. The mini program provides two recording APIs, the old version recording function and the new version recording function. Friends in need can refer to it. I hope it can help everyone.
The mini program provides two recording APIs
Old version of recording function
First start recording, then stop recording to pull the temporary address of the audio
Start recording:
var that = this; wx.startRecord({ success: function (res) { // 调用了停止录音接口就会触发这个函数,res.tempFilePath为录音文件临时路径 var tempFilePath = res.tempFilePath that.setData({ src: tempFilePath }) }, fail: function (res) { //录音失败的处理函数 } })
Stop recording:
wx.stopRecord()
Play recording:
wx.playVoice({ filePath: src // src可以是录音文件临时路径 })
New version of recording
Get the globally unique recording manager, and then record All rely on him, and playing recording requires the inner audio context innerAudioContext object.
Get the globally unique recording manager:
var that = this; this.recorderManager = wx.getRecorderManager(); this.recorderManager.onError(function(){ // 录音失败的回调处理 }); this.recorderManager.onStop(function(res){ // 停止录音之后,把录取到的音频放在res.tempFilePath that.setData({ src: res.tempFilePath }) console.log(res.tempFilePath ) });
Start recording:
this.recorderManager.start({ format: 'mp3' // 如果录制acc类型音频则改成aac });
End recording:
this.recorderManager.stop()
Play audio:
this.innerAudioContext = wx.createInnerAudioContext(); this.innerAudioContext.onError((res) => { // 播放音频失败的回调 }) this.innerAudioContext.src = this.data.src; // 这里可以是录音的临时路径 this.innerAudioContext.play()
Related recommendations:
js implements the left and right sliding function of WeChat applet
How to implement the function of displaying drop-down list in WeChat applet
Summary of functions of WeChat mini program
The above is the detailed content of WeChat mini program recording and playback recording function example tutorial. For more information, please follow other related articles on the PHP Chinese website!