Never-Blink 是一个在线眨眼挑战游戏,可随机连接到世界各地的玩家并通过视频挑战对方,谁先眨眼谁就输。
. ├── backend │ ├── __init__.py │ ├── detect.py │ └── shape_predictor_68_face_landmarks.dat (detect model) ├── package.json ├── requirements.txt ├── server.py ├── src │ ├── app.jsx │ ├── index.js │ ├── play.jsx │ └── start.jsx ├── static │ └── bundle.js ├── templates │ └── index.html └── webpack.config.js
使用 react 作为前端框架, 使用 peerjs 在客户端之间通信。 在后端,使用 flask 来托管服务器。对于客户端和服务器之间的连接, 使用 socketio 实现实时数据传输。
react
peerjs
flask
socketio
我们使用有限状态机的概念来设计我们的游戏状态。圆圈代表状态,每个框顶部的文本是导致状态转换的事件,每个框底部的文本是事件发生时采取的操作。这里的逻辑非常简单,但实现起来并不容易。有关更多详细信息,请查看 play.jsx 或 server.py。