修改语音解锁逻辑
This commit is contained in:
+3
-1
@@ -32,7 +32,9 @@
|
||||
},
|
||||
/* 模块配置 */
|
||||
"modules" : {
|
||||
"Camera" : {},
|
||||
"Camera" : {
|
||||
"description": "用于访问摄像头进行实时预览"
|
||||
},
|
||||
"Barcode" : {},
|
||||
"Record" : {},
|
||||
"VideoPlayer" : {},
|
||||
|
||||
@@ -57,8 +57,10 @@
|
||||
// 播放状态变更
|
||||
changeStreamPlaying({ status }) {
|
||||
if (status === false) {
|
||||
console.log('播放结束', this.playNumber);
|
||||
this.$emit('playOver', this.playNumber)
|
||||
console.log('播放结束组件', this.playNumber);
|
||||
const aaa = this.playNumber
|
||||
this.playNumber = ''
|
||||
this.$emit('playOver', aaa);
|
||||
}
|
||||
},
|
||||
|
||||
@@ -69,14 +71,6 @@
|
||||
}
|
||||
}
|
||||
},
|
||||
|
||||
// 若需要watch监听(原组合式API的watch),补充如下(当前代码无watch逻辑,可删)
|
||||
watch: {
|
||||
// 示例:监听playNumber变化(如有需要)
|
||||
// playNumber(newVal) {
|
||||
// console.log('播放id变更:', newVal);
|
||||
// }
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
||||
@@ -87,50 +81,6 @@
|
||||
* 音频路由兼容方案(适配 H5/小程序/不支持 setAudioRoute 的设备)
|
||||
* @param {string} type - earpiece(听筒)/speaker(扬声器)
|
||||
*/
|
||||
function fallbackAudioRoute(type) {
|
||||
// 1. 通用:创建音频上下文(Web Audio API),控制输出设备
|
||||
try {
|
||||
const AudioContext = window.AudioContext || window.webkitAudioContext;
|
||||
if (AudioContext) {
|
||||
const audioCtx = new AudioContext();
|
||||
// 针对听筒:降低音量+强制单声道(模拟听筒效果)
|
||||
if (type === 'earpiece') {
|
||||
audioCtx.listener.setPosition(0, 0, 0); // 定位到听筒
|
||||
// 若有播放节点,设置音量为 0.3(听筒音量)
|
||||
if (window.audioSource) {
|
||||
window.audioSource.gain.value = 0.3;
|
||||
}
|
||||
} else {
|
||||
// 扬声器:恢复音量+立体声
|
||||
if (window.audioSource) {
|
||||
window.audioSource.gain.value = 1;
|
||||
}
|
||||
}
|
||||
}
|
||||
} catch (e) {}
|
||||
|
||||
// 2. 安卓 H5 特殊处理:通过 Audio 对象的 speakerphone 属性(部分浏览器支持)
|
||||
const audio = new Audio();
|
||||
if (audio.setSpeakerphoneOn) {
|
||||
// 听筒:关闭扬声器;扬声器:打开
|
||||
audio.setSpeakerphoneOn(type !== 'earpiece');
|
||||
audio.play(); // 触发设置生效
|
||||
audio.pause(); // 无需播放实际音频
|
||||
}
|
||||
|
||||
// 3. 小程序端(如微信小程序):调用小程序原生 API
|
||||
if (wx && wx.setAudioRoute) {
|
||||
// 微信小程序专属:切换音频输出(需基础库 2.10.0+)
|
||||
wx.setAudioRoute({
|
||||
route: type === 'earpiece' ? 'earpiece' : 'speaker',
|
||||
success: () => console.log('小程序音频路由切换成功'),
|
||||
fail: (e) => console.error('小程序路由切换失败:', e)
|
||||
});
|
||||
}
|
||||
|
||||
// 4. 兜底提示(非 5+ 环境)
|
||||
console.log(`当前环境不支持强制音频路由,已模拟${type === 'earpiece' ? '听筒' : '扬声器'}效果`);
|
||||
}
|
||||
|
||||
export default {
|
||||
mounted() {
|
||||
@@ -150,9 +100,7 @@
|
||||
console.log('切换音频输出')
|
||||
},
|
||||
appendPCMChunk(numArray) {
|
||||
// console.log('接收到', numArray.length);
|
||||
if (!numArray || numArray.length === 0) return;
|
||||
// 数字数组转回ArrayBuffer
|
||||
const uint8 = new Uint8Array(numArray);
|
||||
const arrayBuffer = uint8.buffer;
|
||||
player.appendChunk(arrayBuffer);
|
||||
@@ -162,7 +110,7 @@
|
||||
if (player) {
|
||||
player.destroy();
|
||||
player = null;
|
||||
// 重新初始化(方便后续再次播放)
|
||||
// 重新初始化
|
||||
const _this = this;
|
||||
player = new StreamPlayer({
|
||||
inputSampleRate: 16000,
|
||||
@@ -176,8 +124,8 @@
|
||||
},
|
||||
// 播放结束回调(通知主线程)
|
||||
callback(e) {
|
||||
console.log('播放结束回调', e);
|
||||
if (e === 'ended') {
|
||||
console.log('播放结束renderjs', e);
|
||||
this.$ownerInstance.callMethod('changeStreamPlaying', {status:false});
|
||||
}
|
||||
}
|
||||
|
||||
@@ -94,7 +94,9 @@ export default function useWebSocket(aaas = null, options = {}) {
|
||||
// 控制消息
|
||||
console.log('控制消息', msgType, body);
|
||||
if (body.type === 1) { // 开始播放,记录当前播放的语音id
|
||||
console.log('开始播放,记录当前播放的语音id', body.lock);
|
||||
setPlayNumber(body.lock)
|
||||
|
||||
}
|
||||
break;
|
||||
|
||||
|
||||
@@ -135,10 +135,15 @@
|
||||
});
|
||||
};
|
||||
const playOver = (id) => {
|
||||
send(ProtocolCodec.pack(MessageType.CONTROL_CMD, {
|
||||
type:2,
|
||||
lock:id
|
||||
}))
|
||||
console.log('播放完毕talk通知后端', id);
|
||||
if(id) {
|
||||
setTimeout(() => {
|
||||
send(ProtocolCodec.pack(MessageType.CONTROL_CMD, {
|
||||
type:2,
|
||||
lock:id
|
||||
}))
|
||||
}, 300)
|
||||
}
|
||||
};
|
||||
const onError = (body) => {
|
||||
// websocket错误处理
|
||||
|
||||
@@ -251,7 +251,7 @@
|
||||
console.log('申请权限',getPhoneEnvBool('AND'));
|
||||
if(getPhoneEnvBool('AND')){
|
||||
console.log('申请权限');
|
||||
// await initRecord();
|
||||
await initRecord();
|
||||
}
|
||||
|
||||
|
||||
|
||||
+6
-229
@@ -1,236 +1,13 @@
|
||||
<template>
|
||||
<view class="container">
|
||||
<button @click="onStartRecord" :disabled="isRecording">开始录音</button>
|
||||
<button @click="onStopRecord" :disabled="!isRecording">停止录音</button>
|
||||
<view class="tip">{{ status }}</view>
|
||||
<view class="tip">当前分贝:{{ currentDecibels }}</view>
|
||||
<yao-RecordFrame ref="recordFrame" @onFrameRecorded="frameRecorded" @currentDecibels="onCurrentDecibels"
|
||||
@onStop="stopIt">
|
||||
</yao-RecordFrame>
|
||||
<sdx-StreamPlayer ref="aaa">xx</sdx-StreamPlayer>
|
||||
<button @click="test">接通电话</button>
|
||||
<button @click="applyRecordPermission">申请录音权限</button>
|
||||
|
||||
<view class="hidden">
|
||||
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import {
|
||||
ProtocolCodec,
|
||||
MessageType,
|
||||
SerializationType,
|
||||
CompressionType,
|
||||
ControlCommand,
|
||||
ProtocolConst,
|
||||
} from './ProtocolCodec';
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
status: "未录音",
|
||||
currentDecibels: 0,
|
||||
isRecording: false,
|
||||
ws: null, // WebSocket 实例
|
||||
audioContext: null, // 音频上下文
|
||||
scriptProcessor: null, // 音频处理节点
|
||||
audioBufferSource: null, // 音频源节点
|
||||
frameBufferList: [], // 缓存音频帧
|
||||
// wsUrl: "ws://127.0.0.1:8000/ws/audio",
|
||||
wsUrl: "ws://25.64.32.157:9603/trapractice/voiceCallSocket/voiceCall?summary=3D072C9D242C96EA3F0FD647CB14A6F4B4BEA4493BB2FAAB065935FB405071B8A903128E488B6D06BEB23FD4E3D15EE6", // 替换为实际后端地址
|
||||
};
|
||||
},
|
||||
onUnload() {
|
||||
// 页面卸载时清理资源
|
||||
this.stopRecordAndClean();
|
||||
},
|
||||
methods: {
|
||||
test() {
|
||||
this.ws = uni.connectSocket({
|
||||
url: this.wsUrl,
|
||||
fail: () => {
|
||||
console.log('fail');
|
||||
},
|
||||
success: () => {
|
||||
console.log('web');
|
||||
},
|
||||
fail: () => {
|
||||
console.log('fail');
|
||||
},
|
||||
});
|
||||
this.ws.onOpen((res) => {
|
||||
console.log('WebSocket连接已打开', res);
|
||||
this.ws.send({
|
||||
data: ProtocolCodec.pack(MessageType.IDENTITY, {
|
||||
user_id: '1001',
|
||||
token: 'your_auth_token',
|
||||
name: '测试用户'
|
||||
})
|
||||
});
|
||||
});
|
||||
this.ws.onMessage((res) => {
|
||||
const {
|
||||
msgType,
|
||||
body
|
||||
} = ProtocolCodec.unpack(res.data)
|
||||
console.log('msgType', msgType);
|
||||
if (msgType === MessageType.IDENTITY) {
|
||||
console.log('身份校验成功', body);
|
||||
this.onStartRecord()
|
||||
}
|
||||
})
|
||||
|
||||
},
|
||||
// 申请录音权限
|
||||
async applyRecordPermission() {
|
||||
try {
|
||||
const res = await uni.requestPermissions({
|
||||
scope: "scope.record"
|
||||
});
|
||||
const isGranted = res[0].grantStatus === 1;
|
||||
if (!isGranted) {
|
||||
uni.showToast({
|
||||
title: "请授予录音权限",
|
||||
icon: "none"
|
||||
});
|
||||
}
|
||||
return isGranted;
|
||||
} catch (e) {
|
||||
console.error("申请权限失败:", e);
|
||||
return false;
|
||||
}
|
||||
},
|
||||
// ArrayBuffer 转字符串
|
||||
// 兼容的 ArrayBuffer 转字符串方法
|
||||
arrayBufferToStringCompat(buffer) {
|
||||
// 方法1: 使用 String.fromCharCode 和 Uint8Array
|
||||
const uint8Array = new Uint8Array(buffer);
|
||||
let str = '';
|
||||
for (let i = 0; i < uint8Array.length; i++) {
|
||||
str += String.fromCharCode(uint8Array[i]);
|
||||
}
|
||||
return str;
|
||||
|
||||
// 方法2: 或者使用更简洁的方式
|
||||
// return String.fromCharCode.apply(null, new Uint8Array(buffer));
|
||||
},
|
||||
// 开始录音
|
||||
onStartRecord() {
|
||||
console.log('开始录音');
|
||||
try {
|
||||
this.$refs.recordFrame.start({
|
||||
sampleRate: 16000,
|
||||
frameSize: 1024,
|
||||
gain: 1.0,
|
||||
onFrameRecorded: ({
|
||||
isLastFrame,
|
||||
frameBuffer
|
||||
}) => {
|
||||
try{
|
||||
this.ws.send({
|
||||
data: ProtocolCodec.pack(MessageType.AUDIO_DATA, frameBuffer)
|
||||
});
|
||||
} catch(e){}
|
||||
},
|
||||
onDecibels: (decibels) => {
|
||||
this.currentDecibels = decibels;
|
||||
}
|
||||
});
|
||||
this.isRecording = true;
|
||||
this.status = "录音中...";
|
||||
} catch (e) {
|
||||
console.error("启动录音失败:", e);
|
||||
this.status = "启动录音失败";
|
||||
this.isRecording = false;
|
||||
}
|
||||
},
|
||||
|
||||
// 停止录音
|
||||
onStopRecord() {
|
||||
this.stopRecordAndClean();
|
||||
},
|
||||
|
||||
// 停止录音并清理资源
|
||||
stopRecordAndClean() {
|
||||
if (this.isRecording) {
|
||||
// 停止录音组件
|
||||
this.$refs.recordFrame.stop();
|
||||
this.isRecording = false;
|
||||
this.status = "已停止录音";
|
||||
}
|
||||
|
||||
// 关闭 WebSocket
|
||||
if (this.ws) {
|
||||
this.ws.close();
|
||||
this.ws = null;
|
||||
}
|
||||
|
||||
// 清理音频上下文
|
||||
if (this.audioContext) {
|
||||
this.audioContext.close();
|
||||
this.audioContext = null;
|
||||
this.scriptProcessor = null;
|
||||
this.frameBufferList = [];
|
||||
}
|
||||
|
||||
// 重置状态
|
||||
this.currentDecibels = 0;
|
||||
},
|
||||
|
||||
// 接收音频帧并处理
|
||||
frameRecorded({
|
||||
isLastFrame,
|
||||
frameBuffer
|
||||
}) {
|
||||
// console.log("收到音频帧:", isLastFrame, frameBuffer.length);
|
||||
|
||||
// 2. 通过 WebSocket 发送给后端
|
||||
if (this.ws) {
|
||||
try {
|
||||
this.ws.send({
|
||||
data: frameBuffer
|
||||
});
|
||||
} catch (e) {
|
||||
console.error("发送音频帧失败:", e);
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
},
|
||||
|
||||
// 监听分贝值
|
||||
onCurrentDecibels(decibels) {
|
||||
// this.currentDecibels = decibels.toFixed(2);
|
||||
// console.log("当前分贝:", this.currentDecibels);
|
||||
},
|
||||
|
||||
// 录音停止回调
|
||||
stopIt(base64) {
|
||||
this.stopRecordAndClean();
|
||||
console.log("录音停止,最终音频Base64:", base64?.substring(0, 50) + "...");
|
||||
},
|
||||
},
|
||||
};
|
||||
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.container {
|
||||
padding: 20rpx;
|
||||
}
|
||||
|
||||
button {
|
||||
margin: 10rpx 0;
|
||||
padding: 15rpx 30rpx;
|
||||
background: #007aff;
|
||||
color: white;
|
||||
border: none;
|
||||
border-radius: 8rpx;
|
||||
}
|
||||
|
||||
button:disabled {
|
||||
background: #ccc;
|
||||
}
|
||||
|
||||
.tip {
|
||||
margin: 15rpx 0;
|
||||
font-size: 28rpx;
|
||||
color: #333;
|
||||
}
|
||||
<style>
|
||||
|
||||
</style>
|
||||
@@ -1,147 +0,0 @@
|
||||
<template>
|
||||
<view>
|
||||
<video :is-live="true" id="myVideo" :src="videoSrc" :autoplay="true"></video>
|
||||
<live-pusher id="livePusher" ref="livePusher" class="livePusher" url="rtmp://25.18.122.148:9605/voice_in/aa" mode="SD" :muted="true" :enable-camera="false" :auto-focus="true" :beauty="1" whiteness="2" aspect="9:16" @statechange="statechange" @netstatus="netstatus" @error="error"></live-pusher>
|
||||
|
||||
<view class="btn" @click="prepare"><text>预热</text></view>
|
||||
<view class="btn" @click="start"><text>开始推流</text></view>
|
||||
<view class="btn" @click="pause"><text>暂停推流</text></view>
|
||||
<view class="btn" @click="resume"><text>恢复推流</text></view>
|
||||
<view class="btn" @click="stop"><text>停止推流</text></view>
|
||||
<view class="btn" @click="snapshot"><text>快照</text></view>
|
||||
<view class="btn" @click="startPreview"><text>开启摄像头预览</text></view>
|
||||
<view class="btn" @click="stopPreview"><text>关闭摄像头预览</text></view>
|
||||
<view class="btn" @click="switchCamera"><text>切换摄像头</text></view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { prepareApi } from '@/api/talk.js'
|
||||
var pusher
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
context: null,
|
||||
baseName: 'aaa'
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
videoSrc() {
|
||||
return 'rtmp://rtmp.home.tymas.cn:1935/voice_in/' + this.baseName
|
||||
}
|
||||
},
|
||||
onReady() {
|
||||
const videoContext = uni.createVideoContext('myVideo')
|
||||
videoContext.setVolume(1.0)
|
||||
// 注意:需要在onReady中 或 onLoad 延时
|
||||
// pusher = uni.createLivePusherContext('livePusher', this)
|
||||
// console.log(pusher)
|
||||
},
|
||||
methods: {
|
||||
statechange(e) {
|
||||
console.log('statechange:', e, JSON.stringify(e))
|
||||
},
|
||||
netstatus(e) {
|
||||
console.log('netstatus:' + JSON.stringify(e))
|
||||
},
|
||||
error(e) {
|
||||
console.log('error:' + JSON.stringify(e))
|
||||
},
|
||||
start: function () {
|
||||
console.log('statechange:', pusher.start)
|
||||
pusher.start({
|
||||
success: a => {
|
||||
console.log('livePusher.start:' + JSON.stringify(a))
|
||||
}
|
||||
})
|
||||
},
|
||||
prepare: function () {
|
||||
this.initPusher()
|
||||
// prepareApi(this.baseName)
|
||||
// .then(res => {
|
||||
// console.log(res)
|
||||
// })
|
||||
// .catch(err => {
|
||||
// console.log(err)
|
||||
// if (err === 'prepare') {
|
||||
// this.initPusher()
|
||||
// }
|
||||
// })
|
||||
},
|
||||
close: function () {
|
||||
pusher.close({
|
||||
success: a => {
|
||||
console.log('livePusher.close:' + JSON.stringify(a))
|
||||
}
|
||||
})
|
||||
},
|
||||
snapshot: function () {
|
||||
pusher.snapshot({
|
||||
success: e => {
|
||||
console.log(JSON.stringify(e))
|
||||
}
|
||||
})
|
||||
},
|
||||
resume: function () {
|
||||
pusher.resume({
|
||||
success: a => {
|
||||
console.log('livePusher.resume:' + JSON.stringify(a))
|
||||
}
|
||||
})
|
||||
},
|
||||
pause: function () {
|
||||
pusher.pause({
|
||||
success: a => {
|
||||
console.log('livePusher.pause:' + JSON.stringify(a))
|
||||
}
|
||||
})
|
||||
},
|
||||
stop: function () {
|
||||
pusher.stop({
|
||||
success: a => {
|
||||
console.log(JSON.stringify(a))
|
||||
}
|
||||
})
|
||||
},
|
||||
switchCamera: function () {
|
||||
pusher.switchCamera({
|
||||
success: a => {
|
||||
console.log('livePusher.switchCamera:' + JSON.stringify(a))
|
||||
}
|
||||
})
|
||||
},
|
||||
startPreview: function () {
|
||||
pusher.startPreview({
|
||||
success: a => {
|
||||
console.log('livePusher.startPreview:' + JSON.stringify(a))
|
||||
}
|
||||
})
|
||||
},
|
||||
stopPreview: function () {
|
||||
pusher.stopPreview({
|
||||
success: a => {
|
||||
console.log('livePusher.stopPreview:' + JSON.stringify(a))
|
||||
}
|
||||
})
|
||||
},
|
||||
initPusher() {
|
||||
pusher = new plus.video.LivePusher('pusher-box', {
|
||||
url: 'rtmp://rtmp.home.tymas.cn:1935/voice_in/' + this.baseName,
|
||||
'enable-camera': true
|
||||
})
|
||||
pusher.addEventListener('statechange', this.statechange)
|
||||
pusher.addEventListener('netstatus', this.netstatus)
|
||||
pusher.addEventListener('error', this.error)
|
||||
console.log(pusher)
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
<style>
|
||||
.btn {
|
||||
width: 100%;
|
||||
height: 80rpx;
|
||||
background-color: #ccc;
|
||||
margin-bottom: 5rpx;
|
||||
}
|
||||
</style>
|
||||
Reference in New Issue
Block a user