从疫情确定开始已两月有余了,虽然国内已经好转起来了,但境外输入在不断增加,并且国外疫情日趋严重,受此影响公司现在没什么事做,加上神兽还没复课,每天在家上课,因此天天在家陪着他。
闲着无聊就听听音乐,上上网,日子就这么不知不觉过到快4月了。一年已经过去四分之一了,莫名的心慌呀。。。
近段时间逛云村时发现好多音乐因为版权问题已经不支持“生成外链播放器”了,作为云村铁粉的我听歌只用云村,网站上的音乐也基本全部用的云村的。
当然,凡事都会有解决的办法的,最简单的粗暴的办法就是直接修改浏览器地址:
https://music.163.com/#/song?id=110097
如这个地址下的音乐,点击图标下的“生成外链播放器”,会弹出“由于版权保护,无法生成外链”。
右键点击“生成外链播放器”,然后点击“检查”,里面会有一段代码,我们复制其中一小段
data-href=”/outchain/2/110097/”
替换上面那个地址后面部分后变成下面地址
https://music.163.com/#/outchain/2/110097
是不是熟悉的页面又回来了,歌单方法相同,开始Enjoy and Share起来吧!
这种办法虽然简单粗暴,但如果要生成的数量多了也太麻烦了吧。
可以试试播放器APlayer, 其实好多朋友有装此款插件,而老王本人喜欢折腾代码不喜欢装插件。APlayer是一款非常简单易用的播放器,加上外观与云村相似,第一眼看上就喜欢上了。再加上它不单可以自建歌单,还可以和几大音乐平台无缝对接。
自建歌单大家拿到代码都知道怎么用了,这里主要说下和其它平台对接的方法,当做一个笔记记录吧。
Code Source
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/aplayer/dist/APlayer.min.css">
<script src="https://cdn.jsdelivr.net/npm/aplayer/dist/APlayer.min.js"></script>
Code Source
<script src="https://cdn.jsdelivr.net/npm/meting@1.1.0/dist/Meting.min.js"></script> //1.1版
<script src="https://cdn.jsdelivr.net/npm/meting@2/dist/Meting.min.js"></script> //2.0版
JS有新旧两个版本,选其中一个即可,之所以放两个,是因为下面对应的有两个不同的使用方法,其实效果是一样的。
在需要放播放器的地方放上下列代码 (二选一,但版本一定要和上面JS对应):
Code Source
<div class="aplayer" data-id="954957001" data-server="netease" data-type="playlist" data-mode="random"> </div> //1.1版本
<meting-js server="netease" type="playlist" id="954957001"></meting-js> //2.0版本
这两个方法对应的歌单都是同一个歌单:
https://music.163.com/#/playlist?id=954957001
除了云村的外,还支持其它几大平台的哦,只把对应的server和id改一下就可以了,是不是很强大呢?
option | default | description |
---|---|---|
id | require | song id / playlist id / album id / search keyword |
server | require | music platform: netease, tencent, kugou, xiami, baidu |
type | require | song, playlist, album, search, artist |
auto | options | music link, support: netease, tencent, xiami |
fixed | false | enable fixed mode |
mini | false | enable mini mode |
autoplay | false | audio autoplay |
theme | #2980b9 | main color |
loop | all | player loop play, values: ‘all’, ‘one’, ‘none’ |
order | list | player play order, values: ‘list’, ‘random’ |
preload | auto | values: ‘none’, ‘metadata’, ‘auto’ |
volume | 0.7 | default volume, notice that player will remember user setting, default volume will not work after user set volume themselves |
mutex | true | prevent to play multiple player at the same time, pause other players when this player start play |
lrc-type | 0 | lyric type |
list-folded | false | indicate whether list should folded at first |
list-max-height | 340px | list max height |
storage-name | metingjs | localStorage key that store player setting |
大家也可以试一下大发的云音乐插件(只支持云村的),我的音乐页面就是用的这个插件(安时还不知道APlayer)。
这几天也把网站整理了一下,清理了一些重复的CSS,并修改了一些细节化的东西,增加了评论统计和汉语两个页面(可导航菜单访问,待继续完善),把代码高亮插件干掉了,自己整了一个短代码样子的(效果见上面),插件虽然强大,但好多东西对于我这种很少发代码的人来说没啥用,同时加了一个收缩短代码,并修改了信息提示短代码样式(如上面所示),还有把滚动图标弄小了,侧栏可以关闭。。。。。