小程序实现录音功能


Posted in Javascript onSeptember 22, 2020

本文实例为大家分享了小程序实现录音功能的具体代码,供大家参考,具体内容如下

首先判断权限

getPermission: function() {
  var that = this;
    wx.getSetting({
     success(res) {
      console.log(res.authSetting)
      if (res.authSetting["scope.record"] === false) {
       wx.showModal({
        title: '是否录音',
        content: '是否录音',
        success: function (tip) {
         if (tip.confirm) {
          wx.openSetting({
           success: function (data) {
            if (data.authSetting["scope.record"] === true) {
             wx.showToast({
              title: '授权成功',
              icon: 'success',
              duration: 1000
             })
             that.startLuYin()
             //授权成功之后,再调用chooseLocation选择地方
            } else {
             wx.showToast({
              title: '授权失败',
              icon: 'success',
              duration: 1000
             })
            }
           }
          })
         }
        }
       })
      }else{
       that.startLuYin()
      }
     }
    })
 },

授权成功后开始录音

startLuYin(){
  const options = {
   duration: 10000 * 6 * 10, //指定录音的时长,单位 ms
   sampleRate: 16000, //采样率
   numberOfChannels: 1, //录音通道数
   encodeBitRate: 96000, //编码码率
   format: 'mp3', //音频格式,有效值 aac/mp3
   frameSize: 50, //指定帧大小,单位 KB
  }
  //开始录音
  recorderManager.start(options);
  recorderManager.onStart(() => {
   console.log('recorder start');
   Countdown(this); //开始计时
  });
  //错误回调
  recorderManager.onError((res) => {
   console.log('recorder出错:' + res);
   console.log(res);
   clearTimeout(timer); //出错时停止计时
  })
 },

暂停录音

// 暂停录音
 pause: function() {
  var that = this;
  recorderManager.pause()
  recorderManager.onPause((res) => {
   console.log(res)
   console.log('暂停录音')
   clearTimeout(timer);
  })
 },

继续录音

//继续录音
 jixu: function() {
  var that = this;
  recorderManager.resume()
  Countdown(that); //开始计时
  recorderManager.onResume((res) => {
  })
 },

停止录音

//停止录音
 stop: function() {
  recorderManager.stop();
  recorderManager.onStop((res) => {
   this.tempFilePath = res.tempFilePath;
   console.log('停止录音', res.tempFilePath)
   clearTimeout(timer);
  })
 },

播放声音

//播放声音
 play: function() {
  innerAudioContext.autoplay = true
  innerAudioContext.src = this.tempFilePath,
   innerAudioContext.onPlay(() => {
    console.log('开始播放')
   })
  innerAudioContext.onError((res) => {
   console.log(res.errMsg)
   console.log(res.errCode)
  })
 },
