Spotify Animated Album Artwork
Replace your Spotify album artwork with an animated version.
preview.mp4
Install
My english is broken, please bear with it...
- Install spicetify-cli
- Download the
spotify-animated-album-artwork.js
from GitHub Releases. - Use the following command to install this spicetify extension, for more info visit: spicetify docs
spicetify config extensions spotify-animated-album-artwork.js
spicetify apply
FAQ
Q: Where are those animated album artworks from?
A: Apple Music.
Q: Why did this api take so long to respond?
Deploy to server
Requirements:
- Server
- Domain
- Apple ID
- Supabase database
Download source code
git clone https://github.com/qier222/spotify-animated-album-artwork.git
Install Node.js and dependencies
Install PNPM
curl -fsSL https://get.pnpm.io/install.sh | sh -
source ~/.bashrc
Use PNPM to install Nodejs
pnpm env use --global lts
Install dependencies
pnpm install
Create config file
Copy config.example.json
file in the project root and rename it to config.json
Write your domain name in the api
field.
Get Apple Music token
- Go to Apple Music and login with your Apple ID
- Open browser developer tools (F12 or CMD+SHIFT+I), click on the Network tab, then click on the Fetch/XHR option
- Go to
https://music.apple.com/cn/search?term=taylor%20swift
- Find
authorization
in Request Headers and copy it (looks like 'Bearer xxxxxxx'), this is your token - Paste token into
config.json
Setup Supabase
- Register a new Supabase account
- Create a new project
- Go to Supabase's "SQL Editor", paste the following code into the editor and click run
CREATE TABLE "public"."spotify" (
"id" text NOT NULL,
"appleMusicID" int8 NOT NULL,
"url" text,
"downloaded" bool DEFAULT false,
"created_at" timestamptz DEFAULT now(),
PRIMARY KEY ("id")
);
- Go to Supabase's "Settings" - "API", copy your project's URL and service_role secret into the
config.json
file
Download FFmpeg
- Open FFmpeg and download the latest release version,
- Put it under the project root , use
tar
to unpack it, rename the unpacked folder toffmpeg
tar -xf ffmpeg-release-amd64-static.tar.xz
- Make sure your FFmpeg version is higher than
5.0.0
, you can check it by running./ffmpeg/ffmpeg -version
Start the server
Simply run
node server.js
If you want to make sure that the server is always running, you can run pm2 to manage it.
pm2 start server.js --name spotify-animated-artwork-server
Start you caddy server to reverse proxy and use https
Copy Caddydile.example
to Caddyfile
and replace https://your-domain.example.com
with your domain.
If you are using Cloudflare to manager your domain DNS, replace your_cloudflare_api_key
with your Cloudflare api key. Otherwise, checkout Caddy Documentation for other ways to enable HTTPS.
Note: HTTPS is needed for this api to work.
caddy start --config Caddyfile
Develop
You need to run this command every time you want to make changes effecting Spotify (probably).
npm run build && spicetify apply --enable-developer-mode
Enable developer mode to open console, deactivate every time you close Spotify.
spicetify enable-devtools --enable-developer-mode