代码拉取完成,页面将自动刷新
☁️ 项目演示地址:http://175.178.71.181:9000/
dowmload
新属性,和将外链转化为内链两者相结合的形式实现跨域下载资源文件├── music_box
│ ├── node_modules
│ ├── public
│ ├── src
| | ├── assets // 静态资源
| | ├── common // 公共配置
| | ├── components // 自定义组件
| | ├── pages
| | ├── router
| | ├── services
| | ├── store // 状态管理
| | └── utils
| | ├── index.js
│ ├── craco.config.js
│ ├── package.json
│ ├── yarn.lock
│ ├── README.md // 项目文档
在HTML5的 a标签
中新增了 dowmload
属性 ,可实现文件的下载并重命名。但由于 a标签
存在跨域问题,需通过将外链地址转化成内链的方式,才能实现在播放器的当前页面进行下载。详见:Web 文件下载和 A 标签的使用
源码如下:
const loadDownSong = (musicId, musicName) => {
if (musicId == undefined) return false;
getSongSource(musicId).then(res => {
const songUrl = res?.url?.data?.url ?? "";
if (songUrl) {
fetch(songUrl)
.then(response => response.blob())
.then(blob => {
const objectURL = window.URL.createObjectURL(blob);
const newA = document.createElement('a');
newA.href = objectURL;
newA.download = musicName;
newA.click();
window.URL.revokeObjectURL(objectURL);
});
message.info("已在后台开启下载", 1);
} else {
message.info("未知该歌曲源地址", 1);
}
});
}
播放器首页 (一)
播放器搜索 (二)
播放器播放 (三)
播放器外链 (四)
播放器歌曲信息 (五)
播放器播放列表 (六)
播放器下载 (七)
本项目的部分资源、UI 设计以及软件仅用于个人学习开发测试,勿用于商业及非法用途,如产生法律纠纷与本人无关。
如此项目造成侵权损失,请联系本人删除:2361954836@qq.com
此处可能存在不合适展示的内容,页面不予展示。您可通过相关编辑功能自查并修改。
如您确认内容无涉及 不当用语 / 纯广告导流 / 暴力 / 低俗色情 / 侵权 / 盗版 / 虚假 / 无价值内容或违法国家有关法律法规的内容,可点击提交进行申诉,我们将尽快为您处理。