WordPress and JS Cookies and PHP

[relish27]

Hi, all.

I'm working on a site where the visitor can dictate which market they're in and, based on that, a part of the navigation looks different.  The way that I determine how it looks is by using cookies.  My site's at WP Engine and I've worked with them to determine what kind of cookies are best (Javascript) and how to have them exclude the cookie from caching. 

The problem is that I do eventually need to get the cookie value into PHP.  I've done this and it works, but I find that I often need two loads of the page before the current JS cookie value is available to the PHP cookie code.  In looking around for answers, I found someone doing almost exactly the same thing here: http://esanctuary.net/cookies-with-wordpress-caching/

The only part I hadn't yet implemented is where he adds in the add_action calls that using AJAX (codex reference is here: http://codex.wordpress.org/AJAX_in_Plugins).

// Call Ajax
add_action( 'wp_ajax_ajax_action', 'esanctuary_sidebar_cookie'); // ajax for logged in users
add_action( 'wp_ajax_nopriv_ajax_action', 'esanctuary_sidebar_cookie' ); // ajax for not logged in users

I've added something akin to this into my functions.php, but I'm still having the same problem.  When I call my function, it's not returning the current cookie value until the second page load.  This is my code:

function get_market_cookie() {
// Check if a cookie has been set
if ( isset($_COOKIE["market"]) ) {
// return cookie value
return $_COOKIE["market"];
} else {
return "";
}
}
// Call Ajax
add_action( 'wp_ajax_get_market_cookie', 'get_market_cookie' ); // ajax for logged in users
add_action( 'wp_ajax_nopriv_get_market_cookie', 'get_market_cookie' ); // ajax for not logged in users

I'm sure that my JS cookie code is working, so it seems like this is where the issue must be.  I'm just not sure what I'm missing.  

Has anyone done this before?  Wondering if I'm missing something obvious.... 

Thanks! 

[Nick Pelton]

It looks like your going about it the correct way. We’ve used the AJAX cookie trick as well. The issue might be is your checking for the Cookie in JS before the Ajax call comes back. You could fix this by placing the check in the .done() or success: callback when the AJAX is complete.

Another trick we had WPEngine do for a site was add a GET parameter we can use at any time to break the cache like so:

mydomain.com/?wwnocache=true

Then they check if that parameter is set in the Nginx rules and make sure to bypass the cache. This would force the admin-ajax.php endpoint to load from a non-cached state (because WPE might be cashing that as well, even though it shouldn't). So your endpoint could look like:

yourdomain/wp-admin/admin-ajax.php?action=youraction&wwnocache=true

Thanks,

Nick Pelton

--
You received this message because you are subscribed to the Google Groups "Minneapolis St. Paul WordPress User Group" group.
To unsubscribe from this group and stop receiving emails from it, send an email to mpls-stpaul-word...@googlegroups.com.
To post to this group, send email to mpls-stpau...@googlegroups.com.
Visit this group at http://groups.google.com/group/mpls-stpaul-wordpress.
For more options, visit https://groups.google.com/d/optout.

[Courtney Remes]

Thanks, Nick.  I'll chew on this for a bit.  Appreciate it.

- Courtney

[Courtney Remes]

I'm still confused about this.  Many of the AJAX / WordPress things I'm finding require a lot more coding than what http://esanctuary.net/cookies-with-wordpress-caching/ seems to be saying is needed.  As in his example, I have the following.

1) A cookie being set with JS cookies.

Here's part of my JS file, where this cookie gets set -- cookie_name = "market"

function createMarketCookie(cookie_name, cookie_value) {

// Build the expiration date string:
var expiration_date = new Date();
expiration_date.setFullYear(expiration_date.getFullYear() + 1);

// Build the set-cookie string:
var cookie_string = cookie_name + "=" + cookie_value + "; path=/; expires=" + expiration_date.toGMTString() + "; domain=mysite.wpengine.com";

// Create/update the cookie:
document.cookie = cookie_string;
}

2) A PHP function in functions.php that references the set cookie

function get_market_cookie() {
// Check if a cookie has been set
if ( isset($_COOKIE["market"]) ) {
// return cookie value
return $_COOKIE["market"];
} else {
return "";
}
}

3) The "AJAX Magic," as the author calls it, also in functions.php

 

// Call Ajax
add_action( 'wp_ajax_get_market_cookie', 'get_market_cookie' ); // ajax for logged in users
add_action( 'wp_ajax_nopriv_get_market_cookie', 'get_market_cookie' ); // ajax for not logged in users

Is this really all there is to it?  I wish it was, but it seems like I need to be doing something more like what I see in the "AJAX on the Administrative Side" in that codex page (http://codex.wordpress.org/AJAX_in_Plugins), where they have some JS that triggers an AJAX request:

<?php
add_action( 'admin_footer', 'my_action_javascript' );

function my_action_javascript() {
?>
<script type="text/javascript" >
jQuery(document).ready(function($) {

	var data = {
		'action': 'my_action',
		'whatever': 1234
	};

	// since 2.8 ajaxurl is always defined in the admin header and points to admin-ajax.php
	$.post(ajaxurl, data, function(response) {
		alert('Got this from the server: ' + response);
	});
});
</script>
<?php
}

Do you agree?

- Courtney

[Nick Pelton]

Yup. That's the missing step. You've created a cookie in js, your have a function in php to get the cookie, and you have an Ajax endpoint to run that php function from JS, but WPE cache drops all cookies on page load, so you need to do a AJAX post after page load to hit that endpoint and retrieve the cookie. 

Thanks,

Nick

[Courtney Remes]

Okay, thanks again, Nick!

- Courtney