当前位置： 首页 > news >正文

写了个页面分享此时此刻我在听的歌

news 2026/3/26 22:22:21

演示

页面是 https://imba97.me/playing

原理

最近发了篇博客文章：《自建音乐服务 Navidrome》，里面提到可以使用last.fm来保存听歌历史

通过这个网站的接口可以拿到播放列表，根据听歌的先后顺序，也有当前是否正在播放的字段

后端

让Chat GPT用PHP写了个程序，功能就是简单的请求接口、10 秒数据缓存

因为last.fm接口给的图片国内没法访问，所以图片优先获取itunes上的，如果都没图，保底还会有个icon

前端

用简单写了个前端，10 秒轮询调接口获取最新数据

可以展示加载中、当前未听歌、当前正在听歌状态

用了 UnoCSS，永远的神！论 UnoCSS 实现一个旋转效果能有多简单

<divi-ph-music-note-simple-duotoneh-20w-20animate-spinanimate-duration-30000></div>

开源

Github: imba97/playing-music

http://www.jsqmd.com/news/459359/

相关文章：

  • 优选算法——分治（1）：三路快排
  • 【更新至2024年】2013-2024年各省数字经济指数数据（含原始数据+计算代码+结果）
  • 1分钟，带你认识门窗五金系统！
  • Ubuntu 20.04 LTS 防止暴力破解
  • Unreal Engine 4核心概念解析：Pawn——游戏世界中的可操控化身
  • Methyltetrazine–PEG4–Mal 1802908-02-6 活细胞双靶点标记探针
  • 基于Simulink的鲁棒H∞整流器控制器设计
  • 【通俗易懂告诉你什么是人工智能/CNN/RNN/DL......】
  • 智能AI裂缝识别 裂缝图像分割识别 建筑物裂缝识别 建筑结构裂缝自动检测模型训练 道路桥梁病害识别算法10529期
  • Unreal Engine 4核心概念解析：Character——专为人形角色设计的终极“游戏化身”
  • 毕业设计：基于SpringBoot Ai和Vue的旅游攻略小程序（源码）
  • OpenClaw霸榜，Agent正悄无声息地干掉传统“App”！
  • Mac病毒清除过程, SimulatorTrampoline,提醒事项APP伪装 XcodeGhost,XCSSET类型
  • 刷题笔记:力扣第18题-四数之和
  • 华为 MetaERP 的内部交易协同，是基于元数据驱动的多组织模型 + 事件驱动的服务总线 + 分布式事务 + 智能对账引擎，实现内部交易从发起、协同、确认到对账、抵消的全链路自动化、数据同源、零差异
  • STM32CubeMX配置串口采集超声波传感器数据(四)
  • Android BLE 稳定连接管理器（Kotlin版）完整代码骨架（下篇）
  • 动态规划之背包问题详解（从入门到实战）
  • Kubernetes中的网络策略（Network Policies）
  • 华为 MetaERP 已成为核电行业国产替代的核心方案，以全栈自主可控为基础，通过联合共建模式深度适配核电高安全、强管控、长周期的行业特性，已在中核、中广核等龙头企业落地标杆项目
  • SAP（以 S/4HANA 为代表）通过多组织建模、多分类账（多账套）、多币种引擎、多会计准则并行四大核心机制，在统一数据模型（ACDOCA）上实现集团化、全球化、多准则的财务核算架构
  • 3.5 数据管线、损失函数与分布式训练如何配合
  • Python 源文件默认编码是 **UTF-8**（推荐使用），如果文件包含非 ASCII 字符（如中文），无需额外声明；若需使用其他编码（如 GBK），需在文件第一行/第二行声明
  • SAP 利润中心Profit是如何实现跨法人、穿透式管理的？
  • 基于堆叠自动编码器（SAE）的人脸图像识别：Matlab 实现
  • 第10章 移动平台着色器优化实战：从简化到高级技巧
  • schoober-ai-sdk：核心ReAct 引擎的实现
  • SAP 利润中心 + 分部报告 + 集团合并 + 多准则 是怎么联动成一套集团财务架构的
  • 基于 CAN 总线的 DSP280049C 升级方案全解析
  • OpenClaw Mac本地部署保姆级教程：手把手教你“养龙虾”