|
- <!-- <template>
- <div>
- <input type="file" ref="videoInput" @change="handleVideoUpload" accept="video/*" />
- <div v-if="videoUrl">
- <video :src="videoUrl" controls style="width: 200px; height: 200px"></video>
- </div>
- <button @click="extractAudio" :disabled="!videoUrl">提取音频</button>
- <button @click="downloadAudio" :disabled="!audioUrl">下载音频</button>
- </div>
- </template>
-
- <script>
- import { createFFmpeg, fetchFile } from '@ffmpeg/ffmpeg';
-
- export default {
- data() {
- return {
- ffmpeg: null,
- videoUrl: '',
- audioUrl: ''
- };
- },
- mounted() {
- this.ffmpeg = createFFmpeg({
- log: true
- });
-
- this.ffmpeg.load();
- },
- methods: {
- handleVideoUpload(event) {
- const file = event.target.files[0];
- this.videoUrl = URL.createObjectURL(file);
- },
- async extractAudio() {
- const file = this.$refs.videoInput.files[0];
- const inputPath = '/input' + file.name;
- const outputPath = '/output.mp3';
-
- await this.ffmpeg.write(inputPath, await fetchFile(file));
- await this.ffmpeg.run('-i', inputPath, '-vn', '-acodec', 'libmp3lame', outputPath);
-
- const data = await this.ffmpeg.read(outputPath);
- const audioBlob = new Blob([data.buffer], { type: 'audio/mp3' });
- this.audioUrl = URL.createObjectURL(audioBlob);
- },
- downloadAudio() {
- const link = document.createElement('a');
- link.href = this.audioUrl;
- link.download = 'audio.mp3';
- link.click();
- }
- }
- };
- </script> -->
|