I've been able to successfully use the public Soundcloud API, but I'm struggling with implementing the callback.html in order to display the login dialog.
For my App on Soundcloud, the callback redirect uri is set to: http://localhost:8080/#/callback
On this route, my angular app defines a Controller with the desired callback template:
<!DOCTYPE html>
<html lang="en">
<head><meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>Connect with SoundCloud</title>
</head>
<body onload="window.opener.setTimeout(window.opener.SC.connectCallback, 1)">
<b style="width: 100%; text-align: center;">This popup should automatically close in a few seconds</b>
</body>
</html>
In my root controller, I have already initialized the API:
SC.initialize({
client_id: "####",
redirect_uri: "http://localhost:8080/#/callback",
});
This setup allows me to successfully make requests to the public API in other controllers like so:
SC.get('/resolve', {
url: 'https://soundcloud.com/someuser'
}, function(user) {
console.log(user);
});
However, when trying to retrieve data about the authenticated user using the same Controller, I receive a 401 error:
SC.get('/me', function(me) {
console.log(me);
});
It's clear that there is no login dialog popping up. So, what am I missing in setting up the callback.html?
Some assumptions I have made are:
Could it be due to the presence of /#/ in the URL? I tried using
<base href="/">and
but saw no change.$locationProvider.html5Mode(true);Maybe the callback.html should not be served within the SPA environment, but as an independent static page?
Is there a mapping issue with the callback.html?
I'm using webpack as a build tool. Could there be an issue related to that?
Do I need to configure something else besides the redirect uri in my Soundcloud App settings?
I really hope someone can assist me with this issue!