Service request: Spotify

[Ruben Grimm]

Status
======

The fix is available as a service update package. See https://nuvolaplayer.fenryxo.cz/download/service_updates.html (Spotify, version 1.0).

Fix committed to lp:nuvola-player as r836. Will be released in Nuvola Player 2.5.0. <http://bazaar.launchpad.net/~fenryxo/nuvola-player/trunk/revision/836>

Original report
===============

Spotify just released their web client, and I would be pleased to see support for that in the nuvola player.

https://play.spotify.com

[Jiří Janoušek (fenryxo)]

Thanks for your service request.

  importance wishlist
  status triaged
  milestone future

[Jiří Janoušek (fenryxo)]

Tomahawk music player[1] supports Spotify, so I suggest you to try it out. Since Tomahawk is completely native Linux application, it should have better performance than a web player wrapped in Nuvola Player, especially if the web player uses Flash plugin.

[1] http://www.tomahawk-player.org/resolvers.html

[Hannu Leinonen (hleinone)]

I tried this out quickly, the problem is that unless you have linked your Facebook account (in that session) to the Spotify Facebook app, going to https://play.spotify.com redirects you to http://www.spotify.com/start/?ref=play.spotify.com. You can do the linking using this link: https://apps.facebook.com/get-spotify/?fb_source=notification&fb_ref=cazzette_de&ref=notif&notif_t=app_notification

So the flow for new users would be:
1. log in at www.spotify.com
2. somehow redirect the user to the linking page on apps.facebook.com (may require logging in to facebook) which redirects to an album in play.spotify.com
3. somehow redirect the user to play.spotify.com

Is there a way to capture the HTTP requests/responses and do the necessary redirections in Nuvola?

[Jiří Janoušek (fenryxo)]

> I tried this out quickly, the problem is that unless you have linked
> your Facebook account (in that session) to the Spotify Facebook app,
> going to https://play.spotify.com redirects you to
> http://www.spotify.com/start/?ref=play.spotify.com. You can do the
> linking using this link: https://apps.facebook.com/get-
> spotify/?fb_source=notification&fb_ref=cazzette_de&ref=notif&notif_t=app_notification
>
> So the flow for new users would be:
> 1. log in at www.spotify.com
> 2. somehow redirect the user to the linking page on apps.facebook.com (may require logging in to facebook) which redirects to an album in play.spotify.com
> 3. somehow redirect the user to play.spotify.com

If I've understood it correctly: If home_page field would set to
https://apps.facebook.com/get-spotify/, user would be always
redirected to a valid https://play.spotify.com session?

Is there any link to play.spotify.com on
http://www.spotify.com/start/?ref=play.spotify.com?

> Is there a way to capture the HTTP requests/responses and do the
> necessary redirections in Nuvola?

You can perform a redirect in JavaScript (integration.js):

if (window.location.href === BAD_ADDRESS)
{
location.href = "https://..."; // redirect
}
else
{
// service integration code here
}

[Hannu Leinonen (hleinone)]

After a bit more exploration I can now go to https://play.spotify.com/redirect/facebook/notification.php?album=http%3A//open.spotify.com/album/5ZAKzV4ZIa5Gt7z29OYHv0 to get to the service. Without ever really needing to request a page from either Facebook or www.spotify.com.

The:
https://apps.facebook.com/get-spotify/?fb_source=notification&fb_ref=cazzette_de&ref=notif&notif_t=app_notification
Facebook link redirects after few seconds to:
https://www.spotify.com/int/external/facebook/init/?fb_ref=cazzette_de
Which in turn opens:
https://www.spotify.com/fi/external/facebook/cazzette.php?fb_ref=cazzette_de
Which opens:
https://play.spotify.com/redirect/facebook/notification.php?album=http%3A//open.spotify.com/album/5ZAKzV4ZIa5Gt7z29OYHv0&song=http%3A//open.spotify.com/track/3tBHQJmuE0BOKR7l4Anap5
And finally:
https://play.spotify.com/album/5ZAKzV4ZIa5Gt7z29OYHv0?play=3tBHQJmuE0BOKR7l4Anap5&flow=fb

The downside is, that it seems that the link needs to link to an album, to be able to get into the service the first time. The final page is in some way broken as it doesn't go anywhere when you're not logged in but tries to load the page forever. When you are logged in it goes to the album.

One flow could be
1. try to go to play.spotify.com
2. check if we were redirected to http://www.spotify.com/fi/start/?ref=play.spotify.com (instead of "fi" there might be something else depending on the user's country)
3. redirect to https://play.spotify.com/redirect/facebook/notification.php?album=http%3A//open.spotify.com/album/5ZAKzV4ZIa5Gt7z29OYHv0
4. capture when we are on https://play.spotify.com/album/5ZAKzV4ZIa5Gt7z29OYHv0?flow=fb
5. redirect to play.spotify.com
6. log in

