小程序采集录音并上传到后台

2023-08-08 09:26:04 64

本文实例为大家分享了小程序录音上传的具体代码，供大家参考，具体内容如下

demo.wxml


录音开始（mp3）


录音结束


播放录音


播放录音

demo.wxss

view{
padding:15px;
}

demo.js

//pages/newMusic/index.js
constrecorderManager=wx.getRecorderManager();
Page({

data:{

},

/**
*提示
*/
tip:function(msg){
wx.showModal({
title:'提示',
content:msg,
showCancel:false
})
}

/**
*录制mp3音频
*/
,startRecordMp3:function(){
recorderManager.start({
format:'mp3'
});
}

/**
*停止录音
*/
,stopRecord:function(){
recorderManager.stop()
}

/**
*播放录音
*/
,playRecord:function(){
varthat=this;
varsrc=this.data.src;
if(src==''){
this.tip("请先录音！")
return;
}
this.innerAudioContext.src=this.data.src;
this.innerAudioContext.play()
},

onLoad:function(options){
varthat=this;
recorderManager.onError(function(){
that.tip("录音失败！")
});
recorderManager.onStop(function(res){
that.setData({
src:res.tempFilePath
})
console.log(res.tempFilePath)
that.tip("录音完成！")
});

this.innerAudioContext=wx.createInnerAudioContext();
this.innerAudioContext.onError((res)=>{
that.tip("播放录音失败！")
})

}

})

java后台接收

packagecom.azor.controller;

importjava.text.SimpleDateFormat;
importjava.util.Date;
importjava.util.HashMap;
importjava.util.Map;

importjavax.servlet.http.HttpServletRequest;

importorg.apache.commons.codec.binary.Base64;
importorg.apache.commons.lang.StringUtils;
importorg.slf4j.LoggerFactory;
importorg.springframework.beans.factory.annotation.Autowired;
importorg.springframework.core.env.Environment;
importorg.springframework.web.bind.annotation.RequestMapping;
importorg.springframework.web.multipart.MultipartFile;
importorg.springframework.web.multipart.MultipartHttpServletRequest;

importcom.azor.utils.HttpAPIService;

importch.qos.logback.classic.Logger;
importnet.sf.json.JSONObject;

@RestController
@RequestMapping("/base_voice")
publicclassBaseController{

privatestaticfinalLoggerlogger=(Logger)LoggerFactory.getLogger(BaseController.class);
privatestaticStringlineSeparator=System.getProperty("line.separator");

@Autowired
protectedEnvironmentenv;

@Autowired
protectedHttpAPIServicehttpAPIService;

/**上传文件保存路径*/
privatefinalStringFILE_SAVE_PATH="D:/photo/jac_hr_miniprogram_file/";

/**主业务数据Map*/
protectedMapdataMap=newHashMap<>();

/**HTTPPOST请求Map*/
protectedMappostMap=newHashMap<>();

@RequestMapping("/file_upload")
publicvoidsaveFile(HttpServletRequestrequest,Stringurl)throwsException{
logger.info("文件上传开始"+lineSeparator);
//1.获取从前台传过来得图片
MultipartHttpServletRequestreq=(MultipartHttpServletRequest)request;
MultipartFilemultipartFile=req.getFile("file");

//2.获得文件扩展名
StringextOfFile=getExtOfFile(multipartFile);
//3.保存到本地
BufferedOutputStreambos=null;
Stringfilename=null;
try{
Filedir=newFile(file_save_path);
if(!dir.exists()){//判断文件目录是否存在
dir.mkdirs();
}
filename=newSimpleDateFormat("yyyyMMddHHmmss").format(newDate())+(int)(Math.random()*1000)+"."
+extOfFile;
bos=newBufferedOutputStream(newFileOutputStream(file_save_path+filename));
bos.write(multipartFile.getBytes());

}catch(Exceptione){
e.printStackTrace();
}finally{
if(bos!=null){
try{
bos.close();
}catch(IOExceptione){
e.printStackTrace();
}
}

}

}

publicStringgetExtOfFile(MultipartFilemultipartFile){
//获取文件的名称.扩展名
StringoldName=multipartFile.getOriginalFilename();
StringextensionName="";
//获取原来的扩展名
if((oldName!=null)&&(oldName.length()>0)){
intdot=oldName.lastIndexOf('.');
if((dot>-1)&&(dot<(oldName.length()-1))){
extensionName=oldName.substring(dot+1);
}
}
returnextensionName;
}
}

效果

以上就是本文的全部内容，希望对大家的学习有所帮助，也希望大家多多支持毛票票。

声明：本文内容来源于网络，版权归原作者所有，内容由互联网用户自发贡献自行上传，本网站不拥有所有权，未作人工编辑处理，也不承担相关法律责任。如果您发现有涉嫌版权的内容，欢迎发送邮件至：czq8825#qq.com（发邮件时，请将#更换为@）进行举报，并提供相关证据，一经查实，本站将立刻删除涉嫌侵权内容。

小程序采集录音并上传到后台

热门推荐

随机推荐