MusicKit JS not playing

Question

Hello,

i recently stumbled over a Project called FaultVinyl. It is basically a NFC Reader hooked to a Mac and NFC Tags that stick on the backside of printed Albumcovers. When you place a Tag on the reader, the Computer plays the assigned Playlist of Album. I am very interested to build this for my own Setup but i am a bloody beginner in programming.

So i thought why not starting with learning Javascript and chose MusicKit JS as my first Playground.

After digging through some basic courses and the Musickit Docs and after i found a good Example (https://codepen.io/leemartin/full/bKEeZL/)i buit a HTML File with a Musicplayer integrated.

When i launch it without being Singed in to Apple Music, i get the 30 second previews of the desired Media played in Chrome.
When i log in, the media is queued but will not play.

After i found the console.log(MusicKit.errors); Function, the console show this Error:

"MEDIA_KEY: NotSupportedError: Failed to execute 'createMediaKeys' on 'MediaKeySystemAccess': EME use is not allowed on unique origins. at EncryptedSession.KeySession.dispatchKeyError (https://js-cdn.music.apple.com/musickit/v1/musickit.js:13:82640) at https://js-cdn.music.apple.com/musickit/v1/musickit.js:13:84289"

I am authorized (MusicKitinstance.isAuthorized = true), have a musicUserToken, the Player has a Queue (MusicKitinstance.player.queue.items = Array(17)) and so on. As far as i can tell, everything looks good in my approach.

Any help is appreciated.

Best wishes

Christian

My code is pretty easy (of course my developerToken is correct in my Version):

<htmllang= "en">

<head>

<title>FauxVinyl JS </title>

<metacharset= "UTF-8">

</head>

<body>

<scriptsrc= "https://js-cdn.music.apple.com/musickit/v1/musickit.js"></script>

document. addEventListener( 'musickitloaded', function() {

// MusicKit global is now defined

MusicKit. configure({

developerToken:'myTokenGoesHere',

app: {

name:'FauxVinyl',

build:'1978.4.1'

}

});

varmusic = MusicKit. getInstance();

music. setQueue({

album:'1199983730'

});

music. play();

console. log( music);

console. log( MusicKit. errors);

});

</script>

<audioid= "apple-music-player"crossorigin= "true"preload= "metadata"></audio>

<h1data-apple-music-now-playing></h1>

<buttondata-apple-music-skip-to-previous-item>back </button>

<buttondata-apple-music-pause>pause </button>

<buttondata-apple-music-play>play </button>

<buttondata-apple-music-skip-to-next-item>forward </button>

<buttonid= "apple-music-authorize"></button>

<buttonid= "apple-music-unauthorize"></button>

<audioid= "apple-music-player"crossorigin= "true"preload= "metadata"></audio>

<imgdata-apple-music-now-playing= "artworkURL"width= "200"height= "200">

</body>

</html>

MusicKit

1.9k

Posted by

ChristianFromDortmund

Reply

Add a Comment

Answer 1

Christian -

Most of the methods you are going to interact with are going to be returning promises - setQueue is one of them.

In order to call play() after setQueue(), you need to do the following:

music.setQueue({
     album: '1199983730'
}).then(function() {
     music.play();
})

Hope this helps!

Posted by

jaehess

Add a Comment

MusicKit JS not playing

Replies