// 倒计时
function Countdown(that) {
 timer = setTimeout(function() {
  console.log("----secondes----" + formatSeconds(secondes));
  secondes++;
  if (secondes >= 600) {
   recorderManager.stop();
   clearTimeout(timer);
  }
  that.setData({
   times: formatSeconds(secondes)
  });
  Countdown(that);
 }, 1000);
};
// 时间展示
function formatSeconds(value) {
 var secondTime = parseInt(value); // 秒
 var minuteTime = 0; // 分
 var hourTime = 0; // 小时
 if (secondTime > 60) { //如果秒数大于60,将秒数转换成整数
  //获取分钟,除以60取整数,得到整数分钟
  minuteTime = parseInt(secondTime / 60);
  //获取秒数,秒数取佘,得到整数秒数
  secondTime = parseInt(secondTime % 60);
  //如果分钟大于60,将分钟转换成小时
  if (minuteTime > 60) {
   //获取小时,获取分钟除以60,得到整数小时
   hourTime = parseInt(minuteTime / 60);
   //获取小时后取佘的分,获取分钟除以60取佘的分
   minuteTime = parseInt(minuteTime % 60);
  }
 }
 var result;
 //时间的展示方式为00:00
 if (secondTime < 10) {
  result = "0" + parseInt(secondTime);
 } else {
  result = "" + parseInt(secondTime);
 }
 if (minuteTime > 0) {
  if (minuteTime < 10) {
   result = "0" + parseInt(minuteTime) + ":" + result;
  } else {
   result = "" + parseInt(minuteTime) + ":" + result;
  }
 } else {
  result = "00:" + result;
 }
 //由于限制时长最多为三分钟,小时用不到
 if (hourTime > 0) {
  result = "" + parseInt(hourTime) + ":" + result;
 }
 return result;
}

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
jQuery 判断页面元素是否存在的代码
Aug 14 Javascript
jquery 图片上传按比例预览插件集合
May 28 Javascript
javascript parseInt() 函数的进制转换注意细节
Jan 08 Javascript
JS获取url链接字符串 location.href
Dec 23 Javascript
JavaScript实现带缓冲效果的随屏滚动漂浮广告代码
Nov 06 Javascript
Angular2 环境配置详细介绍
Sep 21 Javascript
浅谈MVC+EF easyui dataGrid 动态加载分页表格
Nov 10 Javascript
bootstrap快速制作后台界面
Dec 05 Javascript
详解微信开发中snsapi_base和snsapi_userinfo及静默授权的实现
Mar 11 Javascript
Angularjs自定义指令Directive详解
May 27 Javascript
js函数和this用法实例分析
Mar 13 Javascript
ant design vue 表格table 默认勾选几项的操作
Oct 31 Javascript
webstorm建立vue-cli脚手架的傻瓜式教程
Sep 22 #Javascript
JavaScript实现多层颜色选项卡嵌套
Sep 21 #Javascript
JS实现无限轮播无倒退效果
Sep 21 #Javascript
js+canvas绘制图形验证码
Sep 21 #Javascript
vue中路由跳转不计入history的操作
Sep 21 #Javascript
JS实现放大镜效果
Sep 21 #Javascript
vue element ui validate 主动触发错误提示操作
Sep 21 #Javascript
You might like
Email+URL的判断和自动转换函数
2006/10/09 PHP
php若干单维数组遍历方法的比较
2011/09/20 PHP
php实现处理输入转义字符的代码
2015/11/08 PHP
详解PHP安装mysql.so扩展的方法
2016/12/31 PHP
PHP实现数组向任意位置插入,删除,替换数据操作示例
2019/04/05 PHP
jquery 学习之二 属性(html()与html(val))
2010/11/25 Javascript
查找Oracle高消耗语句的方法
2014/03/22 Javascript
简介JavaScript中POSITIVE_INFINITY值的使用
2015/06/05 Javascript
jquery实现选中单选按钮下拉伸缩效果
2015/08/06 Javascript
七个不允许错过的jQuery小技巧
2015/12/21 Javascript
把普通对象转换成json格式的对象的简单实例
2016/07/04 Javascript
jQuery实现表格隔行及滑动,点击时变色的方法【测试可用】
2016/08/20 Javascript
JS动态生成年份和月份实例代码
2017/02/04 Javascript
jQuery图片切换动画效果
2017/02/28 Javascript
JS给按钮添加跳转功能类似a标签
2017/05/30 Javascript
浅谈AngularJS中使用$resource(已更新)
2017/09/14 Javascript
react router 4.0以上的路由应用详解
2017/09/21 Javascript
vue项目中实现的微信分享功能示例
2019/01/21 Javascript
jQuery实现模拟搜索引擎的智能提示功能简单示例
2019/01/27 jQuery
Vue项目中使用better-scroll实现菜单映射功能方法
2019/09/11 Javascript
关于layui的下拉搜索框异步加载数据的解决方法
2019/09/28 Javascript
vue3为什么要用proxy替代defineProperty
2020/10/19 Javascript
Python while 循环使用的简单实例
2016/06/08 Python
django数据库migrate失败的解决方法解析
2018/02/08 Python
对python中assert、isinstance的用法详解
2019/11/27 Python
Python: 传递列表副本方式
2019/12/19 Python
Python range与enumerate函数区别解析
2020/02/28 Python
python使用ctypes库调用DLL动态链接库
2020/10/22 Python
使用Filters滤镜弥补CSS3的跨浏览器问题以及兼容低版本IE
2013/01/23 HTML / CSS
联想美国官方商城:Lenovo美国
2017/06/19 全球购物
介绍一下Java中的Class类
2015/04/10 面试题
什么是触发器(trigger)? 触发器有什么作用?
2013/09/18 面试题
《蜗牛的奖杯》教后反思
2014/04/24 职场文书
双拥工作宣传标语
2014/06/26 职场文书
拿破仑传读书笔记
2015/07/01 职场文书
使用CSS定位HTML元素的实现方法
2022/07/07 HTML / CSS