又想往文章里塞音频,结果发现以前的方法行不通了。其实上次插入网易云和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) (是松鼠病让我贴上这个链接)