Not so easy after all, I really hope they loosen the strap after a while. For now, I settled for setting https://play.spotify.com/redirect/facebook/notification.php?album=http%3A//open.spotify.com/album/5ZAKzV4ZIa5Gt7z29OYHv0 as the home_page, and I'm able to log in. But, I'm not able to play music, because the service complains about missing Flash, even though I have "flash_plugin = yes" in metadata.conf and other services requiring Flash work just fine.

[Jiří Janoušek (fenryxo)]

Spotify web developers seem to love crazy redirections. I hope it will
be fixed when Spotify won't be in beta testing.

On Thu, Nov 22, 2012 at 12:59 AM, Hannu Leinonen
<email address hidden> wrote:
> After a bit more exploration I can now go to
> https://play.spotify.com/redirect/facebook/notification.php?album=http%3A//open.spotify.com/album/5ZAKzV4ZIa5Gt7z29OYHv0
> to get to the service. Without ever really needing to request a page
> from either Facebook or www.spotify.com.
>
> The:
> https://apps.facebook.com/get-spotify/?fb_source=notification&fb_ref=cazzette_de&ref=notif&notif_t=app_notification
> Facebook link redirects after few seconds to:
> https://www.spotify.com/int/external/facebook/init/?fb_ref=cazzette_de
> Which in turn opens:
> https://www.spotify.com/fi/external/facebook/cazzette.php?fb_ref=cazzette_de
> Which opens:
> https://play.spotify.com/redirect/facebook/notification.php?album=http%3A//open.spotify.com/album/5ZAKzV4ZIa5Gt7z29OYHv0&song=http%3A//open.spotify.com/track/3tBHQJmuE0BOKR7l4Anap5
> And finally:
> https://play.spotify.com/album/5ZAKzV4ZIa5Gt7z29OYHv0?play=3tBHQJmuE0BOKR7l4Anap5&flow=fb
>
> The downside is, that it seems that the link needs to link to an album,
> to be able to get into the service the first time. The final page is in
> some way broken as it doesn't go anywhere when you're not logged in but
> tries to load the page forever. When you are logged in it goes to the
> album.

Could you run `nuvolaplayer -D --debug-navigation` to get the log with
navigation debugging enabled?

> One flow could be
> 1. try to go to play.spotify.com
> 2. check if we were redirected to http://www.spotify.com/fi/start/?ref=play.spotify.com (instead of "fi" there might be something else depending on the user's country)
> 3. redirect to https://play.spotify.com/redirect/facebook/notification.php?album=http%3A//open.spotify.com/album/5ZAKzV4ZIa5Gt7z29OYHv0
> 4. capture when we are on https://play.spotify.com/album/5ZAKzV4ZIa5Gt7z29OYHv0?flow=fb
> 5. redirect to play.spotify.com
> 6. log in
>
> Not so easy after all, I really hope they loosen the strap after a
> while. For now, I settled for setting
> https://play.spotify.com/redirect/facebook/notification.php?album=http%3A//open.spotify.com/album/5ZAKzV4ZIa5Gt7z29OYHv0
> as the home_page, and I'm able to log in. But, I'm not able to play
> music, because the service complains about missing Flash, even though I
> have "flash_plugin = yes" in metadata.conf and other services requiring
> Flash work just fine.

Debug output would be appreciated. $ nuvolaplayer -D

[Hannu Leinonen (hleinone)]

Putting the redirection problems aside, the problem with Flash was solved with allowing more URL patterns in the sandbox_pattern. I'm now able to play songs from Spotify within the Nuvola Player! The biggest problem is that the player component within the page is in an iframe and I can't access its elements, thus I can't get song info or control the song played.

[Jiří Janoušek (fenryxo)]

> The biggest
> problem is that the player component within the page is in an iframe and
> I can't access its elements, thus I can't get song info or control the
> song played.

What's the reason why you cannot access the iframe? Is it a cross-domain iframe?

[Hannu Leinonen (hleinone)]

Yes, the iframe is loaded from 9bb804ebf1c28a8a4dc19097443ecae65a118998-player.spapps.co.

[Jiří Janoušek (fenryxo)]

> Yes, the iframe is loaded from
> 9bb804ebf1c28a8a4dc19097443ecae65a118998-player.spapps.co.

It is necessary to inject the integration script into the iframe via
WebKitGtk API then. Is the following workaround sufficient?

1.) Nuvola JavaScript API is connected to the main frame.
2.) Integration script is injected into the main frame.
3.) Integration script checks URL and then calls
Nuvola.switchToFrame("framename").
4.) Nuvola JS API is disconnected from the main frame, any API calls
are invalid from now.
5.) Nuvola JS API is connected to the frame "framename".
6.) Integration script is injected into the frame "framename".

[Hannu Leinonen (hleinone)]

So in the update function I could do something along these lines?

if(/https?:\/\/[a-f0-9]+-player.spapps.co/.test(document.URL)){
 // do the update
}
else{
 var player_iframe = document.getElementById('app-player');
 if (player_iframe.src){
  //Nuvola.switchToFrame('app-player');
 }
}

