网上查了很多资料，自己在总结一下，感谢各位大佬提供的资料。

页面

<div class="lbox_close wxapi_form">
		<button class="btn btn_primary" id="startRecord">开始</button>
		<button class="btn btn_primary" id="deleteVoice">删除</button>
		<button class="btn btn_primary" id="uploadVoice">确认</button>
	</div>

<script>
	//文档加载完后立即执行
	wx.config({
		debug: false, // 开启调试模式,调用的所有api的返回值会在客户端alert出来，若要查看传入的参数，可以在pc端打开，参数信息会通过log打出，仅在pc端时才会打印。
		appId: '{$sign["appId"]}', // 必填，公众号的唯一标识
		timestamp: {$sign['timestamp']}, // 必填，生成签名的时间戳
		nonceStr: '{$sign["nonceStr"]}', // 必填，生成签名的随机串
		signature: '{$sign["signature"]}',// 必填，签名
		jsApiList: [
			"startRecord",
			"stopRecord",
			"onVoiceRecordEnd",
			"playVoice",
			"pauseVoice",
			"stopVoice",
			"onVoicePlayEnd",
			"uploadVoice",
			"downloadVoice",]// 必填，需要使用的JS接口列表
	});

	wx.ready(function () {
				var voice = {
					localId: '',
					serverId: ''
				};
				var startRecord = document.querySelector('#startRecord');
				var stopClearTimeout;
				startRecord.onclick = function () {
					//开始录音
					if(startRecord.innerHTML == '开始'){
						wx.startRecord({
							success: function(){
								startRecord.innerHTML = '停止';
								//30秒后自动停止;
								stopClearTimeout = setTimeout(function(){
									wx.stopRecord({
										success: function (res) {
											voice.localId = res.localId;
											startRecord.innerHTML = '试听';
										}
									});
								},30000);
							}
						});
					}

					//结束录音
				if(startRecord.innerHTML =='停止'){
						wx.stopRecord({
							success: function (res) {
								clearTimeout(stopClearTimeout);
								startRecord.innerHTML = '试听';
								voice.localId = res.localId;
							},
							fail: function (res) {
								alert(JSON.stringify(res));
							}
						});
					}

					//试听音频
				if(startRecord.innerHTML =='试听'){
						if (voice.localId == '') {
							alert('请先录制一段声音');
							return;
						}
						wx.playVoice({
							localId: voice.localId
						});
					}

				};

				//删除语音,重新录音;
				document.querySelector('#deleteVoice').onclick = function(){
					voice.localId = '';
					startRecord.innerHTML = '开始';
				};

				//确认上传语音
				document.querySelector('#uploadVoice').onclick = function () {
					if (voice.localId == '') {
						alert('请先录制一段声音');
						return;
					}
					wx.uploadVoice({
						localId: voice.localId, // 本地微信语音文件标识
						isShowProgressTips: 1, // 开启上传提示
						success: function (res) {
							//上传成功后从微信服务器下保存
							voice.serverId = res.serverId;
							$.ajax({
								url: '/mobile/member/luyin.php?action=save',//后台接收数据地址
								type: 'post',
								data: {'id': voice.serverId},
								success: function (msg) {
									if(msg == 1){
										alert('上传成功!');
									}
								}
							});

						},
						error:function(res){

							alert("上传失败");
						}
					});
				};

			});


		wx.error(function (res) {
			 alert("出现错误请重试:"+res.errMsg);
		});
</script>

后台接收数据保存部分，使用到了ffmpeg，将amr格式的文件转换为MP3

	$id=$_POST['id'];
		$now=time();
		$url="http://file.api.weixin.qq.com/cgi-bin/media/get?access_token=$access_token&media_id=$id";
		$targetName =  DT_ROOT .'/file/upload/123/'.$now.'.amr';   //保存目录，格式为www/wwwroot/http:...../。。.amr;
		ob_start();
		readfile($url);
		$luyin  = ob_get_contents();
		ob_end_clean();
		$size = strlen($luyin);
		$fp = fopen($targetName, 'a');
		fwrite($fp, $luyin);
		fclose($fp);
		
		// 将 amr 文件格式转换成 mp3 格式  ，不需要转换的在这里就结束了，当然了可以写个语句把MP3的路径保存起来，方便调用，下一篇讲一下ffmpeg的安装使用。
		$amrFile = DT_ROOT .'/file/upload/123/'.$now.'.amr';
		$mp3File =  DT_ROOT .'/file/upload/123/'.$now.'.mp3';
		// 调用PHP命令，将amr格式文件转换为mp3
		$command = "ffmpeg -i " . $amrFile . " " . $mp3File . " 2>&1";
		$a1=exec($command, $output1,$return1);
		$a2=$a1.'|'.$output1.'|'.$return1;
		//var_dump($al);
		$videourl=$CFG['url'] .'/file/upload/123/'.$now.'.mp3';//类似http:....../时间戳.mp3
//		$videourl=$mp3File;
		$names=$_username;
		$db->query("INSERT INTO {$DT_PRE}sound_record (userid,username,soundrecord,addtime,status) VALUES ('$_userid','$names','$videourl','$now','1')");
		echo 1;
		exit;

转载自：微信 JS-SDK 录音功能开发