aplayer播放器对接alist

如果你不是通过官方的方式引入aplayer，那么建议你先看看这篇文章网页接入aplayer音乐播放器 | butlanys的博客

只需要在aplayer的配置js中改为下面的js

javascript

const urlParams = new URLSearchParams(window.location.search)
const path = urlParams.get('path') || '/music' // alist中访客可看到音乐的路径

fetch(`https://alist.butlanys.de/api/fs/list`, {
  method: 'POST',
  headers: {
    'Content-Type': 'application/json',
  },
  body: JSON.stringify({
    path: path,
    password: '', // 如果用的是访客权限，这里可以为空
    page: 1,
    per_page: 100, //获取的最大音乐数量，此值可大不可小，否则获取的音乐不全
    refresh: false,
  }),
})
  .then((response) => response.json())
  .then((data) => {
    if (data.code === 200) {
      const audioList = data.data.content
        .filter((item) => !item.is_dir)
        .map((item) => ({
          name: item.name.replace(/\.[^/.]+$/, ''),
          url: `https://alist.butlanys.de/d/onedrive-data${path}/${encodeURIComponent(item.name)}`,
          cover: item.thumb, // 可选：设置封面图片
        }))

      const ap = new APlayer({
        container: document.getElementById('aplayer'),
        fixed: true,
        autoplay: true,
        audio: audioList,
      })
    } else {
      console.error('获取音乐列表失败:', data.message)
    }
  })
  .catch((error) => {
    console.error('获取音乐列表出错:', error)
  })