add some apple music auth stuff

backend/app.js

@@ -5,7 +5,6 @@ const expressSession = require( 'express-session' );
 const fs = require( 'fs' );
 const bodyParser = require( 'body-parser' );
 const favicon = require( 'serve-favicon' );
-const static = require( 'express-static' );
 
 const authKey = '' + fs.readFileSync( path.join( __dirname + '/authorizationKey.txt' ) );
 

frontend/package-lock.json

@@ -18,6 +18,7 @@
         "express-session": "^1.17.3",
         "ip": "^1.1.8",
         "jquery": "^3.7.1",
+        "jsonwebtoken": "^9.0.2",
         "music-metadata": "^7.13.0",
         "node-fetch": "^2.7.0",
         "node-musickit-api": "^2.1.1",
@@ -8745,9 +8746,9 @@
       }
     },
     "node_modules/jsonwebtoken": {
-      "version": "8.5.1",
+      "version": "9.0.2",
-      "resolved": "https://registry.npmjs.org/jsonwebtoken/-/jsonwebtoken-8.5.1.tgz",
+      "resolved": "https://registry.npmjs.org/jsonwebtoken/-/jsonwebtoken-9.0.2.tgz",
-      "integrity": "sha512-XjwVfRS6jTMsqYs0EsuJ4LGxXV14zQybNd4L2r0UvbVnSF9Af8x7p5MzbJ90Ioz/9TI41/hTCvznF/loiSzn8w==",
+      "integrity": "sha512-PRp66vJ865SSqOlgqS8hujT5U4AOgMfhrwYIuIhfKaoSCZcirrmASQr8CX7cUg+RMih+hgznrjp99o+W4pJLHQ==",
       "dependencies": {
         "jws": "^3.2.2",
         "lodash.includes": "^4.3.0",
@@ -8758,21 +8759,43 @@
         "lodash.isstring": "^4.0.1",
         "lodash.once": "^4.0.0",
         "ms": "^2.1.1",
-        "semver": "^5.6.0"
+        "semver": "^7.5.4"
       },
       "engines": {
-        "node": ">=4",
+        "node": ">=12",
-        "npm": ">=1.4.28"
+        "npm": ">=6"
+      }
+    },
+    "node_modules/jsonwebtoken/node_modules/lru-cache": {
+      "version": "6.0.0",
+      "resolved": "https://registry.npmjs.org/lru-cache/-/lru-cache-6.0.0.tgz",
+      "integrity": "sha512-Jo6dJ04CmSjuznwJSS3pUeWmd/H0ffTlkXXgwZi+eq1UCmqQwCh+eLsYOYCwY991i2Fah4h1BEMCx4qThGbsiA==",
+      "dependencies": {
+        "yallist": "^4.0.0"
+      },
+      "engines": {
+        "node": ">=10"
       }
     },
     "node_modules/jsonwebtoken/node_modules/semver": {
-      "version": "5.7.2",
+      "version": "7.5.4",
-      "resolved": "https://registry.npmjs.org/semver/-/semver-5.7.2.tgz",
+      "resolved": "https://registry.npmjs.org/semver/-/semver-7.5.4.tgz",
-      "integrity": "sha512-cBznnQ9KjJqU67B52RMC65CMarK2600WFnbkcaiwWq3xy/5haFJlshgnpjovMVJ+Hff49d8GEn0b87C5pDQ10g==",
+      "integrity": "sha512-1bCSESV6Pv+i21Hvpxp3Dx+pSD8lIPt8uVjRrxAUt/nbswYc+tK6Y2btiULjd4+fnq15PX+nqQDC7Oft7WkwcA==",
+      "dependencies": {
+        "lru-cache": "^6.0.0"
+      },
       "bin": {
-        "semver": "bin/semver"
+        "semver": "bin/semver.js"
+      },
+      "engines": {
+        "node": ">=10"
       }
     },
+    "node_modules/jsonwebtoken/node_modules/yallist": {
+      "version": "4.0.0",
+      "resolved": "https://registry.npmjs.org/yallist/-/yallist-4.0.0.tgz",
+      "integrity": "sha512-3wdGidZyq5PB084XLES5TpOSRA3wjXAlIWMhum2kRcv/41Sn2emQ0dycQW4uZXLejwKvg6EsvbdlVL+FYEct7A=="
+    },
     "node_modules/jsprim": {
       "version": "1.4.2",
       "resolved": "https://registry.npmmirror.com/jsprim/-/jsprim-1.4.2.tgz",
@@ -9828,6 +9851,35 @@
         "follow-redirects": "^1.14.0"
       }
     },
