spotify-github-profile

在你的GitHub个人资料上创建Spotify正在播放卡片

运行在Vercel无服务器函数上，数据存储在Firebase中（仅存储access_token、refresh_token和token_expired_timestamp）

公告

2024-06-21

Vercel更改了免费套餐，不足以满足我们的使用需求。我已将服务迁移到Digital Ocean自主托管。

请将旧端点 https://spotify-github-profile.vercel.app 替换为 https://spotify-github-profile.kittinanx.com

目录

连接并授权 示例 本地开发运行 设置Vercel 设置Firebase 设置Spotify开发者账号 本地运行 如何贡献 已知问题 进行中的功能 致谢

连接并授权

• 点击下方的"连接Spotify"按钮来授予权限

<img src="https://yellow-cdn.veclightyear.com/0a4dffa0/303d7b61-f7b8-4063-b212-0b925aa43157.png">

示例

• 默认主题

• 紧凑主题

• Natemoo-re主题

• Novatorem主题

• 卡拉OK主题

本地开发运行

要在本地进行开发，你需要：

• 将本项目fork作为你的仓库
• 一个与fork仓库连接的Vercel项目
• 一个设置了Cloud Firestore的Firebase项目
• 一个Spotify开发者账号

设置Vercel

• 通过导入 GitHub上fork的项目来创建一个新的Vercel项目

设置Firebase

• 创建一个新的Firebase项目
• 在项目中创建一个新的Cloud Firestore
• 从"项目设置">"服务账号">"生成新的私钥"下载配置JSON文件
• 将私钥内容转换为BASE64
  • 你可以使用VSCode中的Encode/Decode扩展来完成此操作
  • 这个密钥将在下面解释的步骤中使用

设置Spotify开发者账号

• 登录developer.spotify.com
• 创建一个新项目
• 编辑设置以添加"重定向URI"
  • 添加 http://localhost:3000/api/callback

本地运行

• 使用 npm i -g vercel 安装Vercel命令行
• 在项目根目录创建 .env 文件，并将你的密钥粘贴到 SPOTIFY_CLIENT_ID、SPOTIFY_SECRET_ID 和 FIREBASE 中

BASE_URL='http://localhost:3000/api'
SPOTIFY_CLIENT_ID='____'
SPOTIFY_SECRET_ID='____'
FIREBASE='__BASE64_FIREBASE_JSON_FILE__'

• 运行 vercel dev

$ vercel dev
Vercel CLI 20.1.2 dev (beta) — https://vercel.com/feedback
> Ready! Available at http://localhost:3000

• 现在尝试访问 http://localhost:3000/api/login

如何贡献

• 在本地开发并提交拉取请求！
• 将新发现的bug提交到Issues页面
• 将功能建议提交到Issues页面，并添加[Feature Suggestion]标签

已知问题

播放本地文件时出现404/500错误

进行中的功能

跨平台支持（Pandora、Apple Music等）

致谢

灵感来自 https://github.com/natemoo-re