|
|
@@ -212,6 +212,7 @@ export default {
|
|
|
url: data.Location,
|
|
|
type: _type,
|
|
|
size: size,
|
|
|
+ duration: this.fileList.find(i => i.index == res.index).duration,
|
|
|
fileObj:this.fileList.find(i => i.index == res.index).fileObj,
|
|
|
};
|
|
|
this.fileList.find(i => i.index == res.index).status = "success";
|
|
|
@@ -227,7 +228,7 @@ export default {
|
|
|
console.log("上传完成");
|
|
|
}
|
|
|
},
|
|
|
- addFile() {
|
|
|
+ async addFile() {
|
|
|
let input = document.createElement("input");
|
|
|
input.type = "file";
|
|
|
input.accept = "video/mp4, audio/wav, audio/x-m4a, audio/mpeg, text/plain";
|
|
|
@@ -236,7 +237,7 @@ export default {
|
|
|
|
|
|
input.click();
|
|
|
|
|
|
- input.addEventListener("change", e => {
|
|
|
+ input.addEventListener("change", async e => {
|
|
|
let files = e.target.files;
|
|
|
console.log(files)
|
|
|
for (let i = 0; i < files.length; i++) {
|
|
|
@@ -244,6 +245,9 @@ export default {
|
|
|
if (
|
|
|
["video/mp4", "audio/wav", "audio/x-m4a", "text/plain","audio/mpeg"].includes(files[i].type)
|
|
|
) {
|
|
|
+ if(files[i].type==='audio/wav'){
|
|
|
+ files[i].name = files[i].name.toLowerCase();
|
|
|
+ }
|
|
|
this.fileList.push({
|
|
|
file: files[i],
|
|
|
index: uuidv4(),
|
|
|
@@ -272,6 +276,26 @@ export default {
|
|
|
});
|
|
|
}
|
|
|
}
|
|
|
+
|
|
|
+ if(this.fileList.length>0){
|
|
|
+ console.log("获取音频时长")
|
|
|
+ for(let i = 0;i<this.fileList.length;i++){
|
|
|
+ console.log(this.fileList[i])
|
|
|
+ if(["audio/wav", "audio/x-m4a","audio/mpeg"].includes(this.fileList[i].type)){
|
|
|
+ try {
|
|
|
+ let _time = await this.getAudioDuration(this.fileList[i].file);
|
|
|
+ this.fileList[i].duration = this.updateRecordedTimeMixin({duration:_time.toFixed(2)});
|
|
|
+ console.log(`音频时长：${this.updateRecordedTimeMixin({duration:_time.toFixed(2)})}`)
|
|
|
+ } catch (error) {
|
|
|
+ console.log(error)
|
|
|
+ continue
|
|
|
+ }
|
|
|
+
|
|
|
+ }else{
|
|
|
+ continue;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
});
|
|
|
},
|
|
|
async getTemplateData() {
|
|
|
@@ -309,7 +333,86 @@ export default {
|
|
|
} catch (error) {
|
|
|
console.log("获取模板失败");
|
|
|
}
|
|
|
- }
|
|
|
+ },
|
|
|
+ //获取音频文件的时长
|
|
|
+ async getAudioDuration(file) {
|
|
|
+ // 方法1：使用 <audio> 元素（更快更轻量）
|
|
|
+ const mediaElementMethod = () =>
|
|
|
+ new Promise((resolve, reject) => {
|
|
|
+ const audio = document.createElement("audio");
|
|
|
+ const url = URL.createObjectURL(file);
|
|
|
+
|
|
|
+ audio.preload = "metadata";
|
|
|
+ audio.src = url;
|
|
|
+
|
|
|
+ const cleanup = () => {
|
|
|
+ URL.revokeObjectURL(url);
|
|
|
+ audio.remove();
|
|
|
+ };
|
|
|
+
|
|
|
+ audio.onloadedmetadata = () => {
|
|
|
+ if (isFinite(audio.duration) && audio.duration > 0) {
|
|
|
+ cleanup();
|
|
|
+ resolve(audio.duration);
|
|
|
+ } else {
|
|
|
+ reject(new Error("无法通过元数据获取时长"));
|
|
|
+ }
|
|
|
+ };
|
|
|
+
|
|
|
+ audio.onerror = () => {
|
|
|
+ cleanup();
|
|
|
+ reject(new Error("音频加载错误"));
|
|
|
+ };
|
|
|
+
|
|
|
+ // iOS Safari 兼容处理
|
|
|
+ audio.load();
|
|
|
+ document.body.appendChild(audio);
|
|
|
+ });
|
|
|
+
|
|
|
+ // 方法2：使用 Web Audio API（更精确但更耗资源）
|
|
|
+ const webAudioMethod = () =>
|
|
|
+ new Promise((resolve, reject) => {
|
|
|
+ const reader = new FileReader();
|
|
|
+
|
|
|
+ reader.onload = async () => {
|
|
|
+ try {
|
|
|
+ const audioContext = new (window.AudioContext ||
|
|
|
+ window.webkitAudioContext)();
|
|
|
+ const buffer = await audioContext.decodeAudioData(reader.result);
|
|
|
+ resolve(buffer.duration);
|
|
|
+ } catch (e) {
|
|
|
+ reject(new Error("音频解码失败: " + e.message));
|
|
|
+ }
|
|
|
+ };
|
|
|
+
|
|
|
+ reader.onerror = () => reject(new Error("文件读取失败"));
|
|
|
+ reader.readAsArrayBuffer(file);
|
|
|
+ });
|
|
|
+
|
|
|
+ // 优先尝试快速方法，失败时回退到精确方法
|
|
|
+ try {
|
|
|
+ return await mediaElementMethod();
|
|
|
+ } catch (firstError) {
|
|
|
+ console.warn("快速方法失败:", firstError.message, "尝试精确方法...");
|
|
|
+ try {
|
|
|
+ return await webAudioMethod();
|
|
|
+ } catch (secondError) {
|
|
|
+ throw new Error(`所有方法均失败: ${firstError.message} > ${secondError.message}`);
|
|
|
+ }
|
|
|
+ }
|
|
|
+ },
|
|
|
+ //时间
|
|
|
+ updateRecordedTimeMixin({ duration }) {
|
|
|
+ // 更新currentTime，将秒数转换为时分秒格式
|
|
|
+ let hours = Math.floor(duration / 3600);
|
|
|
+ let minutes = Math.floor((duration % 3600) / 60);
|
|
|
+ let seconds = Math.floor(duration % 60);
|
|
|
+ return `${hours
|
|
|
+ .toString()
|
|
|
+ .padStart(2, "0")}:${minutes
|
|
|
+ .toString()
|
|
|
+ .padStart(2, "0")}:${seconds.toString().padStart(2, "0")}`;
|
|
|
+ },
|
|
|
}
|
|
|
};
|
|
|
</script>
|
SanHQin