MoePlayer / hexo-tag-aplayer

Embed aplayer in Hexo posts/pages
MIT License
741 stars 97 forks source link

关于歌词的一点问题 #34

Closed MonoLogueChi closed 6 years ago

MonoLogueChi commented 6 years ago

这个问题出现已经好久了,我也记不清是什么时候开始出现的了,以前的稳定版是这样,现在的beta版也是这样

我在文章里是这样写的

{% aplayer "朋友的酒" "李晓杰" "https://t1.aixinxi.net/o_1c3pt0b9v1i1eg03md8jt18kna.ogg" "lrc:https://t1.aixinxi.net/o_1c3pttc8b154g67r1bdtd0l1rvtc.txt" "autoplay" %}

生成的静态页面中是这样的

<div id="aplayer-tgimIrBv" class="aplayer aplayer-tag-marker" style="margin-bottom: 20px;">
            <pre class="aplayer-lrc-content"></pre>
        </div>
        <script>
          var ap = new APlayer({
            element: document.getElementById("aplayer-tgimIrBv"),
            narrow: false,
            autoplay: true,
            showlrc: true,
            music: {
              title: "朋友的酒",
              author: "李晓杰",
              url: "https://t1.aixinxi.net/o_1c3pt0b9v1i1eg03md8jt18kna.ogg",
              pic: "",
              lrc: "https://t1.aixinxi.net/o_1c3pttc8b154g67r1bdtd0l1rvtc.txt",
            }
          });
          window.aplayers || (window.aplayers = []);
          window.aplayers.push(ap);
        </script>

即使是把lrc那一句后面的逗号删掉依旧不能加载歌词,所以想请问一下,应该怎样操作才能加载歌词啊,还是我用的歌词的格式不对,以前是可以加载的。

grzhan commented 6 years ago

hexo-tag-aplayer 生成的代码似乎没有问题 不知道是不是 APlayer.js 对于歌词的 URL 加载有限制或者要求 @DIYgod

grzhan commented 6 years ago

应该是这边 LRC Option 没对应导致的 这几天修复

grzhan commented 6 years ago

请更新到最新版本的 hexo-tag-aplayer,查看问题是否存在。 若仍然存在问题,请提供浏览器控制台(Console)中记录的错误信息

MonoLogueChi commented 6 years ago

还是没有解决问题,页面地址为https://www.xxwhite.com/2018/YHKindergarten.html

console错误信息

Failed to load https://t1.aixinxi.net/o_1c4ckse89kial1s18ue13051p8qa.txt: No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'https://www.xxwhite.com' is therefore not allowed access.
kn007 commented 6 years ago

console不是写得很清楚,因为什么了么。

MonoLogueChi commented 6 years ago

@kn007 但是要怎么解决跨域请求的问题呢

kn007 commented 6 years ago

console写得很清楚。

grzhan commented 6 years ago

@MonoLogueChi 跨域限制是浏览器为了防止诸如 CSRF 等攻击所采取的安全措施,如果歌词文件是遇到跨域问题,请考虑将歌词文件放到同源网站(如 https://www.xxwhite.com )再进行请求,或者如果有歌词文件所在服务器的权限,请在歌词文件资源返回的 HTTP 头中添加 Access-Control-Allow-Origin 字段。

instpe commented 6 years ago

歌词不能直接通过访问资源拿到吗 头像什么的也不需要开启post assets 原理不能弄成一样的嘛