+    "node_modules/node-musickit-api/node_modules/jsonwebtoken": {
+      "version": "8.5.1",
+      "resolved": "https://registry.npmjs.org/jsonwebtoken/-/jsonwebtoken-8.5.1.tgz",
+      "integrity": "sha512-XjwVfRS6jTMsqYs0EsuJ4LGxXV14zQybNd4L2r0UvbVnSF9Af8x7p5MzbJ90Ioz/9TI41/hTCvznF/loiSzn8w==",
+      "dependencies": {
+        "jws": "^3.2.2",
+        "lodash.includes": "^4.3.0",
+        "lodash.isboolean": "^3.0.3",
+        "lodash.isinteger": "^4.0.4",
+        "lodash.isnumber": "^3.0.3",
+        "lodash.isplainobject": "^4.0.6",
+        "lodash.isstring": "^4.0.1",
+        "lodash.once": "^4.0.0",
+        "ms": "^2.1.1",
+        "semver": "^5.6.0"
+      },
+      "engines": {
+        "node": ">=4",
+        "npm": ">=1.4.28"
+      }
+    },
+    "node_modules/node-musickit-api/node_modules/semver": {
+      "version": "5.7.2",
+      "resolved": "https://registry.npmjs.org/semver/-/semver-5.7.2.tgz",
+      "integrity": "sha512-cBznnQ9KjJqU67B52RMC65CMarK2600WFnbkcaiwWq3xy/5haFJlshgnpjovMVJ+Hff49d8GEn0b87C5pDQ10g==",
+      "bin": {
+        "semver": "bin/semver"
+      }
+    },
     "node_modules/node-releases": {
       "version": "2.0.10",
       "resolved": "https://registry.npmmirror.com/node-releases/-/node-releases-2.0.10.tgz",
@@ -21623,9 +21675,9 @@
       }
     },
     "jsonwebtoken": {
-      "version": "8.5.1",
+      "version": "9.0.2",
-      "resolved": "https://registry.npmjs.org/jsonwebtoken/-/jsonwebtoken-8.5.1.tgz",
+      "resolved": "https://registry.npmjs.org/jsonwebtoken/-/jsonwebtoken-9.0.2.tgz",
-      "integrity": "sha512-XjwVfRS6jTMsqYs0EsuJ4LGxXV14zQybNd4L2r0UvbVnSF9Af8x7p5MzbJ90Ioz/9TI41/hTCvznF/loiSzn8w==",
+      "integrity": "sha512-PRp66vJ865SSqOlgqS8hujT5U4AOgMfhrwYIuIhfKaoSCZcirrmASQr8CX7cUg+RMih+hgznrjp99o+W4pJLHQ==",
       "requires": {
         "jws": "^3.2.2",
         "lodash.includes": "^4.3.0",
@@ -21636,13 +21688,29 @@
         "lodash.isstring": "^4.0.1",
         "lodash.once": "^4.0.0",
         "ms": "^2.1.1",
-        "semver": "^5.6.0"
+        "semver": "^7.5.4"
       },
       "dependencies": {
+        "lru-cache": {
+          "version": "6.0.0",
+          "resolved": "https://registry.npmjs.org/lru-cache/-/lru-cache-6.0.0.tgz",
+          "integrity": "sha512-Jo6dJ04CmSjuznwJSS3pUeWmd/H0ffTlkXXgwZi+eq1UCmqQwCh+eLsYOYCwY991i2Fah4h1BEMCx4qThGbsiA==",
+          "requires": {
+            "yallist": "^4.0.0"
+          }
+        },
         "semver": {
-          "version": "5.7.2",
+          "version": "7.5.4",
-          "resolved": "https://registry.npmjs.org/semver/-/semver-5.7.2.tgz",
+          "resolved": "https://registry.npmjs.org/semver/-/semver-7.5.4.tgz",
-          "integrity": "sha512-cBznnQ9KjJqU67B52RMC65CMarK2600WFnbkcaiwWq3xy/5haFJlshgnpjovMVJ+Hff49d8GEn0b87C5pDQ10g=="
+          "integrity": "sha512-1bCSESV6Pv+i21Hvpxp3Dx+pSD8lIPt8uVjRrxAUt/nbswYc+tK6Y2btiULjd4+fnq15PX+nqQDC7Oft7WkwcA==",
+          "requires": {
+            "lru-cache": "^6.0.0"
+          }
+        },
+        "yallist": {
+          "version": "4.0.0",
+          "resolved": "https://registry.npmjs.org/yallist/-/yallist-4.0.0.tgz",
+          "integrity": "sha512-3wdGidZyq5PB084XLES5TpOSRA3wjXAlIWMhum2kRcv/41Sn2emQ0dycQW4uZXLejwKvg6EsvbdlVL+FYEct7A=="
         }
       }
     },
@@ -22516,6 +22584,28 @@
           "requires": {
             "follow-redirects": "^1.14.0"
           }
