Sorry, but you either have no stories or none are selected somehow.
If the problem persists, check the browser console, or the terminal you've run Storybook from.
Some basic setup is required before you begin to use MusicKit on the Web.
MusicKit on the Web uses JSON Web Tokens (JWTs) to interact with the Apple Music API. You must have a signed developer token in order to initialize MusicKit on the Web.
Use the script tags and link to Apple’s hosted version of MusicKit on the Web:
In the example above, there are two optional attributes.
The data-web-components
attribute instructs MusicKit to also load the Web Components, making them available for your application to very quickly add playback controls. If you are only making requests for data, and not supporting playback, then you would not necessarily need to include the Web Components.
The async
attribute is a web standard for the <script>
tag which instructs the browser to not block rendering of the page based on the loading of the JavaScript file in the src
attribute. This is recommended, as MusicKit on the Web itself is initialized asynchronously; see the musickitloaded
event documentation below.
You can configure MusicKit on the Web with a default markup setup to quickly get you started with the library, or with JavaScript to give you more control over the customization of your player. To configure the library using only markup, use the following meta tags:
Configuring the library with JavaScript:
If using the meta tags to configure MusicKit, you would not need to make a MusicKit.configure(...)
call. However, you still need to wait for the musickitloaded
event before you can access the MusicKit global or configured instance.
musickitloaded
eventMusicKit on the web is initialized asynchronously, which means the MusicKit
global is not available immediately after the JavaScript file is evaluated. Instead a musickitloaded
event is fired on the document
when the MusicKit
global is available.
Here is an example of how to listen for the musickitloaded
event on the document: