1.開發流程
如果開發的是普通的展示性頁面，就和開發普通的頁面沒有區別，不過這里要用到設備（手機）的錄音功能，就需要調用微信app的錄音接口，需要使用微信jssdk。
使用微信jssdk：微信JS-SDK說明文檔
- 先登錄微信公眾平臺進入“公眾號設置”的“功能設置”里填寫“JS接口安全域名”。[需要有微信公眾號]
- 引入JS文件
- 通過config接口注入權限驗證配置
- 通過ready接口處理成功驗證
- 通過error接口處理失敗驗證
//假設已引入微信jssdk。【支持使用 AMD/CMD 標準模塊加載方法加載】
wx.config({debug: true, // 開啟調試模式,調用的所有api的返回值會在客戶端alert出來，若要查看傳入的參數，可以在pc端打開，參數信息會通過log打出，僅在pc端時才會打印。appId: '', // 必填，公眾號的唯一標識timestamp: , // 必填，生成簽名的時間戳nonceStr: '', // 必填，生成簽名的隨機串signature: '',// 必填，簽名，見附錄1jsApiList: [] // 必填，需要使用的JS接口列表，所有JS接口列表見附錄2
});wx.ready(function(){// config信息驗證后會執行ready方法，所有接口調用都必須在config接口獲得結果之后，config是一個客戶端的異步操作，所以如果需要在頁面加載時就調用相關接口，則須把相關接口放在ready函數中調用來確保正確執行。對于用戶觸發時才調用的接口，則可以直接調用，不需要放在ready函數中。
});wx.error(function(res){// config信息驗證失敗會執行error函數，如簽名過期導致驗證失敗，具體錯誤信息可以打開config的debug模式查看，也可以在返回的res參數中查看，對于SPA可以在這里更新簽名。});本次需求核心功能：錄音并保存
//假設全局變量已經在外部定義
//按下開始錄音
$('#talk_btn').on('touchstart', function(event){event.preventDefault();START = new Date().getTime();recordTimer = setTimeout(function(){wx.startRecord({success: function(){localStorage.rainAllowRecord = 'true';},cancel: function () {alert('用戶拒絕授權錄音');}});},300);
});
//松手結束錄音
$('#talk_btn').on('touchend', function(event){event.preventDefault();END = new Date().getTime();if((END - START) < 300){END = 0;START = 0;//小于300ms，不錄音clearTimeout(recordTimer);}else{wx.stopRecord({success: function (res) {voice.localId = res.localId;uploadVoice();},fail: function (res) {alert(JSON.stringify(res));}});}
});//上傳錄音
function uploadVoice(){//調用微信的上傳錄音接口把本地錄音先上傳到微信的服務器//不過，微信只保留3天，而我們需要長期保存，我們需要把資源從微信服務器下載到自己的服務器wx.uploadVoice({localId: voice.localId, // 需要上傳的音頻的本地ID，由stopRecord接口獲得isShowProgressTips: 1, // 默認為1，顯示進度提示success: function (res) {//把錄音在微信服務器上的id（res.serverId）發送到自己的服務器供下載。$.ajax({url: '后端處理上傳錄音的接口',type: 'post',data: JSON.stringify(res),dataType: "json",success: function (data) {alert('文件已經保存到七牛的服務器');//這回，我使用七牛存儲},error: function (xhr, errorType, error) {console.log(error);}});}});
}//注冊微信播放錄音結束事件【一定要放在wx.ready函數內】
wx.onVoicePlayEnd({success: function (res) {stopWave();}
});
