11.09.2022
Spotify web player on mobile (Guide)
The Spotify web player is a great way to listen to music when on desktop but sadly when trying to access it on mobile the user is met with an ad for the Spotify app that blocks the whole site. This wouldn’t be a problem if the mobile app wasn’t greatly inferior to the web player. In this guide I will show how to modify a mobile web browser in a way that it appears as a desktop browser and allows you to use the Spotify web player.
1. Download Firefox beta
Firefox beta (currently Version 105.0b6) seems to be the best choice to use for the Spotify web player but Firefox nightly should also be usable. My advice is keep that browser for Spotify use only as this set up will display the desktop versions of all sites and that might make them hard to navigate and use efficiently.
2. Turn off the Enhanced Tracking Protection
The Enhanced Tracking Protection is turned on by default on Firefox beta. It can be found in the settings menu and is a function of Firefox that protects you from the most common trackers online. In most cases I would advice against turning it off but in this case it is a necessary step as it prevents the browser from using the custom user agent. If you're using the browser only for Spotify it doesn’t matter whether it's on or off.
3. Change the user agent
In this way the browser will appear to be a desktop browser instead of mobile browser. This is needed because when running on mobile browser Spotify will block all functionalities with a message urging the user to download the mobile app.
3.1 Enter about:config into a tabs URL window
You might get a warning pop-up. Click the Accept the Risk and Continue
3.2 Press the +sign on the top left corner. You should get a pop up window
3.3 In the name field enter general.useragent.override.
3.4 In the type field change Boolean to String
3.5 In the Enter a string field enter the new user agent.
I personally use Mozilla/5.0 (Windows NT 6.1; Win64; x64; rv:85.0) Gecko/20100101 Firefox/85.0 Firefox/62.0 but other desktop user agents should work too.
3.6 Press Create
4. Change the phone resolution
Spotify seems to check the phone resolution so you need to configure the browser to return an accepted resolution.
4.1 In about:config search for layout.css.devPixelsPerPx
4.2 Change the value from -1 to a positive a value between 1 and 2
This will change the way sites display in the browser. If the text get too small to read you can adjust it's size from the settings.
5. In about:config search for media.eme.enabled and make sure it’s set to true
6. In about:config change media.eme.require-app-approval to false
Without this step you will get DRM warning all the time when trying to play the music.
7. Get an adblock
I personally use uBlock Origin but other adblocks should work too.
7.1 Download the uBlock Origin addon
7.2 Go into Addons > uBlock Origin > Options > My filters and add www.spotify.com/*$document,domain=www.spotify.com in the list
Now when you try to go to www.spotify.com you will get a warning saying that uBlock Origin is preventing the site from loading. You might need to access this site to sign up or log in. In this case press the button Temporarily on the uBlock Origin warning.
As of 11.09.22 this set up seems to be working just fine (I am listening to music while typing this guide). There are some minor flaws such as the fact that ads display placeholders that take several seconds to skip instead of doing it instantaneously and the UI isn’t too aesthetically pleasing but other than that it is still usable. I cannot guarantee that this guide will be relevant in the future as any change in the newer versions of the browser can break this build. If that happens I will try to update the guide if I remember to. This guide was inspired by the one I found at https://adminswerk.de/spotify-web-on-android/ and the comments under it.