Two days that all.js (Facebook SDK) is randomly not loading - javascript

we are experience since yesterday the "FB is not defined" error, caused by Facebook not serving all.js, which is the core Javascript SDK file.
Looking at the NET tab in Firebug or Chrome developer tools, I can see the get on all.js failing.
After a few page refreshes, it works correctly, then 10 minutes later is again not serving the file.
Is it a Facebook issue? Apparently we have no other network error, and we are not behind a proxy. Anyone else experiencing it? Facebook status page is not reporting any problem, and I cannot find anything recent on Google.
Is it "normal"? like Facebook limiting gets based on some "cap" or anything similar?

I have run into this same issue before. It was something that I could never really pin down but it was believed to be an issue with Facebook. My solution was to grab a copy of all.js and serve it up locally.

Your description sounds like a network issue, but if you are loading the SDK asynchronously and trying the use the FB object before it has fully loaded, it will cause this error and may also stop attempting to load the all.js due to the Javascript error.
To resolve this, put all references to the FB object inside of the window.fbAsyncInit function seen on this page: https://developers.facebook.com/docs/reference/javascript/
This may not be your issue, but that is almost always the solution when I see that error.

You must add the Facebook SDK all.js on the bottom of your page.
Before the Facebook SDK, you must add <div id="fb-root"></div>
After this load, you can call the function FB.
The call of Facebook SDK must be with the document.protocol HTTPS or HTTP.
Good luck !

Related

PayPal checkout integration with JS SDK Buttons - Problem with "Invalid sdk meta"

I'm trying to integrate PayPal Buttons with PayPal SDK on my FrontEnd. The SDK is loaded from
//www.paypal.com/sdk/js?client-id=<My-SandBox-Client-Id>
The script is loading correctly and when I do render buttons into my page it looks good as well. But there are 3 problems:
Loading animation points are still hang at the bottom of the buttons:
In developer tools I can see the broken request (400) which says:
Invalid sdk meta: eyJ1cmwiOiIvL3d3dy5wYXlwYWwuY29tL3Nkay9qcz9jbGllbnQtaWQ9QWYtd0RUQlhVSjBFVE9hWWl6eXFVNDdPbVdxc0tvYmNpOVM1RzQya2FfR1RBeTZSR1pZNU1MUVBEdkw4VWJ0amx4QlJxdXMzWFBPNGUxWGEiLCJzdGFnZUhvc3QiOm51bGwsImFwaVN0YWdlSG9zdCI6bnVsbH0
Request is going to:
https://www.sandbox.paypal.com/smart/buttons?{private data}
When clicking on any button, there is only spinning animation without loading any further data. No error message is provided.
I followed these integration guide: https://developer.paypal.com/docs/checkout/integrate/#2-add-the-paypal-script-to-your-web-page
I have also found the same question without any answer on PayPal Community page:
https://www.paypal-community.com/t5/Merchant-services-Archive/Invalid-sdk-meta/m-p/1831011
I am wondering why PayPal doesn't help with integration on own community pages, and hope somebody here can help me to find out what is could be wrong.
Found the solution: make sure you are including script from https://. Otherwise by loading from http:// script becomes a redirect to https:// and this runs in the described error above. So the correct link to the script is:
https://www.paypal.com/sdk/js?client-id=<My-SandBox-Client-Id>
Hopes it may help someone facing the same problem.

403 (forbidden) on end user's console

I have an application that seems to be working across the internet. But I fielded a call from an end-user who is having difficulty using the website
I asked her to send a screenshot of the console error and recieved this:
From searching stackoverflow it looks like its a permissions issue, but the site works for everyone else. Is this on her end or mine?
UPDATE I should've mentioned that is user works from a school. Perhaps her IT admin has blocked some internet resources?
Have end-user tried different browser? i would say it's some plugin stopping to load that script. If your app is working everywhere then it can't be your app. Ask end-use to try another browser and for check if end-user has any plugin witch can also cause this.
The problem may also come from lealfet or google map.
We can se that the page is currently loaded, css ans content seems fine, only the map part seems to be broken. So i don't think there is a problem with your server/website, I would put the fault on the others.
Note : we see that leaflet only is concerned when looking carefully at the screenshot.
Edit : in some cases, you can make a local copy of these external file, check whether the user need them or not, then load them as rescue.
Update : Either the school did block leaflet, or leaflet did automatically block the school as their bandwich use can excess what they allows by user, or due to abuse of any kind.

WP Admin trying to load asyncronously scripts in a htpasswd protected envirnoment

