又想往文章里塞音频,结果发现以前的方法行不通了。其实上次插入网易云和QQ音乐的时候就发现之前插入的音乐播放不了,但没有着手解决。这次又碰上这个问题,干他。
首先,是喜闻乐见的Markdown的Aplayer教程
1 | {% aplayer title author url [picture_url, narrow, autoplay, width:xxx, lrc:xxx] %} |
| 属性 | 解释 |
|---|---|
| title | 曲目标题 |
| author | 曲目作者 |
| url | 音乐文件 URL 地址 |
| picture_url | (可选) 音乐对应的图片地址 |
| narrow | (可选) 播放器袖珍风格 |
| autoplay | (可选) 自动播放,移动端浏览器暂时不支持此功能 |
| width:xxx | (可选) 播放器宽度 (默认: 100%) |
| lrc:xxx | (可选) 歌词文件 URL 地址(lrc的地址似乎不能用形如“/lyrics.lrc”的相对路径,会报错) |
这些属性都是字符串,需要用英文输入法下的双引号""括住。
现在,我们来解决音频文件问题
例如:这个链接是在Github页面中点击View Raw跳转到的,但你现在就是打不开。
以前这个是可以打开的,当时我直接把这个地址写到上文中提到的Aplayer的URL中,就可以播放了,但现在显然是Github那里做了什么,导致现在无法这么写。
这里,先贴上给我解决方案的帖子。他的解决方案是通过你的Github Pages的link来访问该文件,而非GitHub的link(使用相对路径也🆗)。并给出了原因(The reason why the https://github.com link doesn’t work the way you want is because we only enable linking of certain file types and force download of all others, such as MP3s, from https://github.com.)
接下来,我对开发者工具中的Referrer Policy有点疑问
毕竟今天在检查这个问题的时候,我看到了好几个不同的Policies嘛。
开始贴网址,Referrer-Policy解释了各个Directives的不同,你也可以看看这个网站。但我连Referrer是什么都不知道,好吧,那看下这个链接。
关于strict-origin-when-cross-origin,这个页面告诉我们这个directive可以帮助防止隐私数据泄露。
参考资料
- http请求的时候Referrer-Policy是什么鬼? (这篇文章排版我不是很喜欢,但它的确给了我启发)
- 跨源资源共享(CORS) (是松鼠病让我贴上这个链接)