博客自动播放音乐

添加播放器#

参考 博客园美化——添加Apalyer音乐播放器 文章给博客加个Aplayer音乐播放器，可以参考它们的官方中文文档增加自定义设置，在页脚HTML代码中加入：

<!-- 为博客底部添加音乐组件 -->
<div id="player"  class="aplayer"></div>
<link href="https://blog-static.cnblogs.com/files/timefiles/APlayer.min_v1.10.1.css" rel="stylesheet">
<script src="https://blog-static.cnblogs.com/files/timefiles/APlayer.min_v1.10.1.js"></script> 
<script type="text/javascript">
const ap = new APlayer({
    container: document.getElementById('player'),
    fixed: true,
    autoplay: true, //自动播放
    order:'random',//随机播放
    audio: [{
        name: '烟花易冷',
        artist: '小柔Channel',
        url: 'https://blog-static.cnblogs.com/files/timefiles/%E7%83%9F%E8%8A%B1%E6%98%93%E5%86%B7-%E5%B0%8F%E6%9F%94Channel.js',
        cover: 'https://blog-static.cnblogs.com/files/timefiles/%E7%83%9F%E8%8A%B1%E6%98%93%E5%86%B7-%E5%B0%8F%E6%9F%94Channel-%E5%B0%81%E9%9D%A2.gif?t=1662465614',
        },
	{
        name: '红颜如霜',
        artist: '江壹纯',
        url: 'https://blog-static.cnblogs.com/files/timefiles/%E7%BA%A2%E9%A2%9C%E5%A6%82%E9%9C%9C-%E6%B1%9F%E5%A3%B9%E7%BA%AF.js',
        cover: 'https://blog-static.cnblogs.com/files/timefiles/%E7%BA%A2%E9%A2%9C%E5%A6%82%E9%9C%9C-%E6%B1%9F%E5%A3%B9%E7%BA%AF-%E5%B0%81%E9%9D%A2.gif?t=1662465544',
	}

    ]
});
ap.init();
</script>

建议将APlayer.min_v1.10.1.css、APlayer.min_v1.10.1.js两个文件保存到自己的博客，将封面、音频文件的链接填入上面的脚本代码中。链接使用博客园内部链接，不依靠第三方应用。

生成歌曲URL和封面链接#

上面的歌曲是我自己比较喜欢的两首歌，来自B站：

• 真的不来听一下吗？挑战B站最甜 『 红颜如霜 』翻唱
• 雨纷纷 旧故里草木深

参考 获取哔哩哔哩视频封面 下载视频的反面并手动调整好大小，图片如下：

通过bilibili手机端的下载缓存提取音频文件，参考 怎么单独下载bilibili上视频中的音频（MP3格式的）。

最重要的一步是把图片的后缀改为gif、把音频文件的后缀改为js然后上传到博客园的文件，因为博客园只支持这几种文件：