I'm displaying Apple Music widgets in a React app with the following code block:
<iframe
allow="autoplay *; encrypted-media *;"
frameBorder="0"
height="150"
src="https://embed.music.apple.com/us/album/fatty-boom-boom/1240204028?i=1240204290&app=music"
sandbox="allow-forms allow-popups allow-same-origin allow-scripts allow-top-navigation-by-user-activation"
style={{
width: "100%",
overflow: "hidden",
backgroundColor: "transparent"
}}
title={item.id}
width="100%"
>
This is basically the embedCode received when using:
const embedCode = await window.MusicKit.generateEmbedCode()
And it's virtually the same as what you get from here: https://tools.applemusic.com/
The code block above has been edited a bit to get the params working with React.
The widget displays, and it's lovely; however for every widget displayed, there is an warning logged to the browser console:
Metrics config: No config provided via delegate or fetched via init(), using default/cached config values.
I'm wondering: How can I address these warnings, knowing that I'm working in a React app?
Thanks in advance for any pointers.