javascripthtmlproxycloudflaresocial-media-like

LINE's "add friend" bottons on webpage disappear if the webpage is delivered via Cloudflare proxy


Our website has been serverd via Cloudflare proxy for a long time and everything goes well. Recently we wanted to place social media buttons on the webpages, we have buttons for LINE and for Facebook. Buttons of both social media work normally when tested in localhost. However, when the page is updated to the production environment, we find that LINE's buttons do no show and only Facebook's is viewable. Later we found that by turnning off Cloudflare's proxy LINE's buttons appear! This issue is illustrated in the figure. It is also confirmed that if we put the page in another server where pages do NOT go through Cloudflare proxy, LINE's buttons can be seen normally. The buttons are embedded to the webpage using simple html and javascript.

enter image description here

We do not want to turn off Cloudflare proxy for good just in order to show the the social media buttons, but we have no idea about how to prevent LINE's buttons from invisible. Could you please help pointing out what is the key we missed? Thank you very much!


Solution

  • It would be worth checking if you have specific Cloudflare features enabled which may affect the execution of 3rd party Javascript code:

    1. Check "JS" Auto Minification in the Speed options (documentation)
    2. Check Rocket Loader and if enabled, try disabling it (documentation)

    Typically (1) is very unlikely to cause any issues. You should also check and share if there are any errors in the browser developer console, or with loading resources in the two scenarios - this would help finding a root cause.