facebook plugin init error: init not called with valid version

solution.md

Solution

js.src = "//connect.facebook.net/zh_TW/all.js";

instead of

js.src = "//connect.facebook.net/zh_TW/sdk.js";

Causing

PC

Mobile

Ref: FB init function gives wrong version error

NO don't do that.
I don't have a solution but this is bad - moving to an old version of the API is not a good plan and that's what all.js is.
Don't fool yourself into thinking it's a superset of sdk.js - it's just an old name that they realized was dumb and they changed it.

I had the same problem, and I think I found the root cause!

Root cause

In my case, we were injecting FB SDK dynamically to our customer's website. However, some of our customers were already added FB SDK via other plugins. Those plugins have different app id and version.

So depending on latency some plugins call init before/after ours

Solution

If you're the owner of the site where you're injecting the SDK, make sure no other plugins are injecting FB SDK and calling init different version and app id

If you don't own the site, then at least try to inject the SDK before anyone else and prefer not async

I also reported the same to FB. They told not to call init separately, pass init params directly in the rule. I've attached the code that I use:

if (!document.getElementById("fb-root")) {
      // create div required for fb
      const fbDiv = document.createElement("div");
      fbDiv.id = "fb-root";
      document.body.appendChild(fbDiv);
      // Run any script after sdk is loaded
      window.fbAsyncInit = () => {
        //
      };
      // inject sdk.js
      (function(d, script) {
        script = d.createElement("script");
        script.type = "text/javascript";
        script.async = true;
        script.src =
          "https://connect.facebook.net/en_GB/sdk.js#xfbml=1&version=v3.2&appId=" +
          process.env.REACT_APP_FB_APP_ID +
          "&autoLogAppEvents=1";
        d.getElementsByTagName("head")[0].appendChild(script);
      })(document);
    }