41 Comments »
When I started to implement Facebook Connect last week I thought it was going to be quick and easy, boy was I wrong. While Facebook Connect was working as it should, the problem that I ran into was a problem that many people have run into when developing plugins for Wordpress. If you have installed WP Cache, or in my case WP Super Cache, it’s pretty much guaranteed that you’ll have issues with displaying a user’s information after they login.
After a week of trying to develop an AJAX workaround and a million other models, with the help of Adam Hupp at Facebook this morning I was able to narrow down the possible errors. Apparently WP Super Cache has a filtering system which parses specific user cookies and won’t cache pages for those individuals that have those cookies (usually a small percentage of your site’s visitors).
There are two places that WP Super Cache looks at for filtering user cookies. The first (which I assume is the case for most users) is in the .htaccess file in your document root. If this is how your site is configured, you’ll need to find the following code in your .htaccess file:
# BEGIN WPSuperCache
RewriteCond %{REQUEST_URI} !^.*[^/]$
RewriteCond %{REQUEST_URI} !^.*//.*$
RewriteCond %{REQUEST_METHOD} !=POST
RewriteCond %{QUERY_STRING} !.*=.*
RewriteCond %{HTTP:Cookie} !^.*(comment_author_|wordpress|wp-postpass_).*$
RewriteCond %{HTTP:Accept-Encoding} gzip
RewriteCond %{DOCUMENT_ROOT}/wordpress/wp-content/cache/supercache/%{HTTP_HOST}/$1/index.html.gz -f
RewriteRule ^(.*) /wordpress/wp-content/cache/supercache/%{HTTP_HOST}/$1/index.html.gz [L]RewriteCond %{REQUEST_URI} !^.*[^/]$
RewriteCond %{REQUEST_URI} !^.*//.*$
RewriteCond %{REQUEST_METHOD} !=POST
RewriteCond %{QUERY_STRING} !.*=.*
RewriteCond %{HTTP:Cookie} !^.*(comment_author_|wordpress|wp-postpass_).*$
RewriteCond %{DOCUMENT_ROOT}/wordpress/wp-content/cache/supercache/%{HTTP_HOST}/$1/index.html -f
RewriteRule ^(.*) /wordpress/wp-content/cache/supercache/%{HTTP_HOST}/$1/index.html [L]
# END WPSuperCache
All you need to do at that point is replace the two RewriteCond %{HTTP:Cookie} lines with the following:
RewriteCond %{HTTP:Cookie} !^.*(comment_author_|wordpress|wp-postpass_|YOURAPIKEY_user).*$
You can replace “YOURAPIKEY” with your Facebook application API key that you are using. If you are like the majority of the people that I read in the various forums I was reading, this should probably solve your problem. If it doesn’t then you are one of the unfortunate ones (like myself). Thankfully I have spent the past week pulling out my hair trying to build a convoluted system which ultimately resulted in 5 lines of code so you don’t have to.
Create a file called anything you’d like as long as it ends in .php. I called my file “fbconnect.php”. In that file place the following lines of code:
<?php
function fbc_supercache($cachestr){
if(isset($_COOKIE["YOURAPIKEY_user"]) )
$cachestr .= $_COOKIE["YOURAPIKEY_user"];
return $cachestr;
}
add_cacheaction(’wp_cache_get_cookies_values’, ‘fbc_supercache’);
?>
Replace “YOURAPIKEY” with your actual API key and save it in the folder /wordpress/wp-plugins/wp-super-cache/plugins/. Upload that to your server and you should be good to go! Let us know if you run into any other problems. I only hope that you don’t have to experience the pain that I went through over the past week and that’s why I’ve gone ahead and posted this article!
I’m happy to be posting this comment even with WP Super Cache enabled!
Thank you, Nick. I am testing.
Hey Ninh,
Let me know if you have any issues. I’ll also be releasing some other code that should expand the wordpress Connect features in the coming days.
Best,
Nick
Great, it works. Thank you so much.
At first I only got blank pages for both prontpage and backend. The problem is the font you use in allfacebook replaced the single quotation mark ’ to ‘
It should be
add_cacheaction(’wp_cache_get_cookies_values’, ’fbc_supercache’);
Hey Ninh,
Great to hear that it worked for you. Sorry about the quote issue! The font may end up changing very soon
Best,
Nick
I’ve updated the wiki to point to this article. Thanks for documenting.
Let’s see how well WP Super Cache works in the coming days, as I assume your site is primarily pretty avid FB users. If you’re correct about Supercache, that means for anyone who has your cookie set, you’re going to hit the DB for any commenters with that cookie
Facebook never makes it easy. This is a huge shortcoming with facebook connect Nick. You have to be a coder to get the darn thing working.
I put in over an hour with a different plugin but it won’t work with my wordpress theme. uuuggghhh.
Facebook never makes it easy. This is a huge shortcoming with facebook connect Nick. You have to be a coder to get the darn thing working. I put in over an hour with a different plugin but it wont work with my wordpress theme. uuuggghhh.
Test
Hey Rodney,
It should be pretty simple to get the Facebook Connect plugin working with your theme. What problem are you running into? Let me know if you need help.
Best,
Nick
Wicked Good Work
Great stuff! helped me a lot. using Facebook connect on ibrokesomething.com Sometimes I get an error on the top of my theme saying that the header information was already sent by some other file and refreshing fixes that. Any fix for that?
Ok, nevermind my last comment, it was a whitespace problem since I had copy pasted the code. Typed it all by myself and now I have Facebook Connect up and running!
Thanks for the great fix!
Trying to get this to work on my site. Lets see how it goes. Thanks for the post.
Thanks, was looking for this
Wow, really cool! Thanks!
this is cool, thanks
The htaccess change worked for me.
Ninh Nguyen - December 18th, 2008 at 8:28 pm
Great, it works. Thank you so much.
At first I only got blank pages for both prontpage and backend. The problem is the font you use in allfacebook replaced the single quotation mark ’ to ‘
It should be
add_cacheaction(’wp_cache_get_cookies_values’, ’fbc_supercache’);
>>>>
This was exactly my problem. I just couldn’t get the page to refresh and show a user logged in. I changed all of these single quotes, and now I’m golden. Thank God I finally came across this article on a page with comments.
good article, thanks
I’ve been trying to get FB Connect to work with WP Super Cache per your instructions however i’m having little success. The problem occurs when I click on the Invite Friends Button or Community Button. I get a page full of html code rather then the desired community result. After following your instructions, even taking into account the error when copy/pasting your quotation marks above, I did manage to get it to work but had this posted at the top of every page. “Cannot modify header information - headers already sent by (output started at /home/trueho5/public_html/wp-content/plugins/wp-super-cache/plugins/fbconnect.php:8) in /home/trueho5/public_html/wp-content/plugins/wp-super-cache/wp-cache-phase2.php on line 36.” I thought I was getting there though and then suddenly everything turned to diamonds and squares(some weird code that i’ve never seen before??). I then disabled SuperCache and everything went back to normal again thankfully. Clearly SuperCache is the culprit. I will be so greatful too anyone that can help me get these two plugins working together in a cohesive manner. Feel free to contact me via facebook as well. SuperCache cuts my YSLOW load time in half so it’s a must have for me and I really would like to have the Sociable FB community plugin functioning. For the type of site i’m running, it’s exactly what I need. Thanks for your time.–Kingston
dude you’re a genius - a GENIUS. genius. wow.
when we launch the site you just saved (high traffic w/o super cache was impossible because it’s hosted in a third world country… long story) and fbook connect is flying high, i’ll drop the link here.
thanks again!
Hello sir
first i want to thank you about your good work
i’ve a blog in blogger can i add the facebook connect widget as this one on your site ?
please help me … thanks in advance
No answer yet ?
ok
so sweet.. trying to get it to work on mine
Nice Jobs, I like this WP SUper Cache enable!!
Thanks for that!
thanks for the great article
Crazy… nice!
Anyone of you got it working with Hyper-Cache yet??
Getting an annoying 404 page.
I’ve implemented the above two solutions on my site. Everything works fine but after a user logs in using facebook connect they get redirect to a 404 page on my site. The thing is though the redirected URL is correct and if I just click refresh in my browser it loads the page correctly.
Any ideas how to fix this bug? It doesn’t appear when super cache is uninstalled.
Thx Nick. I owe you a week and a pile of hair. Appreciated.
thanks man. your supercache plugin solution solved it for me, too!
test
test
Hi I was trying to implement this for my site. The issue I am having is I am using a sidebar plugin and it is calling the avatar. I have tried this method because I do have WP Super Cache enabled and when I would login with facebook instead of showing the facebook avatar, it shows the default gravatar icon. Any help would be appreciated. my sites at theidentityguys.com. (sidebar on the homepage after you facebook connect, just to make it clear)
I tried both ways and doesn’t work for me. After signing in with FB and being redirected to the homepage still being served the cached version.
thanks
Great job, very helpful for dealing with WP Super Cache.
nc one