+        },
+        "jsonwebtoken": {
+          "version": "8.5.1",
+          "resolved": "https://registry.npmjs.org/jsonwebtoken/-/jsonwebtoken-8.5.1.tgz",
+          "integrity": "sha512-XjwVfRS6jTMsqYs0EsuJ4LGxXV14zQybNd4L2r0UvbVnSF9Af8x7p5MzbJ90Ioz/9TI41/hTCvznF/loiSzn8w==",
+          "requires": {
+            "jws": "^3.2.2",
+            "lodash.includes": "^4.3.0",
+            "lodash.isboolean": "^3.0.3",
+            "lodash.isinteger": "^4.0.4",
+            "lodash.isnumber": "^3.0.3",
+            "lodash.isplainobject": "^4.0.6",
+            "lodash.isstring": "^4.0.1",
+            "lodash.once": "^4.0.0",
+            "ms": "^2.1.1",
+            "semver": "^5.6.0"
+          }
+        },
+        "semver": {
+          "version": "5.7.2",
+          "resolved": "https://registry.npmjs.org/semver/-/semver-5.7.2.tgz",
+          "integrity": "sha512-cBznnQ9KjJqU67B52RMC65CMarK2600WFnbkcaiwWq3xy/5haFJlshgnpjovMVJ+Hff49d8GEn0b87C5pDQ10g=="
         }
       }
     },

frontend/package.json

@@ -34,6 +34,7 @@
     "express-session": "^1.17.3",
     "ip": "^1.1.8",
     "jquery": "^3.7.1",
+    "jsonwebtoken": "^9.0.2",
     "music-metadata": "^7.13.0",
     "node-fetch": "^2.7.0",
     "node-musickit-api": "^2.1.1",

frontend/public/index.html

@@ -7,6 +7,7 @@
     <link rel="icon" href="<%= BASE_URL %>favicon.ico">
     <link rel="stylesheet" href="/icon-font.css" />
     <script src="/jquery.min.js"></script>
+    <script src="/musickit.js"></script>
     <title><%= htmlWebpackPlugin.options.title %></title>
   </head>
   <body>

frontend/src/app.js

@@ -9,6 +9,7 @@ const session = require( 'express-session' );
 const indexer = require( './indexer.js' );
 const axios = require( 'axios' );
 const ip = require( 'ip' );
+const jwt = require( 'jsonwebtoken' );
 
 
 app.use( bodyParser.urlencoded( { extended: false } ) );
@@ -230,6 +231,24 @@ app.get( '/getSongFile', ( req, res ) => {
 } );
 
 
+app.get( '/getAppleMusicDevToken', ( req, res ) => {
+    // sign dev token
+    const privateKey = fs.readFileSync( path.join( __dirname + '/config/apple_private_key.p8' ) ).toString();
+    // TODO: Remove secret
+    const config = JSON.parse( fs.readFileSync( path.join( __dirname + '/config/apple-music-api.config.secret.json' ) ) );
+    const jwtToken = jwt.sign( {}, privateKey, {
+        algorithm: "ES256",
+        expiresIn: "180d",
+        issuer: config.teamID,
+        header: {
+            alg: "ES256",
+            kid: config.keyID
+        }
+    } );
+    res.send( jwtToken );
+} );
+
+
 app.use( ( request, response, next ) => {
     response.sendFile( path.join( __dirname + '' ) ) 
 } );

frontend/src/components/appleMusic.vue

@@ -0,0 +1,45 @@
+<template>
+    <div>
+        <h1>AppleMusic</h1>
+    </div>
+</template>
+
+<script>
+    export default {
+        data() {
+            return {
+                devTokenAvailable: false,
+                musicKit: null,
+            }
+        },
+        methods: {
+            prepare() {
+                document.addEventListener( 'musickitloaded', function() {
+                    fetch( 'http://localhost:8081/getAppleMusicDevToken' ).then( res => {
+                        if ( res.status === 200 ) {
+                            this.devTokenAvailable = true;
+                            res.text().then( token => {
+                                this.musicKit = MusicKit.configure({
+                                    developerToken: token,
+                                    app: {
+                                        name: 'MusicPlayer',
+                                        build: '2.1.0'
+                                    }
+                                } );
+                                setTimeout( () => {
+                                    this.musicKit.authorize();
+                                }, 100 );
+                            } );
+                        }
+                    } );
+                });
+            }
+        },
+        created() {
+            window.addEventListener( 'DOMContentLoaded', () => {
+                this.prepare();
+            } );
+        }
+    }
+
+</script>

frontend/src/views/HomeView.vue

@@ -1,5 +1,5 @@
 <template>
-    <div class="home">
+    <div class="home" v-if="musicOrigin === 'local'">
         <div class="top-bar">
             <img src="@/assets/logo.png" alt="logo" class="logo">
             <div class="player-wrapper">
@@ -10,6 +10,9 @@
             <mediaPool @com="( info ) => { handleCom( info ) }" ref="pool"></mediaPool>
         </div>
     </div>
+    <div v-else-if="musicOrigin === 'AppleMusic'" class="home">
+        <AppleMusic></AppleMusic>
+    </div>
 </template>
 
 <style>
@@ -54,6 +57,7 @@
 </style>
 
 <script>
+    import AppleMusic from '@/components/appleMusic.vue';
     import mediaPool from '@/components/mediaPool.vue';
     import Player from '@/components/player.vue';
 
@@ -62,11 +66,14 @@
         components: {
             mediaPool,
             Player,
+            AppleMusic,
         },
         data() {
             return {
                 hasLoadedSongs: false,
                 songQueue: [],
+                // musicOrigin: 'local',
+                musicOrigin: 'AppleMusic',
             }
         },
         methods: {