[SOLVED] Sending developer token to backend, how can I hide sensitive data?

Sending developer token to backend, how can I hide sensitive data?

I'm working with Apple Music MusicKit js API.

MusicKit is a front end js library that requires using the developer token in the front end to configure the MusicKit instance and get a user token.

I am attempting to create a web app utilizing MusicKit and I want to hide the developer token from users as it is sensitive data. I've noticed sending the token to the backend or bringing it into the front end from the backend causes it to show up in the network tab.

How can I set up my app in a way that I can utilize the developer token to get a user token but keep it hidden from users?

Solution

From the documentation, Apple clearly expects that you'll include the developer token in your HTML or client-side JavaScript, so it's not confidential information. There's no need to hide it. (And you can't hide information you send the user's browser from the user.)

On the page on creating a developer token, note the part about the origin:

Optional, but recommended for web clients, use the origin claim (origin). Only use this JWT if the origin header of the request matches one of the values in the array. This addition helps prevent unauthorized use of the tokens. For example: "origin":["https://example.com","https://music.example.com"].

(my emphasis)

So when creating your token, include your app's origin(s) (protocol, hostname, and port if it's not 80, e.g. https://example.com) so Apple can reject requests from code running on other origins that tries to use your developer token.