铜钟音乐：免费听歌，免注册，浏览器打开就能用
【免费下载链接】tonzhon-music铜钟「Tonzhon」: 干净纯粹的音乐平台 (铜钟已不再使用原来的 tonzhon.com，现在的 tonzhon.com 不是正版的铜钟)项目地址: https://gitcode.com/GitHub_Trending/to/tonzhon-music
🎵 在一堆 App 之间找歌的麻烦
找一首歌，打开第一个音乐 App 没有，换第二个要会员，或者得先看完一段广告才给播。当切来切去的成本高于歌曲本身，人就会开始找一个只负责放歌的免费听歌平台。
铜钟音乐是什么
铜钟（Tonzhon）是一个纯前端的 Web 音乐应用，页面上所有内容都与音乐直接相关——没有广告、没有社交、没有直播，目标只有一个：帮你快速找到歌并听到。
⌨️ 核心能力：搜歌、双击播放、本地歌单
铜钟最有价值的地方，是把"听到一首歌"这件事压缩成了两三个动作。拉开差距的三个功能：
- 歌曲搜索：输入中文或英文歌名、歌手名，回车后页面直接切到结果列表，每首歌带封面、歌名和歌手。按歌手搜，能一次看到这位歌手的多首歌。
- 双击播放，空格暂停：在歌曲列表里双击任意一首，底部播放条立刻开播，不用挪鼠标去点按钮；按空格随时暂停或继续。播放器提供顺序、列表循环、单曲重复、随机四种模式，当前第几首/共几首也在界面上显示。
- 聆听列表 + 歌单管理：正在播放的歌单叫"聆听列表"，自动存进浏览器本地存储，刷新或下次打开都在，接着听不用重找。点歌上的图标可以把歌收藏，或创建自己的歌单再加歌进去。
找得到、播得快、存得下，构成了完整的听歌闭环，具体操作只有四步。
操作动线：四步从搜索到播放
- 你用浏览器打开铜钟，首页顶部就是搜索栏，没有注册和登录页挡在前面。
- 你输入歌名或歌手名回车，页面跳到搜索结果，每行都显示封面、歌名和歌手。
- 你双击想听的那首，底部播放条开始出声；想暂停就按空格，全程不用碰鼠标。
- 你把鼠标悬停在歌曲上，收藏和加入歌单的图标会浮出来，点一下就把歌收进歌单；聆听列表存在本地，下次打开原样还在。
👥 适合谁：三类人
铜钟不适合想要直播、评论区或推荐流的人，它最对这三类人的胃口：
- 通勤地铁上想快速切歌的人：搜索→双击两个动作就能出声，没有会员弹窗打断播放。
- 上班长时间挂背景音的人：界面只有歌和播放器，没有好友动态和直播卡片抢注意力，播放模式和音量设置一次就不用再管。
- 给长辈配平板的子女：没有社交功能要学，没有广告可误触，音量会记住，刷新后和上次一样。
📦 技术速览：纯前端 Web 应用
铜钟音乐基于 React 构建：前端是 React 19 + Vite 8 + Tailwind CSS 4 + Ant Design 6，状态管理用 Zustand，音频源通过轻量 API 按需获取，浏览器打开即用、无需安装。核心逻辑集中在三个模块：
- 播放器核心 player.jsx：播放模式切换、进度条、音量记忆
- 搜索栏 SearchBar.jsx：搜索入口与结果页跳转
- 聆听列表状态 useListenlistStore.js：聆听列表的本地存储
想本地跑起来，仓库地址是 https://gitcode.com/GitHub_Trending/to/tonzhon-music ，克隆后执行npm i再npm run dev即可。
开始听
回到开头的麻烦：找歌不用再比 App、不用碰会员，搜一下、双击就能出声。打开浏览器进入铜钟，30 秒内就能听到第一首歌。
【免费下载链接】tonzhon-music铜钟「Tonzhon」: 干净纯粹的音乐平台 (铜钟已不再使用原来的 tonzhon.com，现在的 tonzhon.com 不是正版的铜钟)项目地址: https://gitcode.com/GitHub_Trending/to/tonzhon-music
创作声明：本文部分内容由AI辅助生成（AIGC），仅供参考
