小程序实现录音功能


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 form 验证函数 弹出对话框形式
Jun 23 Javascript
js操作textarea 常用方法总结
Dec 03 Javascript
jQuery基础框架浅入剖析
Dec 27 Javascript
jQuery实现div随意拖动的实例代码(通用代码)
Jan 28 Javascript
BootStrap按钮标签及基本样式
Nov 23 Javascript
微信小程序 wx.request方法的异步封装实例详解
May 18 Javascript
JS失效 提示HTML1114: (UNICODE 字节顺序标记)的代码页 utf-8 覆盖(META 标记)的冲突的代码页 utf-8
Jun 23 Javascript
详解vue mint-ui源码解析之loadmore组件
Oct 11 Javascript
JS实现的集合去重,交集,并集,差集功能示例
Mar 13 Javascript
js技巧之十几行的代码实现vue.watch代码
Jun 09 Javascript
React Native基础入门之调试React Native应用的一小步
Jul 02 Javascript
jquery实现鼠标悬浮弹出气泡提示框
Dec 23 jQuery
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 分页原理详解
2009/08/21 PHP
php基础学习之变量的使用
2011/06/09 PHP
浅析php面向对象public private protected 访问修饰符
2013/06/30 PHP
ThinkPHP CURD方法之field方法详解
2014/06/18 PHP
2014年最新推荐的10款 PHP 开发框架
2014/08/01 PHP
PHP 魔术变量和魔术函数详解
2015/02/25 PHP
php通过array_push()函数添加多个变量到数组末尾的方法
2015/03/18 PHP
PHP中的Session对象如何使用
2015/09/25 PHP
PHP连接MYSQL数据库实例代码
2016/01/20 PHP
php安装ssh2扩展的方法【Linux平台】
2016/07/20 PHP
jquery中eq和get的区别与使用方法
2011/04/14 Javascript
jQuery学习笔记(3)--用jquery(插件)实现多选项卡功能
2013/04/08 Javascript
有关javascript的性能优化 (repaint和reflow)
2013/04/12 Javascript
JavaScript如何实现在文本框(密码框)输入提示语
2015/12/25 Javascript
js事件处理程序跨浏览器解决方案
2016/03/27 Javascript
谈谈jQuery之Deferred源码剖析
2016/12/19 Javascript
nodejs使用http模块发送get与post请求的方法示例
2018/01/08 NodeJs
Vue2.0 实现歌手列表滚动及右侧快速入口功能
2018/08/08 Javascript
vuedraggable+element ui实现页面控件拖拽排序效果
2020/07/29 Javascript
在vue项目中引入highcharts图表的方法
2019/01/21 Javascript
Vue动态路由缓存不相互影响的解决办法
2019/02/19 Javascript
微信小程序分享功能onShareAppMessage(options)用法分析
2019/04/24 Javascript
简单了解JavaScript中的执行上下文和堆栈
2019/06/24 Javascript
Vue-cli 移动端布局和动画使用详解
2020/08/10 Javascript
将图片文件嵌入到wxpython代码中的实现方法
2014/08/11 Python
python+matplotlib实现鼠标移动三角形高亮及索引显示
2018/01/15 Python
python实现图片二值化及灰度处理方式
2019/12/07 Python
scrapy-splash简单使用详解
2021/02/21 Python
西班牙最好的在线购买葡萄酒的商店:Vinoseleccion
2019/10/30 全球购物
一套PHP的笔试题
2013/05/31 面试题
毕业生个人的自我评价优秀范文
2013/10/03 职场文书
自考生毕业自我鉴定
2013/10/10 职场文书
学子宴答谢词
2014/01/25 职场文书
社会实践的活动方案
2014/08/22 职场文书
财务工作失职检讨书
2014/11/21 职场文书
Java 超详细讲解数据结构中的堆的应用
2022/04/02 Java/Android