Client access restricted with auth module

[ungive]

I executed the following commands:

$ git clone https://github.com/tidal-music/tidal-sdk-web tidal-sdk-web-auth-1.3.0
$ cd tidal-sdk-web-auth-1.3.0
$ git checkout auth-1.3.0
$ pnpm --version
9.0.6
$ pnpm install
 WARN  This project is configured to use v8.15.7 of pnpm. Your current pnpm is v9.0.6
...
$ cd packages/auth
$ pnpm install
$ pnpm dev
➜  Local:   http://localhost:5173/
...

In another terminal:

$ ngrok http 5173
... https://abcd-2001-4dd4-c729-0-e9f1-7ad8-d289-xyz1.ngrok-free.app/ ...

I configured a new app in the developer portal, with the following extra settings:

• App Links
  • Application Homepage: https://abcd-2001-4dd4-c729-0-e9f1-7ad8-d289-xyz1.ngrok-free.app
  • Privacy Policy: https://abcd-2001-4dd4-c729-0-e9f1-7ad8-d289-xyz1.ngrok-free.app
• Redirect URLs
  • Redirect URL 1: https://abcd-2001-4dd4-c729-0-e9f1-7ad8-d289-xyz1.ngrok-free.app/examples/login-redirect.html
• Scopes (all enabled)
  • collection.read
  • collection.write
  • playlists.read
  • playlists.write

I opened https://abcd-2001-4dd4-c729-0-e9f1-7ad8-d289-xyz1.ngrok-free.app/ in a browser. Then I navigated to /examples/login-redirect.html. I entered my client ID and the redirect URL that I configured in my app. I was redirected to the login page. I accepted and was redirected to the configured redirect url. Two buttons were shown: "Get user" and "Force Refresh (sub status)". The dev tools contained the following error information:

GET https://login.tidal.com/oauth2/me
Status: 400
Body:
{
    "status": 400,
    "error": "unauthorized_client",
    "sub_status": 1002,
    "error_description": "Client access restricted.",
    "errorCodeWrapper": {
        "errorCode": "UNAUTHORIZED_CLIENT"
    }
}

Clicking on any of the buttons caused the same error.

The example page says the following:

You need a properly configured clientId, which is tied to a secure redirect uri.

The latter condition is met. What constitutes as a "properly configured clientId"? It seems mine is not properly configured. Is this still a private API?

I've tried the same thing on the main branch, but to no avail, I get the same error message.

The client-credentials.html example works just fine.

[MathiasTim]

Hello @jonasberge!
Thanks for the report, I took a look and found out the example was using an internal api to test the token.
The token itself was working fine, but calling login.tidal.com/oauth2/me caused the error you described.

Please check out the PR #122 I made which showcases how you can use the example with the authorization code flow method.

I also would like to mention that we are working hard on exposing new endpoints that will give access to user data - like playlists and my collection.

[ungive]

Thanks, it works now!

I proceeded to try and use the credentials with the player module in your branch. What I did is log the jsonResponse here to the console, save it, then encode it as described in the README of the player module here:

You need a .env file containing TEST_USER="base64string" before running. base64string is base 64 encoded stringified JS object containing oAuthAccessToken, oAuthRefreshToken, oAuthExpirationDate and clientId.

I proceed to run the cypress tests for the player module:

cd packages/player
echo 'TEST_USER="VHJ5bmEgc3RlZWwgbXkgY3JlZGVudGlhbHMsIGh1aD8=..."' > .env
pnpm install
pnpm build # build dist
pnpm dev # run the web server in terminal 1
pnpm cypress:open # open cypress tests in terminal 2

I executed both test cases, both yielded error A00001 and the following response:

{
    "status": 400,
    "error": "invalid_scope",
    "sub_status": 1002,
    "error_description": "One or more of the requested scopes are not allowed. Requested scopes: [WRITE_USR, READ_USR_DATA], allowed scopes: []"
}

As mentioned in the original post, I did allow some scopes, so allowed scopes being empty is a little surprising, but maybe that's expected, since the player module is not publicly available yet?

My question: Can I play media in my browser with the tidal-sdk-web in its current state (not just 30 second snippets, but entire tracks, like it appears to be possible with these Cypress tests)? Am I doing something wrong when trying to get it to work?

Thank you so far for your work!

[MathiasTim]

About the allowed scopes: as you listed above you have access to some scopes in the developer portal, but not all of them.
I think what you have tried with the player tests looks correct, but you are missing the required permissions.

To your question: For now only previews are supported not entire tracks. But we are aware that full-length playback is a requested feature and it is something we are actively looking into.

[ungive]

Alright, thank you! If there's anything I can help with, I'd be happy to assist.