首页 > 编程语言 >微信小程序实现语音录制(uni-app源码版)

微信小程序实现语音录制(uni-app源码版)

时间:2023-11-29 14:33:45浏览次数:49  
标签:程序实现 微信 录音 recorderManager 源码 let innerAudioContext duration uni

注意以下代码只是部分代码,已经将完整代码上传至插件市场,可在插件市场中下载。
插件下载地址

1. 创建音频对象上下文

// 创建音频上下文
    let innerAudioContext = uni.createInnerAudioContext({
      useWebAudioImplement: false,
    })
    this.innerAudioContext = innerAudioContext
    // 创建录音全局唯一对象
    let recorderManager = uni.getRecorderManager()
    this.recorderManager = recorderManager
    // 监听录音结束
    recorderManager.onStop((e) => {
      let duration = (e.duration / 1000).toFixed(1)
      this.voice = {
        src: e.tempFilePath,
        duration: duration,
      }
      this.$emit('success', this.voice)
    })

2. 点击开始录音方法

 /**
     * 开始录音
     */
    start() {
      let recorderManager = this.recorderManager
      uni.vibrateShort({
        success: (e) => {
          if (!this.isClick) {
            this.interval = setInterval(() => {
              this.duration = this.duration + 0.1
            }, 100)
            recorderManager.start()
            this.isActive = true
          }
        },
      })
    }

3. 点击结束录音方法

/**
    * 结束录音
    */
   end() {
     let recorderManager = this.recorderManager
     recorderManager.stop()
     this.isActive = false
     if (this.interval) {
       clearInterval(this.interval)
       this.interval = null
       this.duration = 0
     }
     setTimeout(() => {
       this.isClick = false
     }, 200)
   },

4. 播放录音方法

    play() {
      if (this.voice) {
        this.innerAudioContext.src = this.voice.src
        this.innerAudioContext.play()
      }
    },

标签:程序实现,微信,录音,recorderManager,源码,let,innerAudioContext,duration,uni
From: https://www.cnblogs.com/xyqbk/p/17864773.html

相关文章

  • 视频直播源码,采用Redis实现购物车功能
    视频直播源码,采用Redis实现购物车功能1Redis核心配置类packagecom.jmh.springboot03.config; importorg.springframework.beans.factory.annotation.Autowired;importorg.springframework.beans.factory.annotation.Configurable;importorg.springframework.context.annot......
  • 手机直播源码,js实现懒加载、vue实现图片懒加载指令
    手机直播源码,js实现懒加载、vue实现图片懒加载指令图片懒加载监听滚动条滚动事件,当视口的高度+滚动高度,大于图片所在位置举例顶部的偏移量时(也就是距离),加载图片资源 index.html<!DOCTYPEhtml><html> <head>  <metacharset="UTF-8">  <metaname="viewport"conte......
  • 微信小程序车牌号码虚拟键盘
    WXML<viewclass="page"><!--车牌号码输入框--><viewclass="carNumber"><viewclass="weui-cells__title">请输入您要缴费的车牌号码</view><!--车牌号头两位--><viewclass="carNumber-items&......
  • 如何开启微信调试?
    解决方案:手机用usb连接至电脑(注意选择传输文件/调试模式,且手机需要开启usb调试,具体如何开启请自行百度)手机微信内点击/扫码打开http://debugxweb.qq.com/?inspector=true(会跳转到微信首页,跳转后就是开启了调试)微信内打开所需调试网址chrome浏览器打开chrome://inspect/#devi......
  • NS-3源码学习(四)wifi-ent-network.cc
    NS-3源码学习(四)wifi-ent-network.cc设定的参数booludp{true};udp/tcp通信选择booldownlink{true};AP->STA:downlink=true/STA->AP:downlink=false数据发送方向选择booluseExtendedBlockAck{false};启用扩展块确认,默认不启用,即块确认的大小为64,启用......
  • 微信小程序备案流程
    众所周知,现在微信小程序无论是新创建的还是存量的都需要进行备案了。一、备案需具备的条件是通过认证的小程序,现在认证小程序不能通过公众号资质直接快速创建并认证了。必须要单独认证(费用300元)二、开始备案1)填写主体信息,注意备注栏最好不要空着,要写详细把主体营业内容......
  • Nacos源码(三):SpringCloud-Nacos客户端注册源码分析
    1、服务注册源码入口在笔记(二):Nacos环境搭建中提到Nacos作为注册中心,在服务启动类中可通过添加可选配置注解@EnableDiscoveryClient,那么就先从这个注解入手,开启SpringCloud的Nacos注册中心的源码分析。EnableDiscoveryClient注解详情:EnableDiscoveryClientImport......
  • 3. Linux 源码编译 001
    重点:rpm-i-e-qi-ql-qf-qa--scripts。yuminstallremoveinfolistrepolistprovides。配置系统源。搭建私有仓库服务器。源码编译安装。ubuntudpkgapt/etc/apt/sources.list。1)介绍源码编译虽然有很多开源项目将软件打成RPM包,供人们使用,但并不是所有源代......
  • .NET生成微信小程序推广二维码
    前言对于小程序大家可能都非常熟悉了,随着小程序的不断普及越来越多的公司都开始推广使用起来了。今天接到一个需求就是生成小程序码,并且与运营给的推广图片合并在一起做成一张漂亮美观的推广二维码,扫码这种二维码就可以进入小程序。为了节省服务器内存资源,我想的就是成功调用通微......
  • 基于springboot的课程作业管理系统-计算机毕业设计源码+LW文档
    一、 研究目的和意义当今时代是飞速发展的信息时代。在各行各业中离不开信息处理,这正是计算机被广泛应用于信息管理系统的环境。计算机的最大好处在于利用它能够进行信息管理。使用计算机进行信息控制,不仅提高了工作效率,而且大大的提高了其安全性。尤其对于复杂的信息管理,计算机能......