html 苹果微信录音js,基于JS开发微信网页录音功能的实例代码
具体代码如下所示:
wx.ready(function () {
var startRecordflag = false
var startTime = null
//btnRecord 为录音按钮dom对象
btnRecord.addEventListener('touchstart', function (event) {
event.preventDefault();
startTime = newDate().getTime();
// 延时后录音,避免误操作
recordTimer = setTimeout(function () {
wx.startRecord({
success: function () {
var rainAllowRecord = sessionStorage.getItem("rainAllowRecord");//判断是否授权过允许使用录音功能
if (!isEmpty(rainAllowRecord) && rainAllowRecord == "1") {
//开始录音时的操作 如修改录音按钮样式等
} else {
//一般第一次时 都没有授权 弹出授权窗口后 无法终止录音过程 所以在这里设置rainAllowRecord 的值表示允许过录音 并且在第一次时主动停止录音
sessionStorage.setItem("rainAllowRecord", "1");
wx.stopRecord();
}
startRecordflag = true;
},
cancel: function () {
startRecordflag = true;
alert('用户拒绝授权录音');
},
complete: function () {
startRecordflag = true;
}
});
}, 300);
});
btnRecord.addEventListener('touchend', function (event) {
event.preventDefault();
// 间隔太短
var timeDitance = newDate().getTime() - startTime;
if (timeDitance < 300) {
startTime = 0;
// 不录音
clearTimeout(recordTimer);
} else {
// 松手结束录音
//startRecordflag 因为startRecord是个异步方法 防止没有进入startRecord 的回调就进入了这里
var startRecordHandle = setInterval(function () {
//startRecordflag为true 表示已经进入过startRecord的回调
if (startRecordflag) {
startRecordflag = false;
clearInterval(startRecordHandle);
wx.stopRecord({
success: function (res) {
voice.localId = res.localId;
translateVoice();
},
fail: function (res) {
}
});
}
}, 0);
}
});
wx.onVoiceRecordEnd({
complete: function (res) {
voice.localId = res.localId;
alert('录音时间已超过一分钟');
}
});
function translateVoice() {
//调用微信的语音转文字接口
wx.translateVoice({
localId: voice.localId,
isShowProgressTips: 0,
complete: function (res) {
if (res.hasOwnProperty('translateResult')) {
alert('识别结果:' + res.translateResult);
} else {
}
}
});
}
function playVoice() {
wx.playVoice({
localId: voice.localId
});
}
})
总结
以上所述是小编给大家介绍的基于JS开发微信网页录音功能的实例代码,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对网站的支持!
如果你觉得本文对你有帮助,欢迎转载,烦请注明出处,谢谢!
html 苹果微信录音js,基于JS开发微信网页录音功能的实例代码相关推荐
- 基于python 开发 微信机器人自动回复 app
基于python 开发 微信机器人自动回复 app # coding:utf-8 __author__ = "zhou" # create by zhou on 2020/3/3 ...
- 微信公众号H5页面开发--微信JS-SDK引用
微信公众号H5页面开发–微信JS-SDK引用 微信提供了微信公众号开发者手册,官方地址:https://mp.weixin.qq.com/ 公众号内许多复杂的业务场景,都是通过网页形式来提供服务,这时 ...
- js Function对象扩展与延时执行函数实例代码
网页特效 function对象扩展与延时执行函数实例代码 function.prototype.delay=function(this1,timeout){ this1=this1||null; ti ...
- java 微信自定义菜单开发_微信公众号开发之设置自定义菜单实例代码【java版】...
本实例是为了实现在管理后台实现微信菜单的添加删除管理. 1.首先我们需要新建一个数据库表用于存放menu菜单项 可包含的字段有id.父类id.name.排序.是否显示.类型(view.click).链 ...
- 微信小游戏申请注册流程+开发微信小游戏类目需要具备条件
微信小游戏申请注册流程+开发微信小游戏类目需要具备条件 在这里先讲一下,小程序和小游戏前面的注册流程都是一样的,在注册完毕登录小程序后台后选择类目时需要注意一下,我下面讲解的是已经通过认证的服务号进行 ...
- 教你用html+js制作一个自己的点名系统,实例代码分享
简介 教你用html+js制作一个自己的点名系统,实例代码如下. 效果 代码 HTML <div class="wrapper"><h1 align=" ...
- 祖玛java代码_androidzuma 基于java开发的安卓祖玛龙珠游戏代码,可帮助 的 学习。 Develop 238万源代码下载- www.pudn.com...
文件名称: androidzuma下载 收藏√ [ 5 4 3 2 1 ] 开发工具: Java 文件大小: 1174 KB 上传时间: 2013-11-27 下载次数: 1 提 供 者: ...
- 展示一下基于flask框架的网页播放器的代码
<p>下面是基于Flask框架的网页播放器的代码:from flask import Flaskapp = Flask(<strong>name</strong>) ...
- 基于uni-app开发微信小程序__手牵手带你开发【懂你找图】项目
前戏 某一天的夜里,敲完了代码之后便直接倒在床上睡着了,醒来时只记得梦里的一句话:"想要成为高手,就必须要大量实践,大量做项目,必须要把自己不会的东西全部吃透,不要得过且过.",猛 ...
- 基于 Wachaty 开发微信机器人 个人微信号小助手平台
wxbot 微信机器人,个人微信号小助手平台, nodejs + nuxt + wechaty 技术栈 准备 微信机器人开源库调研,GitHub 找到以下 3 个开源作品: itchat itchat ...
最新文章
- 清华张悠慧:AI时代,「图灵完备」之后,「类脑计算完备」如何设计?
- 有经验的JAVA程序员如何提升自己?
- AI之父图灵登上50英镑钞票,荣耀比肩牛顿达尔文;吴恩达:将激励更多人
- 智能安防 回家开门进入“看脸”时代
- (原+译)使用numpy.savez保存字典后读取的问题
- 番茄时间有感之关于在疫情期间我与ACM不得不说的故事
- 初探SQL Server 2008商业智能
- 原来Java大数据才是真正的高富帅!
- Memcache for Windows
- GoogLenet网络解读及代码实现(Pytorch)
- 阿里云ECS服务器CentOS7上用户管理操作
- android中Intent的一些用法和总结
- ORB-SLAM3 一张图梳理rgbd_tum.cc主流程
- 打开html文件显示undefined,undefined是什么?电脑网页出现undefined时如何解决?
- Monkey基本命令
- C语言编程学习使用auto定义变量的用法
- dockerfile的端口映射
- ADO Overview
- An example machine learning notebook
- delhpi 身份证校验