Facebook Connect XFBML not working - firefox

I'm making a website using Facebook Connect and decided to use Facebook's XFBML tags like "fb:profile-pic" since they are so easy to use.
I haven't been able to make them work no matter how hard I look online but then I noticed that it worked on all the browser's instead of Firefox.
I also realized that even on Facebook's own "The Run Around" sample app they don't work!! You can check it out here: http://www.somethingtoputhere.com/therunaround/index.php
If you log in with Firefox your picture is not shown, but if you use another browser it is shown. This happens with the fb:profile-pic tag or any other tag like fb:name.
I haven't found any information online so I'm asking other people that have worked with this: Are these tags simply not compatible with Firefox ? Do they have outages or something like that ? Has this happened to anyone before ? Any ideas on how to resolve this ?

I guess they do have "outages". I've spent the whole weekend trying to resolve this and now they post they had a problem and have resolved it.
From the Platform Live Status website:
http://developers.facebook.com/live_status.php#msg_497
We are experiencing a possible config
problem with api.connect.facebook.com.
If you are including Connect JS
library through
http://static.ak.connect.facebook.com/js/api_lib/v0.4/FeatureLoader.js.php,
all API requests through JavaScript
would fail. This affects rendering of
XFBML tags (such as fb:name and
fb:profile-pic) as well. While we are
fixing this issue, you can work around
the problem by changing
http://static.ak.connect.facebook.com/js/api_lib/v0.4/FeatureLoader.js.php
to
http://static.ak.facebook.com/js/api_lib/v0.4/FeatureLoader.js.php.
It's also safe to keep url change
permanently because
connect.facebook.com is just an alias
to facebook.com.
I wish they had updated that sooner, now I'm looking for a place to find out about this stuff before I spend days working on something before realizing it's not a problem with my code!

Open up Firefox > Preferences > Privacy and make sure "Accept third party cookies" is checked. This is needed for Facebook Connect to work. Also, when using Connect, make sure all your tags are fully closed, i.e. <fb:profile-pic></fb:profile-pic> and not <fb:profile-pic/>. From the docs:
The user's browser must be set to
accept 3rd Party Cookies in order for
it to stay connected between clicks.
Source: http://wiki.developers.facebook.com/index.php/Logging_In_And_Connecting
FWIW, I wouldn't use "the run around" as a sample app. That thing has been the same since they introduced Connect and is pretty hacky.

do check in connect section under the canvas option.
there should be a link of your physical file.

Related

Why does my Linkedin share button not work?

I want to create a share button for Linkedin, the GUI button is all set up, but it doesn't work when clicking it. I researched a bit and came to the conclusion that using the same sharing mechanism, other sites work but mine doesn't.
I narrowed the problem down and now I'm trying to figure out why google.com works but my site doesn't. I don't use my real company website because it's personal information, but it's a website that has been on the internet for more than 10 years (in case this information is useful). When I go to the links, my website throws an error, but Google works fine.
Ⓧ https://www.linkedin.com/cws/share/?url=https://www.my-company-website.com
〇 https://www.linkedin.com/cws/share/?url=https://www.google.com
Is there any pre-requisite I'm missing, which makes my site not work?
I realized my server was blocking Linkedin (to reduce traffic from Linkedin bots). That's why it wasn't working.
As hint: I was working on closed webpage (for outside users) and that also causing problems with Linkedin share button.
Hint 2: Website uses Lets Encrypt! SSL and information mentioned here is a fake news https://wordpress.org/support/topic/linkedin-share-button-not-working-3/ Work's fine!
If you ever get stuck on trying to figure out why your page simply doesn't populate nice preview data on your LinkedIn share page, then check out the LinkedIn Post Inspector.
Insert the URL of your page (i.e., example.com), not the URL you are using to share (i.e., linkedin.com/share?url=example.com). You'll get detailed information on how your site will appear and why, like, for instance, sharing wikipedia.org...
Hope this helps someone else with a LinkedIn share issue!

Force Google Recaptcha Challenge

