CloudFlare is a popular free content delivery network (CDN) designed to take the strain off your web servers by serving visitors your content on your behalf. By doing this, they can provide acceleration services which delivery content faster than a single web server can by itself.
Unfortunately CloudFlare’s optimisations can – and frequently do – break web apps which depend heavily on JavaScript. This is because, in an effort to load JavaScript faster, CloudFlare munges the scripts and loads them in an unusual way. Radioplayer’s web console is susceptible to this, so there are some steps you need to take, to ensure your console works properly.
Tune your performance settings
Login to your CloudFlare account and locate the domain which hosts your Radioplayer console. Click the cog and edit the ‘CloudFlare settings’. On the next page, click the tab to edit the ‘Performance Settings’.
Turn off RocketLoader – this is the root of most problems and provides little or no benefit. It’s fine to keep AutoMinify enabled although be aware that Radioplayer code is already minified so you may wish to switch this off. The caching level and Minimum TTL settings do not affect the Radioplayer console so you can set these as you need.
Remove unnecessary apps
Return to the list of domains (click Websites at the top) and this time, locate the domain you’ve got the Radioplayer hosted on and click the Apps link. CloudFlare provides a raft of extras but many can break your site. If you can bear it, switch them ALL off. Most of them are gimmicks. If you can’t then ensure that, as a minimum, the following are off: A Better Browser, Clicky, ExceptionHub, Infolinks, ScrapeShield (email obfuscation and Pinterest protection are fine to stay on), SmartErrors and Trumpet.
How to tell if there’s a problem
Cookie alert in browserSome CloudFlare issues are easy to spot – the console stops working altogether. Content (plugin) spaces don’t load, menus don’t open, audio may or may not play. Other times, you might see notifications that the console is ‘not giving the full Radioplayer experience’ with some links to edit cookie settings. If you know your browser allows cookies then this means CloudFlare is disrupting the correct functioning of the console.
If none of the above work
You’ve got two options.
If you host the Radioplayer console on its own subdomain (ie. radioplayer.mystation.com), you can simply switch off CloudFlare for that subdomain and Cloudflare will be bypassed. You do this on your DNS Settings page. Click the cloud icon to turn it grey.
If you host the console on your main website, perhaps in a directory called radioplayer eg. mystation.com/radioplayer then you can use CloudFlare’s ‘Page Rules’ feature. In this example, you would set up a rule to match the pattern /radioplayer/* – then you’d scroll down and turn Apps to ‘Off’, turn Performance to ‘Off’ and crucially turn Rocket Loader to ‘Off’
What about other CDNs?
Most CDNs such as Akamai, Limelight Networks and CloudFront do nothing more than accelerate content by caching it from your web server and delivering it from their network of edge servers. It’s merely distributed web serving – so that means that beyond caching your pages, they don’t modify or interfere with the content and with the HTML actually being served. This means you should be able to put your site behind one of these CDNs and the whole of your site including Radioplayer, works as normal (only faster). If you find your CDN does interfere, you should contact their support team to find a way of disabling the optimisations which cause problems.