背景
我在开发小程序的时候，有需求要实现录音功能，并能上传给服务器。小程序录音功能我是使用的微信的wx.getRecorderManager()实现的，通过该方法创建实例，实例录音得到的文件是本地临时文件，上传文件需要使用微信的wx.uploadFile(Object object)方法，这就是本次项目的背景。
小程序端
html页面主要是第一个按钮，两个事件，长按开始录音，松手停止录音。第二个按钮只是一个播放录音的功能，用于确定录音是否成功
<!--pages/record/record.wxml--><button bindtap="playVoice" type="primary" disabled="{{tempFilePath === ''}}">播放录音</button><button type="warn" bindtouchstart="beginRecord" bindtouchend="endRecord">长按开始录音，松手停止录音</button>
js部分主要就是两个事件
// pages/record/record.js// 两个实例声明在Page之外，方便访问const recorderManager = wx.getRecorderManager()//这是录音功能的实例，必须的const innerAudioContext = wx.createInnerAudioContext();//这是播放录音功能需要的实例Page({data: {tempFilePath: '' //存放录音文件的临时路径},// 播放录音playVoice: function(e) {innerAudioContext.onPlay(() => {console.log('开始播放')})innerAudioContext.onError((res) => {console.log(res.errMsg)console.log(res.errCode)})innerAudioContext.play();},// 录音beginRecord:function(e) {// 监听录音开始事件recorderManager.onStart(() => {console.log('recorder start')})// 监听已录制完指定帧大小的文件事件。如果设置了 frameSize，则会回调此事件。recorderManager.onFrameRecorded((res) => {const {frameBuffer } = resconsole.log('frameBuffer.byteLength', frameBuffer.byteLength)})//录音的参数const options = {duration: 60000, //录音时间，默认是60s，提前松手会触发button的bindtouchend事件，执行停止函数并上传录音文件。超过60s不松手会如何并未测试过sampleRate: 44100,numberOfChannels: 1,encodeBitRate: 192000,format: 'mp3',//录音格式，这里是mp3frameSize: 50 //指定帧大小，单位 KB。传入 frameSize 后，每录制指定帧大小的内容后，会回调录制的文件内容，不指定则不会回调。暂仅支持 mp3 格式。}//开始录音recorderManager.start(options); },//停止录音并上传数据endRecord:function(e) {const self = this;//停止录音recorderManager.stop();//监听录音停止事件，执行上传录音文件函数recorderManager.onStop((res) => {console.log('recorder stop', res)//返回值res.tempFilePath是录音文件的临时路径 (本地路径) self.setData({tempFilePath: res.tempFilePath})innerAudioContext.src = res.tempFilePath//上传录音文件var uploadTask = wx.uploadFile({//没有method，自动为POST请求filePath: res.tempFilePath,name: 'recordFile', //这个随便填url: 'http://localhost:3000/record', //填写自己服务器的地址。header: {"Content-Type": "multipart/form-data" //必须是这个格式},success:(e) => {console.log('succeed!');console.log(e);},fail: (e) => {console.log('failed!');console.log(e); }});uploadTask.onProgressUpdate((e) => {console.log(e);console.log('期望上传的总字节数：' + e.totalBytesExpectedToSend);console.log('已经上传的字节数' + e.totalBytesSent);})})}})
到这里，小程序部分的代码就已经完成了。
node服务器端
前提：
node服务器我是用的是express框架，如果有不会的朋友，可以先简单了解一下express。
要后端能解析用户上传的文件，需要合适的中间件，我在参考了（nodejs使用connect-multiparty实现文件上传(文件接收)后端）这篇博客后，发现确实是一个比较简单的方法。因此决定推荐给大家。
首先项目需要安装express和connect-multiparty
npm install express
npm install connnect-multiyparty
大家学node的，上面两句不应该看不懂。我不加--save是因为新版的node和npm不需要加就会给你保存在package.json文件内。
//这是我的路由文件的代码片段，监听端口号3000等设置在我的另一个文件内。//这只是代码片段，大概率跑不起来，只起一个demo的作用。如果需要完整的代码，可以留言给我。const express = require('express');const multiparty = require('connect-multiparty');var router = express.Router();var multipartMiddleware = multiparty();router.use(multiparty({uploadDir:'./temp'})); //将接收文件的地址更改为当前目录下的temp文件夹。如果没有，则需要新建该文件夹。// 处理录音文件//只需要这样处理，上传的MP3文件就会保存在指定的目录下了。router.post('/record', multipartMiddleware, (request, response) => {console.log('received a request');console.log(request.files);request.on('end', () => {response.send('通信完成');})})
郑重提示：保存下来的是临时文件，短时间内就会自动删除，所以大家需要及时处理文件，比如写入到新文件中
这个框架已经两年没更新了，所以这个框架这不一定是好的，但是是可行的
我也只是新手，如果有什么疑问，可以私信我，大家一起进步
