首先在微信公众号配置安全域名
还需在前端页面引入,支持https
附上前端代码:
$.ajax({
type: 'post',
url: '{:U(\'Newsystem/represen\')}',
data: {url:encodeURIComponent(location.href.split('#')[0])},
async: true,
success: function (res) {
// console.log(res);
wx.config({
debug: false, // 开启调试模式,调用的所有api的返回值会在客户端alert出来,若要查看传入的参数,可以在pc端打开,参数信息会通过log打出,仅在pc端时才会打印。
appId: res.appid, // 必填,公众号的唯一标识
timestamp: res.timestamp, // 必填,生成签名的时间戳
nonceStr: res.noncestr, // 必填,生成签名的随机串
signature: res.signature,// 必填,签名
jsApiList: ['startRecord','stopRecord','onVoiceRecordEnd','playVoice','pauseVoice','stopVoice','onVoicePlayEnd','uploadVoice','downloadVoice','translateVoice'] // 必填,需要使用的JS接口列表
});
wx.ready(function () {
// console.log('success');
if (localStorage.allowRecord !== 'true') {
wx.startRecord({
success: function() {
localStorage.allowRecord = 'true';
// 仅仅为了授权,所以立刻停掉
wx.stopRecord();
},
cancel: function() {
alert('用户拒绝授权录音');
}
});
}
});
wx.error(function (res) {
// console.log(res);
});
},
error: function (res) {
alert('操作失败');
}
});
var localId;
var btnRecord = $('#voice');
btnRecord.on('touchstart', function(event) {
// console.log(event);
event.preventDefault();
btnRecord.addClass('hold');
startTime = new Date().getTime();
// 延时后录音,避免误操作
recordTimer = setTimeout(function() {
wx.startRecord({
success: function() {
},
cancel: function() {
alert('用户拒绝授权录音');
}
});
}, 300);
}).on('touchend', function(event) {
event.preventDefault();
btnRecord.removeClass('hold');
// 间隔太短
if (new Date().getTime() - startTime < 300) {
startTime = 0;
// 不录音
clearTimeout(recordTimer);
} else if(new Date().getTime() - startTime > 120000){
alert('录音时间不得超过两分钟');
startTime = 0;
// 不录音
clearTimeout(recordTimer);
}else { // 松手结束录音
wx.stopRecord({
success: function(res) {
localId = res.localId;
wx.translateVoice({
localId: localId, // 需要识别的音频的本地Id,由录音相关接口获得
isShowProgressTips: 1, // 默认为1,显示进度提示
success: function (res) {
$('textarea[name=digest]').val(res.translateResult);// 语音识别的结果
}
});
// 上传到服务器
uploadVoice();
},
fail: function(res) {
alert(JSON.stringify(res));
}
});
}
});
//上传录音
function uploadVoice(){
//调用微信的上传录音接口把本地录音先上传到微信的服务器
//不过,微信只保留3天,而我们需要长期保存,我们需要把资源从微信服务器下载到自己的服务器
wx.uploadVoice({
localId: localId, // 需要上传的音频的本地ID,由stopRecord接口获得
isShowProgressTips: 1, // 默认为1,显示进度提示
success: function (res) {
//把录音在微信服务器上的id(res.serverId)发送到自己的服务器供下载。
console.log(res);
if(res.serverId === undefined){
alert('上传失败');
}else {
$('#hidden').val(res.serverId);
}
}
});
}
附上后端代码:
//配置jssdk
public function represen(){
$wx['timestamp'] = time();
$wx['noncestr'] = md5(time());
$wx['jsapi_ticket'] = $this->actionTicket();
$wx['url'] = urldecode(I('url','','trim'));
$string = sprintf("jsapi_ticket=%s&noncestr=%s×tamp=%s&url=%s", $wx['jsapi_ticket'], $wx['noncestr'], $wx['timestamp'], $wx['url']);
//生成签名
$wx['signature'] = sha1($string);
$wx['appid'] = 你的appid;
$this->ajaxReturn($wx);
}
public function actionAccessToken(){
if (session('access_token') && session('time') > time()){
return session('access_token');
}
$url = "https://api.weixin.qq.com/cgi-bin/token?grant_type=client_credential&appid=你的appid&secret=你的appsecret";
$info = file_get_contents($url);
$info = json_decode($info,1);
if ($info){
$info['time'] = time()+$info['expires_in']-200;
session('time',$info['time']);
session('access_token',$info['access_token']);
return $info['access_token'];
}else{
return '失败';
}
}
public function actionTicket()
{
if (session('ticket') && session('ticketTime') > time()){
return session('ticket');
}
$url = "https://api.weixin.qq.com/cgi-bin/ticket/getticket?access_token=".$this->actionAccessToken()."&type=jsapi";
$info = file_get_contents($url);
$info = json_decode($info,1);
if ($info){
$info['time'] = time()+$info['expires_in']-200;
session('ticketTime',$info['time']);
session('ticket',$info['ticket']);
return $info['ticket'];
}else{
return '失败';
}
}
这里只有配置好jssdk并把音频上传到微信服务器上代码,后续思路是将前端上传到微信服务器上的serverId放到表单中,提交表单时把serverId提交到后端,在后端用该值在微信服务器上下载该音频,下载下来需要转格式(该步骤挺麻烦的,放弃做的原因)转好格式之后放在自己的服务器上,把该地址存到数据库中就好了。