内容目录
背景
上一篇我们讲到如何获取全民K歌歌曲信息（上一篇：这是一个获取全民K歌歌曲信息的composer包），那么这一篇我将继续带领大家实现一个开箱即用全民K歌版网页播放器。这里我们主要使用的一个开源网页播放器APlayer（github.com/MoePlayer/APlayer）。为了方便我们这里直接使用cdn外链的方式来使用。
代码
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>哼起小曲儿~</title>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<style>
body {
font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif;
}
.container {
max-width: 32rem;
margin-left: auto;
margin-right: auto;
margin-bottom: 50px;
}
</style>
</head>
<body>
<div class="container">
<div id="player" class="aplayer"></div>
</div>
<script src="https://unpkg.com/aplayer"></script>
<script>
var ap4 = new APlayer({
element: document.getElementById('player'),
narrow: false,
autoplay: false,
showlrc: false,
mutex: true,
theme: '#ad7a86',
mode: 'random',
music: [
<?php
require_once __DIR__ . '/vendor/autoload.php';
use Jay\Kg\Music;
$music = new Music();
$more = $music->getMore(array('O58-ECO1_Hvq7Omg', 'O58-ECO1_dhz6OQZ'));
foreach ($more as $one) {
?>
{
title: '<?php echo $one['data']['song_name']?>',
author: '<?php echo $one['data']['singer_name']?>',
url: '<?php echo $one['data']['playurl']?>',
pic: '<?php echo $one['data']['fb_cover']?>',
},
<?php
}
?>
]
});
</script>
</body>
</html>
talk is cheap, just show you code, 上面我们直接贴出混编的代码。真正开箱即用。使用时你只需要替换
$more = $music->getMore(array('O58-ECO1_Hvq7Omg', 'O58-ECO1_dhz6OQZ'));
中的shareid即可。到这里一个开箱即用的全民K歌网页播放器就完成了。
[…] 到这里我已经可以根据网页shareid来抓取歌曲信息，那么下一篇我们讲结合一个开源的的网页播放器来继续实现我们的全民K歌版网页播放器。这是一个播放全民K歌歌曲的网页播放器 […]
请问我们的shareid怎么获得？
你可以看上上一篇就知道了，上一篇有讲的