开源一个好玩的项目 SyncMusic，一起在线听歌和聊天

V2EX = way to explore

V2EX 是一个关于分享和探索的地方

For Existing Member Sign In

爱意满满的作品展示区。

This topic created in 2368 days ago, the information mentioned may be changed or developed.

前天晚上我和朋友在群里讨论，他开发了一个点歌台，易语言写的，在 B 站上通过直播的方式来播放，通过弹幕点歌。

然后我就有了个想法，做一个网页的点歌台，然后也可以做类似于弹幕这样的实时交流功能。

经过一个晚上的开发，我做出了这个项目 SyncMusic，基本上实现了和他的点歌台一样的功能，唯一不同的地方就是我的点歌台是在网页上播放音乐的，而不是直播。

项目地址： https://github.com/kasuganosoras/SyncMusic

代码写了很详细的注释，非常适合新人学习 PHP WebSocket 应用程序开发。

功能特性

支持在线点歌
支持多人实时聊天
支持投票切掉当前音乐
没人点歌的时候可以随机播放音乐
管理员可切歌
管理员可删除指定音乐
管理员可将指定音乐提前播放
管理员可禁言指定用户
美观的界面 (Material Design)
无需登录，任何人都可以点歌
无需数据库，由 Swoole 内存表储存数据

有个地方就是获取音乐时间长度是用了 Python，原本我是想直接用 PHP 来获取的，但是有点麻烦，还要导入一个单独的库，想了想还是用最简单的办法来解决，于是就用 Python 整了个简单的脚本。

如果你有更好的读取音乐时间的实现方法，欢迎提 Pr 或通过 Issues 告诉我。

在线体验

如果你只是想体验一下或者单纯听歌，可以访问我的 Demo：https://music.tql.ink/

还请 dalao 们合理玩耍，不要点一些奇奇怪怪或者很难听的音乐，谢谢了~

点歌台

点歌

音乐

管理员

91 replies • 2019-12-26 18:49:40 +08:00

azssjli

Nov 7, 2019

你觉得你说了布点奇怪的歌我就会不点了吗，我就点 XD

KasuganoSoras

Nov 7, 2019

@azssjli #1 其实还在测试的时候我们群里的人就点了一大堆奇奇怪怪的歌了 23333

BreadKiller

Nov 7, 2019

虾米以前网页版有 loop，后来有自己的直播间可以让朋友进来跟听（就是我放什么别人进来的一样听什么）；
现在虾米 app 有趴间，功能上和 loop 差不多，可以有三个人上台轮流放歌，好听就给赞，不好听就踩（类似投票机制）；
上面的都可以文字交流，网页的 loop 和直播间现在都没了，只剩下 app 的趴间。
不同点就是这些都不是点歌机制，播放什么歌决定权在一个或几个人手上而已，但是可以自己开一个趴间（直播间）放自己的歌然后让别人来一起听一起交流。

run2

Nov 7, 2019

可以弄个小程序点歌，给咖啡厅 /餐吧这些用
VIP 可以点歌置顶什么的 😂

KasuganoSoras

Nov 7, 2019

@sobigfish #4 想法不错，至于 VIP 这个就需要接入用户系统了，这个以后再考虑吧

Uyuhz

Nov 7, 2019

看起来挺好玩的...不过刚才点一首 https://music.163.com/#/song?id=515143072 一直失败换了一首又好了...然后我才发现居然还有非客户端不能播放的歌...

Opportunity

Nov 7, 2019

@sobigfish KFC 现在就有这个功能

luckyrayyy

Nov 7, 2019

有点意思

luckyrayyy

Nov 7, 2019

我怎么看不到别人说话，自己打的字也没看到在哪

KasuganoSoras

Nov 7, 2019

@Uyuhz #6 @luckyrayyy #9 刚刚服务器有 bug，修好了

ZredoC

Nov 7, 2019

👍👍👍

SuperM

Nov 7, 2019

支持下，感觉蛮好玩的

Uyuhz

Nov 7, 2019

@KasuganoSoras 我说的 515143072 点歌失败的那个好像是网易云的问题，不是你的问题😂

lmx111aaa

Nov 7, 2019

讲道理，就像一个人安安静静的听歌

KasuganoSoras

Nov 7, 2019

@lmx111aaa #14 其实最初的想法也是安静听歌。。只是人一多起来就欢乐了 2333

moonrailgun

PRO

Nov 7, 2019

高中生可太厉害了

Ultraman

Nov 7, 2019 via Android

lost river 哪位给安排上🙃

lxk11153

Nov 7, 2019

"点歌台，易语言写的" 叫啥？

yoqu

Nov 7, 2019

👍👍👍

KasuganoSoras

Nov 7, 2019

@lxk11153 #18 https://live.bilibili.com/195909

MyFaith

Nov 7, 2019

之前在斗鱼某点歌直播间，点了几首首 2 小时起步的

4DAX07B8Kle4Dm6T

Nov 7, 2019

6666，不错

sdytman

Nov 7, 2019 via iPhone

这个 ui 设楼主自己写的？

KasuganoSoras

Nov 7, 2019

