Enabling Commerce with Content: Cross Origin Resource Sharing
The typical ecommerce retailer has several online presences often including a storefront and blog. Our Demandware clients host blogs on a separate domain. This works great until they want to provide a strong call to action on their blog with an integrated cart and personalization function. Suddenly cross domain security throws up a roadblock.
Enter CORS, or Cross Origin Resource Sharing if you want to spell it out. CORS lets a website make an XMLHttpRequest to another domain. Demandware makes this pretty easy with a few simple HTTP response header modifications.
Let’s say you have two sites, blog.example.com and store.example.com. In case you didn’t catch it the first is a blog and the second is a store. The blog site would like to include the navigation and cart from the store for all visitors and personalization for logged in customers. This serves the dual purpose of a call to action to the customer and also consolidates the navigation removing the need to maintain it in two places. On the blog you have to form a XMLHttpRequest with the attribute “withCredentials” set to true. This gives access to the store’s domain cookies. Then on the store side, aka Demandware, you need to add the response headers.
Access-Control-Allow-Origin: http://blog.example.com
Access-Control-Allow-Credentials: true
Content-Type: text/html; charset=utf-8
That buys you the basic GET and POST operations which will enable a strongly linked online presence and hopefully higher conversion.
The lyonscg team is implementing this on an in-progress project to provide the client a seamless experience between blog and storefront.
