JSONP and FoxyCart

Using JSONP with FoxyCart is as simple as adding output=json and callback=? to your JSONP calls. (The ? in the callback parameter might vary depending on your javascript framework of choice.)

Because the JSONP calls are made to the FoxyCart server, which usually is not the same domain as your main store, the request will be sent without any identifying information (like the session value, in the cookie). This is fine for browsers (like IE) that don't default to denying 3rd party cookies, but for browsers like Safari or Firefox it can be problematic (since they default to denying 3rd party cookies). What this means is that while the cart add will appear to work, if you reload the page it will disappear, since the “add to cart” was made to a different cart than the customer is using.

The simple solution to this problem is to append fc_AddSession() to your JSONP calls. For example, using jQuery:

$.getJSON('http://example.foxycart.tld/cart?output=json&cart=view&callback=?' + fc_AddSession(), function(data){
	// do something with `data`
});

Doing this will ensure the JSONP calls are made using the correct session.

Also important to note is that, depending on when you make your JSONP calls, you might not actually have a valid session yet. The session is available in the cookie that's set, and also in the JSON that loads automatically if you have foxycart_includes.js in your code. The easiest way to ensure that the session is available is to:

• Wait until the JSON is loaded. If you define a function called fc_BuildFoxyCart(), it will run once the JSON is ready. It will also run on certain other events, such as when the Thickbox-style “foxybox” cart is closed, so make sure to set a counter if you only want it to run once. Or…
• Check to see if the session exists in the cookie. If not, wait until the JSON is available, as described above.

For discussion on this topic, please see this thread in our forum.

If you want to remove a specific item, send something like this:

&cart=update&1:quantity=0&1:id=<product id from json>&2:quantity=0&2:id=<product id from json>

If you want to update the quantity of a specific item, send this:

&cart=update&1:quantity=<new quantity>&1:id=<product id from json>

Note that the cart=update is required for these operations to function.