小程序实现录音功能


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 相关文章推荐
JAVASCRIPT  THIS详解 面向对象
Mar 25 Javascript
javascript 函数使用说明
Apr 07 Javascript
用JS提交参数创建form表单在FireFox中遇到的问题
Jan 16 Javascript
js随机颜色代码的多种实现方式
Apr 23 Javascript
javascript获取web应用根目录的方法
Feb 12 Javascript
ExtJs纵坐标值重复问题的解决方法
Feb 27 Javascript
js计算任意值之间随机数的方法
Jan 16 Javascript
js表格排序实例分析(支持int,float,date,string四种数据类型)
May 06 Javascript
AngularJS ng-controller 指令简单实例
Aug 01 Javascript
微信小程序解除10个请求并发限制
Dec 18 Javascript
Vue实现附件上传功能
May 28 Javascript
微信小程序实现点击导航标签滚动定位到对应位置
Nov 19 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
php简单实现文件或图片强制下载的方法
2016/12/06 PHP
Paypal实现循环扣款(订阅)功能
2017/03/23 PHP
jquery DOM操作 基于命令改变页面
2010/05/06 Javascript
javascript object array方法使用详解
2012/12/03 Javascript
单击复制文字兼容各浏览器的完美解决方案
2013/07/04 Javascript
js opener的使用详解
2014/01/11 Javascript
JQuery为页面Dom元素绑定事件及解除绑定方法
2014/04/23 Javascript
[原创]推荐10款最热门jQuery UI框架
2014/08/19 Javascript
this,this,再次讨论javascript中的this,超全面(经典)
2016/01/05 Javascript
js下将金额数字每三位一逗号分隔
2016/02/19 Javascript
理解Javascript图片预加载
2016/02/23 Javascript
javascript RegExp 使用说明
2016/05/21 Javascript
AngularJS中过滤器的使用与自定义实例代码
2016/09/17 Javascript
BootStrap selectpicker后台动态绑定数据
2017/06/01 Javascript
如何去除vue项目中的#及其ie9兼容性
2018/01/11 Javascript
基于vue-cli vue-router搭建底部导航栏移动前端项目
2018/02/28 Javascript
vue.js使用v-model指令实现的数据双向绑定功能示例
2018/05/22 Javascript
JavaScript格式化json和xml的方法示例
2019/01/22 Javascript
Vue Prop属性功能与用法实例详解
2019/02/23 Javascript
Windows中安装使用Virtualenv来创建独立Python环境
2016/05/31 Python
tensorflow 恢复指定层与不同层指定不同学习率的方法
2018/07/26 Python
Django自带的加密算法及加密模块详解
2019/12/03 Python
keras Lambda自定义层实现数据的切片方式,Lambda传参数
2020/06/11 Python
python多线程semaphore实现线程数控制的示例
2020/08/10 Python
Pycharm的Available Packages为空的解决方法
2020/09/18 Python
Python Selenium库的基本使用教程
2021/01/04 Python
检测浏览器是否支持html5视频的代码
2013/03/28 HTML / CSS
Canvas实现保存图片到本地的示例代码
2018/06/28 HTML / CSS
一套中级Java程序员笔试题
2015/01/14 面试题
活动总结怎么写啊
2014/05/07 职场文书
六年级语文下册教学计划
2015/01/22 职场文书
检讨书范文
2015/01/27 职场文书
酒店财务经理岗位职责
2015/04/08 职场文书
交通事故被告答辩状
2015/05/22 职场文书
windows安装python超详细图文教程
2021/05/21 Python
帮你提高开发效率的JavaScript20个技巧
2021/06/18 Javascript