小程序实现录音功能


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中用星号表示预录入内容的实现代码
Jan 08 Javascript
JQuery入门—JQuery程序的代码风格详细介绍
Jan 03 Javascript
Jquery中基本选择器用法实例详解
May 18 Javascript
js创建对象的方法汇总
Jan 07 Javascript
禁用backspace网页回退功能的实现代码
Nov 15 Javascript
javascript实现简单的ajax封装示例
Dec 28 Javascript
10道典型的JavaScript面试题
Mar 22 Javascript
Vue 中使用vue2-highcharts实现top功能的示例
Mar 05 Javascript
解决iView中时间控件选择的时间总是少一天的问题
Mar 15 Javascript
React styled-components设置组件属性的方法
Aug 07 Javascript
详解Vue中使用Axios拦截器
Apr 22 Javascript
微信小程序错误this.setData报错及解决过程
Sep 18 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 出现乱码和Sessions验证问题的解决方法!
2008/12/06 PHP
浅析PHP递归函数返回值使用方法
2013/02/18 PHP
利用PHP实现短域名互转
2013/07/05 PHP
PHP实现PDO的mysql数据库操作类
2014/12/12 PHP
yii用户注册表单验证实例
2015/12/26 PHP
thinkphp5.1 框架导入/导出excel文件操作示例
2020/05/25 PHP
javascript实现动态CSS换肤技术的脚本
2007/06/29 Javascript
JavaScript Event学习第四章 传统的事件注册模型
2010/02/07 Javascript
js中函数调用的两种常用方法使用介绍
2014/07/17 Javascript
Node.js的包详细介绍
2015/01/14 Javascript
js中split和replace的用法实例
2015/02/28 Javascript
js实现宇宙星空背景效果的方法
2015/03/03 Javascript
JavaScript动态加载样式表的方法
2015/03/21 Javascript
javascript制作的简单注册模块表单验证
2015/04/13 Javascript
js淡入淡出焦点图幻灯片效果代码分享
2015/09/08 Javascript
JavaScript实现ASC转汉字及汉字转ASC的方法
2016/01/23 Javascript
javascript中异常处理案例(推荐)
2016/10/03 Javascript
selenium 与 chrome 进行qq登录并发邮件操作实例详解
2017/04/06 Javascript
详解js访问对象的属性和方法
2018/10/25 Javascript
nodejs实现聊天机器人功能
2019/09/19 NodeJs
微信小程序(订阅消息)功能
2019/10/25 Javascript
vue keep-alive列表页缓存 详情页返回上一页不刷新,定位到之前位置
2019/11/26 Javascript
JS+CSS实现动态时钟
2021/02/19 Javascript
[04:48]DOTA2上海特锦赛小组赛第三日 TOP10精彩集锦
2016/02/28 DOTA
python笔记(1) 关于我们应不应该继续学习python
2012/10/24 Python
Python多线程编程简单介绍
2015/04/13 Python
python numpy 按行归一化的实例
2019/01/21 Python
Python下利用BeautifulSoup解析HTML的实现
2020/01/17 Python
Django bulk_create()、update()与数据库事务的效率对比分析
2020/05/15 Python
python 调用API接口 获取和解析 Json数据
2020/09/28 Python
意大利在线高尔夫商店:Online Golf
2021/03/09 全球购物
最新会计专业求职信范文
2014/01/28 职场文书
捐款倡议书格式范文
2014/05/14 职场文书
2014年党员整改措施
2014/10/24 职场文书
幼儿园亲子活动通知
2015/04/24 职场文书
安全生产会议制度
2015/08/06 职场文书