Is it possible to set some flag in my browser so that I always get the RECAPTHCA image challenges? Sometimes when you click on the "I am not a robot" button, it gives you a pop up challenge with something like "Click all the images which contain a car", but sometimes it just checks off the box and takes your word for the fact that you're not a robot.
I would like to test the UI of my tool both on a desktop and on mobile, and make sure that the challenge pop up shows up and interacts well with other elements of the page.
In other words, as a developer, I want Google to think that I'm a robot so that it always gives me the visual challenge.
Is there any way to force this behavior?
Note: I've done some research and was unable to find any relevant questions or blog posts that might yield an answer.
Force Google recaptcha to use simple checkbox click challenge asks for a way to force Google to NOT use the visual challenge, only the checkbox
How to force recheck user with reCAPTCHA? talks about forcing a recheck of some kind, but has no answers
https://groups.google.com/forum/#!topic/recaptcha/2ed-s3KK3Do actually asks my same question, but users did not seem keen on providing answers, with one user just suggesting not to use RECAPTCHA at all!
https://developers.google.com/recaptcha/docs/faq#id-like-to-run-automated-tests-with-recaptcha-v2-what-should-i-do is straight from Google, but it does exactly the opposite of what I want - it sets your site up such that the captcha appears on the page but is actually a test captcha that always lets you pass, and NEVER gives you the challenge. I want the exact inverse of this.
The methods told here should generally work, but there is no guarantee of the same. There is a very easy way to guarantee that Google reCAPTCHA challenge always show up. All you need to do is to add a custom BOT device in developer tools and then use the same to test.
In Chrome Dev Tools, open Settings. Open Devices after that.
Add a custom device with any name and set User Agent String to Googlebot/2.1
Finally, in Device Mode, at the left of the top bar, choose the custom device that you created (the default is Responsive).
Thanks to the SO users who had put it up in the answer and follow-up comment here.
I too have been looking for similar functionality. While I have not found a code-based solution to force the challenge, I have found a fairly reliable hack.
Grab a VPN tool (I happen to use IP Vanish), then connect to a remote server (I've had success connecting to China). Then, open up a private/incognito window and fill out your form.
From my testing, the combination of the remote IP and the blank user session triggers the challenge.
Here are a few things you can try. In my experience all of them will increase your chances of getting a challenge.
Log in at https://www.google.com/recaptcha/admin and edit your
reCAPTCHA settings. Under Security Preference choose Most Secure.
Use a VPN + incognito mode (as suggested here)
If you're using the invisible reCAPTCHA, I found that using explicit
rendering + immediately calling grecaptcha.execute() after
grecaptcha.render() will usually trigger the challenge. I suspect
this is because Google's AI expects a user interaction of some kind
to trigger grecaptcha.execute() and not the onloadCallback itself.
I use reCAPTCHA's SDK in Android, and I also encounter the need to force validation when testing. I tried it many times. At last, I turned off or turned on the flight mode, which can be verified in the retest. I guess it may be that Google put my IP on the white list in the background, so I passed the verification without any challenge.
That should be possible, because when LinkedIn forcefully logged out an user for excessive usage, it showed captcha on next login, and there always was the challenge.
Unfortunately, LinkedIn switched from Recaptcha to another provider just few days ago, so I cannot just look up into their JavaScript code.
It is what makes me believe that Recaptcha does have an undocumented option to force the challenge.
2022 and later
It seems to be increasingly harder to trigger the recaptcha challenge of the invisible recaptcha. Using the UserAgent of a bot, going into incognito mode is not enough anymore. A VPN might work, but I do not trust free VPN services.
I am however still able to trigger the recaptcha challenge when I'm only using the keyboard while filling in the form fields and pressing the submit button with the enter key. It seems like the Google Recaptcha is now also following your mouse movements to determine if you are a real user. Make sure to never hover your mouse cursor over the webpage and only use the keyboard.
I was looking for something like this and after some research plus trial & error what worked for me is to use the invisible recaptcha and invoke the challenge with JS.
After you have loaded the recaptcha script on your page then do
grecaptcha.execute()
and the challenge might be invoked.

Endless spinning wheel at Woocommerce checkout

I am in the process of building a shop on wordpress using woocommerce. All is well except that at checkout there is an endless spinning wheel blocking the payment processing.
I have checked the error logs - which show no errors
I have disabled all plug ins - which makes no difference
I have reverted to the default woocommerce shopfront theme - which has the same result.
The console shows no errors.
I have also followed the instructions here https://docs.woocommerce.com/document/endless-loadingspinner-on-the-checkout-page/ which assumes its a memory limit issue. This did not work.
So, after a bit of digging I found some reference here https://mikejolley.com/2015/11/12/debugging-unexpected-token-in-woocommerce-2-4/ and here https://www.maxsangster.com/blog/woocommerce-endless-loading-spinner-on-checkout/
Referring to these two pages I have been able to see that the json response from /?wc-ajax=checkout is just returning HTML which I would imagine is where the issue is.
However I am running an Apache server rather than Nginx as has been mentioned in some threads and articles. Assuming there is a server misconfiguration of the server or something that needs changing what might that be? Bearing in mind that I do not have direct access to this, so will need to be asking someone else to sort it out for me.
And finally if there is something else I can try what might that be?
Thank you to #plushyObject for generating the spark for this one.
The issue turned out that I had a legacy static html holding page in place as the site's homepage rather than having one set up with wordpress. Simply removing the .html page and letting wordpress's homepage take over solves the problem.
The moral of the story create your holding page in wordpress.
Go to Google Developer Tools, then Go to the Network tab. Click the button and make the request and let that bad boy spin out.
You mentioned the response is returning HTML. Click on the request that goes out that appears to be taking forever (/?wc-ajax=checkout) and then click on the Preview tab to display that HTML. I bet it shows an error or a clue, anyway.
In my case the checkout was working fine on Desktop but not on Mobile. After many search on internet I read the solution of #UntitledGraphic.
I had set a redirect in ht-access. The redirect was showing a different home page for mobile. When I removed it, the error gone. I checked back & forth and was sure the ht-access redirect was the problem.
If you have set any redirect in the Htaccess then remove it. This will solve your issue in this case.
I also checked the redirect code on function.php instead of htaccess again the problem appeared. So finally removed the redirection.
In my own case the redirection was the issue. So I had to delete the redirect I created via Cpanel.

iTunes URL in tweet in app

In my app, I've got a share button for facebook and twitter etc. I want that people can tweet and post the link of my app, but the app is not yet available in the app store, so i can't have a link to the app.
In some apps there is a link to the app if you are composing a tweet, how do they do that?
As H2CO3 pointed out, having that AppStore URL delivered from a server you control would likely be something you would prefer. Naturally, the first question to pop to mind would be something of the form 'Why do I have to use a server at all? Can't I just code it into my app directly?'
In short form, you are not required to use a server, but you may find that the benefits and flexibility it offers you in at the cost of a little more networking code and complexity in your app helpful. Let's expand on this a bit, by imagining we lived in the perfect world where we knew with 100% accuracy what that AppStore URL would be and that it would never ever change. We could get away with just coding that URL directly into our app and we would never again have to think about that part of our app -- it would always tweet the correct URL, users would be happy, and you as the developer can turn your attention to more important matters.
Unfortunately, things often don't work perfectly and as software developers we have to consider the ugly edges of reality and write code to handle them gracefully. Here are just a few of the potential problems with hard-coding a URL:
We don't actually know the full AppStore URL.
Apple may decide to change AppStore URL formats and render old URLs invalid.
Despite our best efforts to carefully type the URL into our code, we made a mistake and now we have to issue an update and wait for our app to be reviewed to get a simple typo fixed - Eep!
H2CO3's suggestion to use a server builds likely stems from experience in writing software coupled with developer's inherent risk management driven thought processes -- if there is something I can do to make my software handle these ugly edges more gracefully and make my software more reliable, it may make sense to take the extra time to implement my feature differently to protect it from the shadowy unknowns the future may have in store for my app.
For the sake of a balanced argument against putting the URL on a server:
If your users are in a place that has spotty cell or wifi coverage, they may not be able to connect with your server to get the AppStore URL from your server
Your server might not be working properly so it can't deliver information to your app when requested.
Adding a network request like this can be very easy to do, but also introduces its own set of risks to have to consider (isn't writing software great?)
As indicated above, you do not need to make your app snag the URL from a server you control, but you may want it to do so. Only you, as the app's developer, can determine what degree of risk you are willing to accept and which of the available options you've researched, invented, or otherwise acquired seem to fit your specific needs the best.
Since I don't know your background, I'm going to stay relatively high level and give you another couple of nudges in some directions you can go and do some additional research:
On the 'setup a server' idea -- you can purchase a hosting account from a number of hosting providers around the Internet or if this is a school or work project you may be able to speak with your IT people to request space for a website. After you have that setup, you can put a file on that space with a placeholder URL and write some code in your app to connect to your server and read your file (that has your fake URL in it!) the put it into your Tweet. Once your app is approved, you can change the fake URL on your server with the real one, and your App will work like you want. For the App part of things, you might look into some of the simple +stringWithContentsOfURL: methods on NSString (though do remember to consider things like what happens if the Internet is down, or if you don't get anything back from your server, etc.!)
On the 'just hard code the URL into the app' idea -- Apple makes some marketing resources available to developers even before they release an app. Checkout (https://developer.apple.com/appstore/resources/marketing/index.html) with an emphasis on the Shortlinks section, and also checkout Technical Q&A 1633 (https://developer.apple.com/library/ios/#qa/qa1633/_index.html). Both of these links give you information about how to build a link directly to an application or vendor on the AppStore given just their name(s). Like before, do remember to consider what happens if you ever decide to rename your app, or if linking elsewhere (or maybe nowhere!) would make more sense.
Hopefully this will help you think a little more about what you are actually trying to achieve, and give you a sense about what other developers think about when faced with decisions like the one you've posed here.
While i agree with Bryan i always avoided using servers for basic things. With ios 5+ you can send tweets from inside the app ( and you can add default tweet (i.e. a link to the app)
Your problem can be solved easily this way : make a short link with the link to the app store ( the link to the app store is formatted like this : https://itunes.apple.com/app/id <app id> , and the app id the the one in itunnesconnect under Apple ID )
For example you can make a default tweet like this : " Check out this awesome app!! goo.gl/buya " and then the user can edit it as he wishes.
Also..it's extremely unlikely that Apple will change the format of theyr links...too many users depend on this format to do..a lot of things

Facebook Like Button Comments Not Working - https issue

I'm using FBML and everything was working before, then I noticed that when you click like the comment box would not show up anymore. I checked out the dev site and saw that the way it's done now has changed.
I updated my code but it still doesn't show the comments box but the actual liking action works fine.
Here is a link: http://fez.nu/Oniir
EDIT 2: I'm using XFBML, I don't know if that makes a difference. I've heard that FBML is deprecated
EDIT 3: I browse with https on Facebook. I turned it off and the comment boxes show up on my site. So that problem is solved but how do I make it work with users that are using secure browsing on Facebook when my site is not?
You can use an HTML inline frame.
<iframe src="https://mytab.example.com/tabs/"></iframe>
This question has produced an accepted solution to what appears to be your problem.
Abstract
You can avoid SSL warnings for domains that support SSL by not being
specific about the transport protocol. e.g. instead of including
http:// or https:// use //
<!-- Instead of this: -->
<iframe src="http://www.facebook.com/plugins/like.php?params"></iframe>
<!-- Do this: -->
<iframe src="//www.facebook.com/plugins/like.php?params"></iframe>
Security considerations
Please note that there are some security considerations to this approach. I recommend you read the below articles and questions.
Are there security issues with embedding an https iframe on an http page (SE question)
HTTP and HTTPS iframe (SO question)
Other considerations when serving mixed (http/https) content (external site)
Edit 1
In the FAQ for the Like Button, it's stated that it will need 400 pixels in width to give the user the option to add a comment. If you don't have 400 pixels available, I think you would have to sacrifice the option to post a comment, or use a popup-window instead.
This problem started last night.
I thought it was my code at first but a quick rollback to code I KNOW (QA Tested) worked manifested the issue.
I went to the source itself, Facebook's OWN Like button generation tool and THEY have the same problem.
Then I picked BOTH a random CNN & Yahoo news article and that is what you call a trifecta. All 3 sites could not properly render the comments UI elements for the like button.
If it walks, quacks and moves its head like a duck... WTF? :))

Resources