Git Product home page Git Product logo

heomusic's Introduction

HeoMusic

一个基于AplayerMetingJS的静态音乐播放器

预览

HeoMusic - 用音乐感染人心

基本操作

Space空格键:暂停/播放音乐

上/下方向键:增加/减少音量

左/右方向键:上一曲/下一曲

修改歌单/私有部署与配置(适用于在线音乐)

ID

播放列表的id,可以从音乐歌单分享的链接中获取,例如https://y.qq.com/n/ryqq/playlist/8668419170中,id为8668419170

Server

播放列表的服务商,例如netease(网易云音乐),tencent(腾讯),kugou(酷狗),xiami(小米音乐),baidu(百度音乐)

Type(可选)

播放列表的类型,例如song(单曲), playlist(歌单,默认), album(专辑), search(搜索结果), artist(歌手)

localMusic(可选)

本地音乐/外链音乐。如果填写了本地音乐,则优先使用本地音乐。

本地音乐需要添加loaclMusic数组,它的形式类似于:

  var localMusic = [{
      name: '重生之我在异乡为异客',
      artist: '王睿卓',
      url: '/music/重生之我在异乡为异客.mp3',
      cover: '/music/重生之我在异乡为异客.png',
      lrc: '/music/重生之我在异乡为异客.lrc'
  },
  {
      name: '落',
      artist: '唐伯虎',
      url: '/music/落.mp3',
      cover: '/music/落.png',
      lrc: '/music/落.lrc'
  }
  ];

remoteMusic(可选)

使用json格式的链接来进行读取localMusic,会覆盖localMusic的设置。

例如:

var remoteMusic = './music.json';

musicjson内容例如:

[
  {
    "name": "重生之我在异乡为异客",
    "artist": "王睿卓",
    "url": "/music/重生之我在异乡为异客.mp3",
    "cover": "/music/重生之我在异乡为异客.png",
    "lrc": "/music/重生之我在异乡为异客.lrc"
  },
  {
    "name": "落",
    "artist": "唐伯虎",
    "url": "/music/落.mp3",
    "cover": "/music/落.png",
    "lrc": "/music/落.lrc"
  }
]

使用URL参数(推荐)

HeoMusic支持URL参数 https://music.zhheo.com/?id=+ id +&server= + server

例如:

HeoMusicTop: https://music.zhheo.com/?id=8668419170&server=tencent

鸡你太美: https://music.zhheo.com/?id=2762963245&server=netease

修改HTML的方法(适用于在线音乐和本地音乐)

编辑index.html的相关代码,填写歌单id和服务商

修改id和server

直接访问首页index.html即可

参与开发

@张洪Heo @anzhiyu @Glowed

许可

项目中包含的Aplayer及MetingJS的修改版本,他们均使用MIT协议

heomusic's People

Contributors

anzhiyu-c avatar zhheo avatar

Stargazers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

Watchers

 avatar  avatar  avatar

heomusic's Issues

手机浏览器打不开

我把网页部署到服务器,电脑访问可以打开,手机的浏览器打开页面是黑的,请问知道是怎么回事吗

建议把歌词聚焦改到中间

image

image

我觉得这样可能更好一些,看起来更舒服一些。只需要 translateY(?px); 后面的值+200px就可以了

觉得不好直接close即可 😂

kugou

你好!酷狗的分享链接里面的id试了几个id都不行,想问问大佬是不是酷狗id有特殊的获取方式,酷狗的我喜欢歌单能否获取到id。
以下是我的几个歌单链接:
https://www.kugou.com/songlist/gcid_3zaynorkz2z0bf/?uid=577256490&chl=wechat&cover=http%3A%2F%2Fimge.kugou.com%2Fstdmusic%2F20221118%2F20221118083511423898.jpg&iszlist=1

https://www.kugou.com/songlist/gcid_3zaynorkzkz0a9/?uid=577256490&chl=wechat&iszlist=1

望大佬回复一下,thanks

关于歌词

如果能让歌词始终处于垂直居中的位置,就是我见过最好的一款最好的在线播放器,希望作者努努力

能否新增一个本地曲库模式

使用服务商提供的api固然是方便,但是一些需要vip的歌曲就只能试听30s,并且对于applemusic用户更是难受,本地模式就可以把自己珍藏的一些无损资源放上去。希望可以

更新了歌单内容如何自动刷新

之前生成的一些QQ音乐的歌单里面发现大部分都是VIP歌单,造成无法播放。更新了歌单内容以后,刷新播放器跟重启Web服务都不能刷新HeoMusic的歌单列表。

大佬,能否增加以下功能

1.本地音乐能否支持读取php脚本生成的本地json文件
2.能否支持本地音乐歌词网络搜索,并下载到本地音乐所在文件夹
3.能否支持歌单管理
感谢大佬开发的优雅的在线网络播放器

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.