一、MusicCard介绍

1.1 MusicCard简介

MusicCard 是一款基于 Next.js 开发的在线工具，可帮助用户为喜爱的网易云音乐制作精美的可视化海报。

1.2 MusicCard特点

• 🎨 提供多种不同风格的海报主题与布局供选择。
• 🎵 能够解析网易云音乐的链接，便捷获取音乐相关信息。
• 📱 采用响应式设计，在移动端也能良好使用。
• 🌈 允许用户对海报的样式和颜色进行个性化自定义。
• 📝 支持在海报中展示音乐的歌词内容。
• 💾 具备导出高清图片的功能，方便保存和分享。

二、本次实践规划

2.1 本地环境规划

本次实践为个人测试环境，操作系统版本为 Ubuntu 24.04.2 LTS。

2.2 本次实践介绍

1.本次实践部署环境为个人测试环境，生产环境请谨慎；
2.在Docker环境下部署MusicCard音乐海报生成器。

三、本地环境检查

3.1 检查Docker服务状态

检查Docker服务是否正常运行，确保Docker正常运行。

root@jeven:~# systemctl status docker
● docker.service - Docker Application Container Engine
     Loaded: loaded (/usr/lib/systemd/system/docker.service; enabled; preset: enabled)
     Active: active (running) since Mon 2025-08-04 10:10:52 UTC; 30min ago
TriggeredBy: ● docker.socket
       Docs: https://docs.docker.com
   Main PID: 860 (dockerd)
      Tasks: 10
     Memory: 97.2M (peak: 98.4M)
        CPU: 606ms
     CGroup: /system.slice/docker.service

3.2 检查Docker版本

检查Docker版本

root@jeven:~# docker -v
Docker version 28.3.3, build 980b856

3.3 检查docker compose 版本

检查Docker compose版本，确保2.0以上版本。

root@jeven:~# docker -v
Docker version 28.3.3, build 980b856

四、拉取MusicCard镜像

执行以下命令，拉取MusicCard容器镜像，

docker pull registry.cn-hangzhou.aliyuncs.com/jeson/musiccard

五、部署MusicCard服务

5.1 创建部署目录

• 创建部署目录

mkdir -p /data/musiccard   &&  cd /data/musiccard

5.2 编辑部署文件

使用docker-cli方式部署，命令参考如下：

docker run -d \
   --restart always \
   --name musiccard \
   -p 9500:3000 \
   registry.cn-hangzhou.aliyuncs.com/jeson/musiccard

在部署目录下，创建docker-compose.yaml文件，内容如下所示：

vim docker-compose.yaml

version: '3.9'
services:
    jeson:
        image: registry.cn-hangzhou.aliyuncs.com/jeson/musiccard
        ports:
            - '9500:3000'
        container_name: musiccard
        restart: always

5.3 创建MusicCard容器

执行以下命令，创建MusicCard容器。

docker compose up -d

5.4 查看MusicCard容器状态

检查MusicCard容器运行状态，确保MusicCard容器正常启动。

root@jeven:/data/musiccard# docker compose ps
WARN[0000] /data/musiccard/docker-compose.yaml: the attribute `version` is obsolete, it will be ignored, please remove it to avoid potentialconfusion
NAME        IMAGE                                               COMMAND                  SERVICE   CREATED         STATUS         PORTS
musiccard   registry.cn-hangzhou.aliyuncs.com/jeson/musiccard   "docker-entrypoint.s…"   jeson     8 minutes ago   Up 8 minutes   0.0.0.0:9500->3000/tcp, [::]:9500->3000/tcp

5.5 查看MusicCard容器日志

检查MusicCard容器运行日志，确保MusicCard服务正常运行。

docker compose logs

六、访问MusicCard服务

6.1 访问MusicCard初始页

浏览器地址： http://<个人的服务器IP>:9500，访问MusicCard的初始页。如果无法访问，请确保宿主机的防火墙已关闭或已放行相关端口，对于云服务器还需配置相应的安全组规则。

6.2 生成音乐卡片

登录网易云音乐后，选择好歌曲获得音乐链接。在MusicCard上填写歌曲链接和选择模版后，点击“开始创建”，即可生成对应的音乐卡片。

七、总结

通过本次Docker项目实战，我们成功在本地环境中部署了MusicCard音乐海报生成器，整个过程涵盖了环境准备、镜像拉取、容器化部署及服务验证。MusicCard凭借其简洁的界面和高效的海报生成功能，为分享音乐品味提供了极具创意的方式。借助Docker的容器化技术，应用的部署更加便捷、环境隔离性更强，便于后续维护与扩展。此次实践不仅加深了对Docker编排流程的理解，也为部署类似Web应用提供了可复用的经验。