fnvtk/cunkebao_v3
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix(微信聊天): 修复音频消息上传处理逻辑

Browse Source 
修改音频上传回调参数类型为包含URL和时长的对象
优化音频格式检
This commit is contained in:
超级老白兔
2025-09-10 10:51:21 +08:00
parent f60bf294c1
commit 8fb8e83632
4 changed files with 56 additions and 31 deletions
Download Patch File Download Diff File Expand all files Collapse all files

26
Cunkebao/dist/.vite/manifest.json vendored
View File

@@ -1,18 +1,14 @@
{
"_charts-ghR_XExL.js": {
"file": "assets/charts-ghR_XExL.js",
"_charts-BjEBSMrK.js": {
"file": "assets/charts-BjEBSMrK.js",
"name": "charts",
"imports": [
"_ui-J9wtlgqT.js",
"_ui-CiJ_pikt.js",
"_vendor-BPPoWDlG.js"
]
},
"_ui-D0C0OGrH.css": {
"file": "assets/ui-D0C0OGrH.css",
"src": "_ui-D0C0OGrH.css"
},
"_ui-J9wtlgqT.js": {
"file": "assets/ui-J9wtlgqT.js",
"_ui-CiJ_pikt.js": {
"file": "assets/ui-CiJ_pikt.js",
"name": "ui",
"imports": [
"_vendor-BPPoWDlG.js"
@@ -21,6 +17,10 @@
"assets/ui-D0C0OGrH.css"
]
},
"_ui-D0C0OGrH.css": {
"file": "assets/ui-D0C0OGrH.css",
"src": "_ui-D0C0OGrH.css"
},
"_utils-DiZV3oaL.js": {
"file": "assets/utils-DiZV3oaL.js",
"name": "utils",
@@ -33,18 +33,18 @@
"name": "vendor"
},
"index.html": {
"file": "assets/index-PSLRJs-x.js",
"file": "assets/index-XUSzqBD3.js",
"name": "index",
"src": "index.html",
"isEntry": true,
"imports": [
"_vendor-BPPoWDlG.js",
"_utils-DiZV3oaL.js",
"_ui-J9wtlgqT.js",
"_charts-ghR_XExL.js"
"_ui-CiJ_pikt.js",
"_charts-BjEBSMrK.js"
],
"css": [
"assets/index-2A02LaoT.css"
"assets/index-677RgwmW.css"
]
}
}

8
Cunkebao/dist/index.html vendored
View File

@@ -11,13 +11,13 @@
</style>
<!-- 引入 uni-app web-view SDK（必须） -->
<script type="text/javascript" src="/websdk.js"></script>
<script type="module" crossorigin src="/assets/index-PSLRJs-x.js"></script>
<script type="module" crossorigin src="/assets/index-XUSzqBD3.js"></script>
<link rel="modulepreload" crossorigin href="/assets/vendor-BPPoWDlG.js">
<link rel="modulepreload" crossorigin href="/assets/utils-DiZV3oaL.js">
<link rel="modulepreload" crossorigin href="/assets/ui-J9wtlgqT.js">
<link rel="modulepreload" crossorigin href="/assets/charts-ghR_XExL.js">
<link rel="modulepreload" crossorigin href="/assets/ui-CiJ_pikt.js">
<link rel="modulepreload" crossorigin href="/assets/charts-BjEBSMrK.js">
<link rel="stylesheet" crossorigin href="/assets/ui-D0C0OGrH.css">
<link rel="stylesheet" crossorigin href="/assets/index-2A02LaoT.css">
<link rel="stylesheet" crossorigin href="/assets/index-677RgwmW.css">
</head>
<body>
<div id="root"></div>

38
Cunkebao/src/components/Upload/AudioRecorder/index.tsx
View File

@@ -10,7 +10,7 @@ import {
import { uploadFile } from "@/api/common";
interface AudioRecorderProps {
onAudioUploaded: (filePath: string) => void;
onAudioUploaded: (audioData: { url: string; durationMs: number }) => void;
className?: string;
disabled?: boolean;
maxDuration?: number; // 最大录音时长（秒）
@@ -63,14 +63,29 @@ const AudioRecorder: React.FC<AudioRecorderProps> = ({
const stream = await navigator.mediaDevices.getUserMedia({ audio: true });
// 尝试使用MP3格式，如果不支持则回退到WebM
let mimeType = "audio/mp3";
if (!MediaRecorder.isTypeSupported(mimeType)) {
mimeType = "audio/mpeg";
if (!MediaRecorder.isTypeSupported(mimeType)) {
mimeType = "audio/webm";
const mp3Types = [
"audio/mpeg",
"audio/mp3",
"audio/mpeg; codecs=mp3",
"audio/mp4",
"audio/mp4; codecs=mp4a.40.2",
];
let mimeType = "audio/webm"; // 默认回退格式
// 检测并选择支持的MP3格式
for (const type of mp3Types) {
if (MediaRecorder.isTypeSupported(type)) {
mimeType = type;
console.log(`使用音频格式: ${type}`);
break;
}
}
if (mimeType === "audio/webm") {
console.log("浏览器不支持MP3格式，使用WebM格式");
}
const mediaRecorder = new MediaRecorder(stream, { mimeType });
mediaRecorderRef.current = mediaRecorder;
chunksRef.current = [];
@@ -163,7 +178,9 @@ const AudioRecorder: React.FC<AudioRecorderProps> = ({
// 创建文件对象
const timestamp = Date.now();
const fileExtension =
audioBlob.type.includes("mp3") || audioBlob.type.includes("mpeg")
audioBlob.type.includes("mp3") ||
audioBlob.type.includes("mpeg") ||
audioBlob.type.includes("mp4")
? "mp3"
: "webm";
const audioFile = new File(
@@ -186,8 +203,11 @@ const AudioRecorder: React.FC<AudioRecorderProps> = ({
// 上传文件
const filePath = await uploadFile(audioFile);
// 调用回调函数
onAudioUploaded(filePath);
// 调用回调函数，传递音频URL和时长（毫秒）
onAudioUploaded({
url: filePath,
durationMs: recordingTime * 1000, // 将秒转换为毫秒
});
// 重置状态并关闭弹窗
deleteRecording();

15
Cunkebao/src/pages/pc/ckbox/weChat/components/ChatWindow/components/MessageEnter/index.tsx
View File

@@ -102,11 +102,14 @@ const MessageEnter: React.FC<MessageEnterProps> = ({ contract }) => {
AUDIO: 4,
FILE: 5,
};
const handleFileUploaded = (filePath: string, fileType: number) => {
const handleFileUploaded = (
filePath: string | { url: string; durationMs: number },
fileType: number,
) => {
// msgType(1:文本 3:图片 43:视频 47:动图表情包（gif、其他表情包） 49:小程序/其他：图文、文件)
let msgType = 1;
if ([FileType.TEXT].includes(fileType)) {
msgType = getMsgTypeByFileFormat(filePath);
msgType = getMsgTypeByFileFormat(filePath as string);
} else if ([FileType.IMAGE].includes(fileType)) {
msgType = 3;
} else if ([FileType.AUDIO].includes(fileType)) {
@@ -119,7 +122,9 @@ const MessageEnter: React.FC<MessageEnterProps> = ({ contract }) => {
wechatFriendId: contract?.chatroomId ? 0 : contract.id,
msgSubType: 0,
msgType,
content: filePath,
content: [FileType.AUDIO].includes(fileType)
? JSON.stringify(filePath)
: (filePath as { url: string; durationMs: number }).url,
};
sendCommand("CmdSendMessage", params);
};
@@ -162,8 +167,8 @@ const MessageEnter: React.FC<MessageEnterProps> = ({ contract }) => {
/>
<AudioRecorder
onAudioUploaded={filePath =>
handleFileUploaded(filePath, FileType.AUDIO)
onAudioUploaded={audioData =>
handleFileUploaded(audioData, FileType.AUDIO)
}
className={styles.toolbarButton}
/>