In my dev environment, for security reasons, my wp-admin folder is protected by basic authentication with htpasswd.
When i'm logged in the admin area (after passing Basic Authentication and Wordpress Login), wordpress tries to load several scripts by ajax with its load-scripts.php service but the script returns a 403 http error (forbidden) because of the Basic Authentication wall.
I've done some researches with no luck about how to solve this issue. Does anyone have any ideas or previous experience with this?
Ok I just fixed my problem. So good to know for anyone will get the same issue.
The solution is to disable the "CONCATENATE_SCRIPT" feature, enabled by default, by adding the following line to your wp-config.php
define('CONCATENATE_SCRIPTS', false);
Now the scripts don't get load by ajax but printed straight to the html page and everything works fine.
I think, although the page loading will be a bit slower than before as it will wait for all the scripts to be loaded, it's a good compromise if we want to add a bit more security to our admin area.
Where is the script inclusion located?
A the head or on the bottom?
The problem may come from the location .
If you can insert some code where you have tried.

Receive then implement .js files from server in a chrome extension

I have a chrome extension that, when clicked, needs to display a modal to the user. For convenience we would like to pull all the necessary code for the modal from a server and then execute the JavaScript in the context of the extension, before displaying anything to the user.
(running a Node.js server)
Is there a way to do this?
If not, any suggestions on alternative routes we could take?
cheers!
Have a read through https://developer.chrome.com/extensions/contentSecurityPolicy
In short - it's possible, but you need to serve the script over HTTPS, or else Chrome will reject the origin. You also need to explicitly write the CSP in the manifest.
"Convenience" is a strange word to use here though. What if the network is flaky or slow?

What does "Failed to get composer template data" mean in Facebook lint?

I've created a trivial prototype app on Facebook. When my test script (JavaScript on Ubuntu command line, powered by Node.js) tries to access the app, it produces this error message:
{ error:
{ message: 'Invalid OAuth access token.',
type: 'OAuthException',
code: 190
}
}
So I'm trying to debug using Facebook's lint debugger. However when I paste the app's access token into lint, it responds with:
Failed to get composer template data.
I have no idea what this means, and a lengthy stumble through Google reveals page after page of people who are similarly clueless.
Has anyone seen this error, and fixed it?
Details about the app:
It's configured to ask for read_insights and manage_pages alongside standard permissions. No other permissions are requested.
Settings, Basic: I've had to put a nonexistent URL in the secure canvas URL, since I don't have any SSL hosting anywhere. The non-SSL canvas URL is complete and points to an existing page.
"App Info" is all filled in (apart from Tagline which is optional).
I haven't submitted the app for approval for public use, and there are no "items for approval". I'm going to be the only person who ever uses it, this isn't necessary for this app.
Switching from "live" to "sandbox" and back again doesn't make any difference.
There are no warnings anywhere on the app developer page.
A client I worked for was experiencing a similar issue - when sharing certain URLs on Facebook, the Facebook Sharer wasn't picking up any of the thumbnails. Frustrated with that, the client was trying to clear the Sharer's cache using the debugger at https://developers.facebook.com/tools/debug/, hoping that this way Facebook will re-cache the page and display the corresponding images.
However, in doing so, the client was seeing the ambiguous "Failed to get composer template data." error, and resorted to me for a solution.
I did my research, and it turned out that Facebook had decided to block the domain of the CDN that my client was using to serve images from. Since the pages were loading all images from that CDN, none of the images were getting picked up and the debugger was returning that "Failed to get composer template data." error.
The moment we started serving the images from a new CDN, Facebook started picking them up correctly, and the error disappeared.
Hope that helps you!
P.S. Please note however, this is not a permanent solution if you are violating Facebook's terms in some way. Yes - Facebook's spam prevention algorithms do return false positives sometimes, but most of the time they have a pretty good reason to block your content.
P.P.S. Worth noting, in the case I'm describing, when we passed the CDN URL to the debugger, it returned "This link is blocked, or you have triggered an excessive amount of scrapes. If you think you're seeing this by mistake, please let us know."
I had same error, "Failed to get composer template data.".
I believe my path to Images was blacklisted by Facebook. Workaround was to create virtual path that points to Images folder. Then I could reference /Images with /OGImages virtual directory. Then I no longer received the error.
Had kind of the same problem, I figured out I needed to use HTTPS instead of HTTP for the image link, and everything went fine then.
Hope it may help !
I had just the same problem and it appeared suddenly after several months without any site changes except content. First I thought the Facebook spam filter had blocked our site, as suggested by a Ycombinator comment thread but then I found the real problem.
In fact it was the official Facebook Wordpress plugin that was acting up. Disabling it meant that the Facebook debugger could once again fetch our data and sharing started to work immediately.
In my case is was a "Facebook Share Buttons" plugin for Wordpress. I've deactivated the plugin and resolved the issue.

Categories