added artwork image caching and fixed some bugs

content.js

@@ -19,6 +19,12 @@ async function imageUrlToBase64(url) {
 	}
 }
 
+// Cache for artwork base64 by URL
+const artworkBase64Cache = {
+	lastArtworkUrl: null,
+	lastArtworkBase64: null
+};
+
 async function getNowPlayingData() {
 	const audio = document.querySelector('audio#apple-music-player');
 
@@ -52,7 +58,17 @@ async function getNowPlayingData() {
 	const artworkSrc = metadata.artwork?.[0]?.src || null;
 
 	const largeImageKey = artworkSrc?.replace(/\d+x\d+[a-z]*/i, '150x150bb'); // More robust for Apple Music artwork URLs
-	const artworkBase64 = artworkSrc ? await imageUrlToBase64(largeImageKey) : null;
+
+	let artworkBase64 = null;
+	if (artworkSrc) {
+		if (artworkBase64Cache.lastArtworkUrl === largeImageKey && artworkBase64Cache.lastArtworkBase64) {
+			artworkBase64 = artworkBase64Cache.lastArtworkBase64;
+		} else {
+			artworkBase64 = await imageUrlToBase64(largeImageKey);
+			artworkBase64Cache.lastArtworkUrl = largeImageKey;
+			artworkBase64Cache.lastArtworkBase64 = artworkBase64;
+		}
+	}
 
 	const currentTime = timestampInput ? Number(timestampInput.getAttribute('aria-valuenow')) : media.currentTime;
 	const duration = timestampInput ? Number(timestampInput.getAttribute('aria-valuemax')) : media.duration;
@@ -152,22 +168,26 @@ if (!window._nowPlayingExtensionLogged) {
 	window._nowPlayingExtensionLogged = true;
 }
 
-chrome.storage.sync.get(['endpoint', 'token'], (result) => {
-	if (chrome.runtime.lastError) {
-		console.error("Failed to load settings:", chrome.runtime.lastError.message);
-		return;
-	}
+if (typeof chrome !== "undefined" && chrome.storage && chrome.storage.sync) {
+	chrome.storage.sync.get(['endpoint', 'token'], (result) => {
+		if (chrome.runtime.lastError) {
+			console.error("Failed to load settings:", chrome.runtime.lastError.message);
+			return;
+		}
 
-	endpoint = result.endpoint;
-	token = result.token;
+		endpoint = result.endpoint;
+		token = result.token;
 
-	if (!endpoint || !token) {
-		console.warn("No endpoint/token configured.");
-		return;
-	}
+		if (!endpoint || !token) {
+			console.error("No endpoint/token configured.");
+			return;
+		}
 
-	startNowPlayingLoop();
-});
+		startNowPlayingLoop();
+	});
+} else {
+	console.warn("Chrome extension APIs are not available. Please run this script as a Chrome extension.");
+}
 let lastUrl = location.href;
 
 new MutationObserver(() => {

manifest.json

@@ -1,8 +1,8 @@
 {
   "manifest_version": 3,
   "name": "Apple Music Now Playing",
-  "version": "1.3.0",
-  "description": "Send Apple Music now playing info to a custom endpoint.",
+  "version": "1.3.1",
+  "description": "Easily display your currently playing Apple Music track on your website with this extension.",
   "permissions": [
     "storage",
     "scripting",
@@ -10,22 +10,33 @@
   ],
   "host_permissions": [
     "https://music.apple.com/*",
-    "https://beta.music.apple.com/",
-    "https://classical.music.apple.com/*",
-    "<all_urls>"
+    "https://beta.music.apple.com/*",
+    "https://classical.music.apple.com/*"
   ],
   "options_page": "options.html",
   "content_scripts": [
     {
-      "matches": ["https://music.apple.com/*"],
+      "matches": [
+        "https://music.apple.com/*",
+        "https://beta.music.apple.com/*",
+        "https://classical.music.apple.com/*"
+      ],
       "js": ["content.js"]
     }
   ],
-          "icons": {
-          "16": "icons/icon16.png",
-          "32": "icons/icon32.png",
-          "48": "icons/icon48.png",
-          "128": "icons/icon128.png"
-        }
-        
+  "icons": {
+    "16": "icons/icon16.png",
+    "32": "icons/icon32.png",
+    "48": "icons/icon48.png",
+    "128": "icons/icon128.png"
+  },
+  "action": {
+    "default_icon": {
+      "16": "icons/icon16.png",
+      "32": "icons/icon32.png",
+      "48": "icons/icon48.png",
+      "128": "icons/icon128.png"
+    },
+    "default_title": "Apple Music Now Playing"
+  }
 }

options.js

@@ -1,3 +1,4 @@
+/* global chrome */
 document.addEventListener('DOMContentLoaded', () => {
   chrome.storage.sync.get(['endpoint', 'token'], (data) => {
     document.getElementById('endpoint').value = data.endpoint || '';