optimize download function for suno

This commit is contained in:
RockYang
2024-09-11 08:39:28 +08:00
parent 2225f09797
commit a642ae0332
6 changed files with 45 additions and 10 deletions

View File

@@ -106,7 +106,7 @@
<el-tooltip effect="light" content="下载视频" placement="top">
<button class="btn btn-icon" @click="download(item)" :disabled="item.downloading">
<i class="iconfont icon-download" v-if="!item.downloading"></i>
<el-image src="/images/loading.gif" fit="cover" v-else />
<el-image src="/images/loading.gif" class="downloading" fit="cover" v-else />
</button>
</el-tooltip>
<el-tooltip effect="light" content="删除" placement="top">

View File

@@ -190,11 +190,10 @@
</button>
<el-tooltip effect="light" content="下载歌曲" placement="top">
<a :href="item.audio_url" :download="item.title+'.mp3'" target="_blank">
<button class="btn btn-icon">
<i class="iconfont icon-download"></i>
</button>
</a>
<button class="btn btn-icon" @click="download(item)">
<i class="iconfont icon-download" v-if="!item.downloading"></i>
<el-image src="/images/loading.gif" class="downloading" fit="cover" v-else />
</button>
</el-tooltip>
<el-tooltip effect="light" content="获取完整歌曲" placement="top" v-if="item.ref_song">
@@ -299,11 +298,11 @@ import BlackSwitch from "@/components/ui/BlackSwitch.vue";
import BlackInput from "@/components/ui/BlackInput.vue";
import MusicPlayer from "@/components/MusicPlayer.vue";
import {compact} from "lodash";
import {httpGet, httpPost} from "@/utils/http";
import {httpDownload, httpGet, httpPost} from "@/utils/http";
import {showMessageError, showMessageOK} from "@/utils/dialog";
import {checkSession} from "@/store/cache";
import {ElMessage, ElMessageBox} from "element-plus";
import {formatTime} from "@/utils/libs";
import {formatTime, replaceImg} from "@/utils/libs";
import Clipboard from "clipboard";
import BlackDialog from "@/components/ui/BlackDialog.vue";
import Compressor from "compressorjs";
@@ -483,6 +482,30 @@ const merge = (item) => {
})
}
// 下载歌曲
const download = (item) => {
const url = replaceImg(item.audio_url)
const downloadURL = `${process.env.VUE_APP_API_HOST}/api/download?url=${url}`
// parse filename
const urlObj = new URL(url);
const fileName = urlObj.pathname.split('/').pop();
item.downloading = true
httpDownload(downloadURL).then(response => {
const blob = new Blob([response.data]);
const link = document.createElement('a');
link.href = URL.createObjectURL(blob);
link.download = fileName;
document.body.appendChild(link);
link.click();
document.body.removeChild(link);
URL.revokeObjectURL(link.href);
item.downloading = false
}).catch(() => {
showMessageError("下载失败")
item.downloading = false
})
}
const uploadAudio = (file) => {
const formData = new FormData();
formData.append('file', file.file, file.name);