<template>
<div>
<u-modal v-model="yyShow" show-cancel-button cancel-text='取消录音' :show-title='false' confirm-text='结束录音' @cancel='cancel'
@confirm='stop'>
<view>
<!-- <button class="record" @click="start">开始录音</button> -->
<!-- <button @click="stop">结束录音</button>
<button @click="cancel">取消录音</button> -->
<image style="width: :100%;" v-if="!shShow" @click="start" src="../static/index/unyy.png" mode=""></image>
<image style="width: :100%;" v-if="shShow" src="../static/index/yy1.gif" mode=""></image>
</view>
</u-modal>
<!-- <img src="../../static/image/timg.gif" alt="" @click="translationStart" > -->
</div>
</template>
<script>
// import wx from 'weixin-js-sdk';
import{api_voiceToText}from'@/api/common'
var wx = require('jweixin-module')
// var _this = wx;
import {
api_wechatscan
} from '@/api/common.js'
export default {
data() {
return {
yyShow: false,
shShow:false,
localId: '',
serverId: '',
downLoadId: '',
Soff: true,
time: 0,
timer: null
};
},
mounted() {},
created() {
this.getConfig()
},
methods: {
getConfig() {
const self = this;
const apiUrl = window.location.href
console.log(apiUrl,'222')
// var apiUrl = 'http://zhongjianh5.dev.xinzhidi.cn/#/pages/index/medicine/match'
api_wechatscan({
url: apiUrl, //获取签名等信息的地址
}).then(({
result
}) => {
return
// console.log(res.data.data)
let list = result
wx.config({
beta: true, // 必须这么写,否则wx.invoke调用形式的jsapi会有问题
debug: false, // 开启调试模式,调用的所有api的返回值会在客户端alert出来,若要查看传入的参数,可以在pc端打开,参数信息会通过log打出,仅在pc端时才会打印。
appId: list.appId, // 必填,企业微信的corpID
timestamp: list.timesTamp, // 必填,生成签名的时间戳
nonceStr: list.nonceStr, // 必填,生成签名的随机串
signature: list.signature, // 必填,签名
jsApiList: [
'startRecord', 'stopRecord', 'onVoiceRecordEnd', 'playVoice', 'pauseVoice',
'stopVoice', 'uploadVoice', 'downloadVoice', 'downloadVoice'
] // 必填,需要使用的JS接口列表
});
wx.ready(() => {
wx.checkJsApi({
jsApiList: ['startRecord', 'stopRecord', 'onVoiceRecordEnd',
'playVoice', 'pauseVoice', 'stopVoice', 'uploadVoice',
'downloadVoice', 'downloadVoice'
], // 需要检测的JS接口列表,所有JS接口列表见附录2,
success: function(res) {
console.log('返回信息')
console.log(res)
// 以键值对的形式返回,可用的api值true,不可用为false
// 如:{"checkResult":{"chooseImage":true},"errMsg":"checkJsApi:ok"}
}
});
// wx.startRecord();
// config信息验证后会执行ready方法,所有接口调用都必须在config接口获得结果之后,config是一个
// 客户端的异步操作,所以如果需要在页面加载时就调用相关接口,则须把相关接口放在ready函数中调
// 用来确保正确执行。对于用户触发时才调用的接口,则可以直接调用,不需要放在ready函数中。
})
wx.error((res) => {
// 这个地方的好处就是wx.config配置错误,会弹出窗口哪里错误,然后根据微信文档查询即可。
})
}).catch((error) => {
// error
})
},
// 开始录音
start() {
var that = this
that.time = 0
wx.startRecord({
success: function() {
that.shShow=true
console.log('成功开始录音')
that.timer = setInterval(() => {
that.time++
}, 1000)
that.vicoeEnd()
},
cancel: function() {
that.shShow=false
alert('用户拒绝授权录音')
}
})
},
stop() {
this.shShow=false
var that = this
// clearInterval(that.timer)
wx.stopRecord({
success: function(res) {
// alert('暂停成功')
console.log(res, '停止录音')
that.localId = res.localId
that.upVoice()
},
fail: function(error) {
// alert('死啦停不了')
console.log(error)
}
})
},
cancel() {
wx.stopRecord({
success: (res) => {
uni.showToast({
title: "取消录音",
icon:'none'
})
this.shShow=false
this.yyShow=false
console.log(res, '取消')
}
})
},
vicoeEnd() {
uni.showToast({
title: "开始录音",
icon:'none'
})
var that = this
wx.onVoiceRecordEnd({
// 录音时间超过一分钟没有停止的时候会执行 complete 回调
complete: function(res) {
that.shShow=false
console.log(res, '监听')
alert('60秒停止录音')
that.localId = res.localId
that.upVoice()
}
})
},
upVoice() {
var that = this
wx.uploadVoice({
localId: that.localId, // 需要上传的音频的本地ID,由stopRecord接口获得
isShowProgressTips: 1, // 默认为1,显示进度提示
success: function(res) {
console.log(res, '上传')
var apiUrl = window.location.href
that.yyShow=false
that.shShow=false
that.serverId = res.serverId // 返回音频的服务器端ID
api_voiceToText({
serverId:res.serverId
}).then((res)=>{
that.$emit("yyText",res.result);
})
},
error:(error)=>{
uni.showToast({
title: error
})
}
})
}
},
};
</script>
<style lang="less">
/deep/image{
width: 100%;
}
</style>