@sdytman #23 嗯，基于 Material Design 设计，除了这个背景模糊效果是参考 MKOnlineMusicPlayer 改的，其他都是我自己写的。

zuokanyunqishi

Nov 7, 2019 via Android

厉害厉害👍

nobt

Nov 7, 2019 via iPhone

为啥我 safari 没声音

mywaiting

Nov 8, 2019

@sobigfish 这个需求我这里还真有........

FEDT

Nov 8, 2019 via iPhone

一晚上，太强了👍🏻

hanhuoer

Nov 8, 2019

哈哈，刚去逛了逛，厉害👍

crab

Nov 8, 2019

虾米 loop

miaomiao888

Nov 8, 2019

想到以前的多米 DJ，谁都可以上台当 DJ 放自己喜欢的音乐然后一起听

PingPong

Nov 8, 2019 via Android

一定要设置违禁词，国歌什么的

longkas

Nov 8, 2019 via Android

一晚上，太牛逼了，我弄了个放电影直播间大半年

codingBug

Nov 8, 2019

我想问问，要用耳机吗？

SmallNing

Nov 8, 2019

感觉挺好玩的 ~

SmallNing

Nov 8, 2019

要是有 app 就好啦 ~ 再也不用找歌曲听了

qping

Nov 8, 2019

音乐的源用的哪里？

qping

Nov 8, 2019

@qping #37 我自己找到了，给楼主点个赞

BuilderQiu

Nov 8, 2019

如果大部分都挂机听歌...这 30%切歌就切不动了..

imdong

Nov 8, 2019

真·云听歌

点啥听啥，佛系随缘。

aalikes95

Nov 8, 2019

不错，相当的爽

dinjufen

Nov 8, 2019

题主高中生吗？我自愧不如。。

wsbnd9

Nov 8, 2019

切歌太难了

cwjokaka

Nov 8, 2019

有趣，别人的一晚上系列

rykka

Nov 8, 2019 via Android

歌从哪里来？

zackwu

Nov 8, 2019

做的很不错啊~

7654

Nov 8, 2019

SSL 810 端口的服务我这里的网络不支持。so sad

gzzchh

Nov 8, 2019 via Android

聊天内容要审查哦，不然容易查水表

killerv

Nov 8, 2019

可以的，挺好玩

zerozz

Nov 8, 2019

大佬的一晚上系列，体验了一下，挺好玩，666

Rekkles

Nov 8, 2019

6666

xianxiaobo

Nov 8, 2019

建议像直播放电影里面那样的积分制播放下一首歌曲，切歌太难了，更不要说连续切歌了。

haozes

Nov 8, 2019

不错不错

caryqy

Nov 8, 2019

和你朋友说下，直播弹幕点歌的注意一些歌是不能放的，不然直播间就没了

Donne

Nov 8, 2019

一晚上弄出来，我滴个龟龟

NotNil1

Nov 8, 2019

厉害厉害，好好玩啊

ksc010

Nov 8, 2019

可以考虑增加“频道”功能
将有不同音乐品味的人区分开来

ksc010

Nov 8, 2019

feature2:
待播放列表直接可以投票超过一定票数自动跳过不播放

hideonwhere

Nov 8, 2019

曲库太少了吧

IMengXin

Nov 8, 2019

为啥我点的所有歌都是未搜索到此歌曲

archknight

Nov 8, 2019

都是在疯狂切歌

senher

Nov 8, 2019

这些歌都是哪来的？

cont

Nov 8, 2019

我点什么歌都是提示“未搜索到此歌曲”

natforum

Nov 8, 2019

11ssss

Nov 8, 2019

不是曲库少是 ip ban 了

Xatoi

Nov 8, 2019 via iPhone

版权灾难

richard1122

Nov 8, 2019

之前做过一个类似的，在处理用户主动切、用户结束后切、投票这些问题上有一些实践，贴一段代码供参考：

```c#
private void CheckShouldForwardCurrentSong()
{
var userList = list.UserList;
var downVoteUserCount = downvoteUsers.Intersect(userList).Count;
var undeterminedCount = userList.Except(downvoteUsers).Except(finishedUsers).Count();
var connectedUserCount = userList.Select(it => socketManager.IsConnected(it)).Count();
if (!list.IsPlaying || downVoteUserCount >= QueryForceForwardCount(connectedUserCount) || undeterminedCount == 0)
{
ShouldForwardNow();
}
else if (undeterminedCount <= connectedUserCount * 0.5)
{
if (finishTimeoutTimer != null) return;
finishTimeoutTimer = new Timer(ShouldForwardNow, null, 5 * 1000, Infinite);
}
}

private static int QueryForceForwardCount(int total)
{
return Convert.ToInt32(Math.Ceiling((double)total / 2));
}
```

主要是需要考虑网络不好的用户可能还没听完，所以有一个 5 秒的缓冲期。

用户分成三类：

* 主动切：downVoteUserCount
* 已结束当前歌曲：finishedUsers
* 没有态度：undeterminedCount

richard1122

Nov 8, 2019

https://gist.github.com/richard1122/8b8ca492fa7c8faf7432bc0b19d2df7a