[Jiří Janoušek (fenryxo)]

> So in the update function I could do something along these lines?
>
> if(/https?:\/\/[a-f0-9]+-player.spapps.co/.test(document.URL)){
> // do the update
> }
> else{
> var player_iframe = document.getElementById('app-player');
> if (player_iframe.src){
> //Nuvola.switchToFrame('app-player');
> }
> }

Yes, I've created a prototype of Nuvola.switchToFrame() feature, so
you can test it. There is a simple example at
/data/nuvolaplayer/services/jsapiswitch.

bzr branch lp:~fenryxo/nuvola-player/jsapiswitch

[Hannu Leinonen (hleinone)]

Unfortunately the player frame doesn't have a name, so the jsapiswitch wont work.

[Jiří Janoušek (fenryxo)]

> Unfortunately the player frame doesn't have a name, so the jsapiswitch
> wont work.

Does it have at least id attribute then? It should work too.

Nuvola.switchToFrame("myiframeid");

You can also set name from JavaScript:

document.getElementById("myid").setAttribute("name", "myname");
Nuvola.switchToFrame("myname");

[Hannu Leinonen (hleinone)]

Yes, it has an id.

Oh yeah, didn't think of that!

[Hannu Leinonen (hleinone)]

I keep getting:

TypeError: 'undefined' is not a function (evaluating 'Nuvola.switchToFrame('app-player')')

In both the Spotify service and the example service.

[Jiří Janoušek (fenryxo)]

> I keep getting:
>
> TypeError: 'undefined' is not a function (evaluating
> 'Nuvola.switchToFrame('app-player')')
>
> In both the Spotify service and the example service.

Are you running Nuvola Player built from
lp:~fenryxo/nuvola-player/jsapiswitch? Also debugging output would
help.

$ cd jsapiswitch
$ ./waf distclean configure build
$ ./nuvolaplayer.wrapper -D --debug-javascript

[Hannu Leinonen (hleinone)]

Thanks! Now I'm able to fetch the song info (artist and song name).

[Hannu Leinonen (hleinone)]

I have now somewhat functional integration at https://code.launchpad.net/~hleinone/nuvola-player/integration-spotify

The main problem is that it keeps losing the session, so when I restart the player, I always need to log in. Smaller problem is that a service icon for Spotify is missing. And the last one is that I suck at Bazaar, I hope the branch is not a total mess. :)

[Jiří Janoušek (fenryxo)]

> I have now somewhat functional integration at
> https://code.launchpad.net/~hleinone/nuvola-player/integration-spotify

Great :-)

> The main problem is that it keeps losing the session, so when I restart
> the player, I always need to log in.

Does it also happen is common web browsers or is it specific to Nuvola Player?

> Smaller problem is that a service
> icon for Spotify is missing.

No big deal. Author of other icons, Alexander King, could take care about it.

And the last one is that I suck at Bazaar,
> I hope the branch is not a total mess. :)
>

The jsapiswitch is a prototype that needs some love, so it isn't ready
for merge into trunk yet. I currently don't have time to finish it, so
Spotify integration must wait a bit. I guess it could land in NP
2.2.0.

[Hannu Leinonen (hleinone)]

It seems to be Nuvola Player specific, at least both Chrome and Firefox were able to keep the session, as well as Google Play Music in Nuvola, so there's something fishy going on.

[Jiří Janoušek (fenryxo)]

Hi Hannu Leinonen,

A reworked Nuvola.switchToFrame() functionality has landed into the trunk branch and is also available in unstable builds in the NP Unstable builds PPA. It has been a while since the last update on this bug, but in case you are still interested in bringing Spotify support to Nuvola Player, please rework your branch on top of Nuvola Player JavaScript API 2.1. There is a documentation for the new API at http://nuvolaplayer.fenryxo.cz/releases/2.1.html

Best regards,

Jiří Janoušek

[Jiří Janoušek (fenryxo)]

Since development of Nuvola Player has been discontinued [1], I'm closing the bug tracker. It will be reopened when a new maintainer is found. I'm sorry I wasn't able to address this issue.

[1] https://launchpad.net/nuvola-player/+announcement/11960

[Justin Warkentin (cosmonrd)]

It is worth noting that Spotify now as a web player at play.spotify.com. Also, they do in fact have a functional Linux version of the desktop app: https://www.spotify.com/us/download/previews/

That said, I really like Nuvola Player since it allows me to use multiple services and setup scrobbling in one place, make my media keys work and integrates properly with the Gnome Shell Media Player extension. If I get some free time I might even try to dive in and work on Spotify support.

[Chase Colman (chase-t)]

Although I haven't worked out the sandboxing and login issues, I was able to dig up a means of controlling the player and getting information from it.
Pretty much everything needed is in:
window.Spotify.Shuttle._initContext.contextPlayer._player

Once I finish up the Grooveshark HTML5 integration, I'll take a crack at this plugin.

[Chase Colman (chase-t)]

Finally got a working version completed!