Shopping cart and history for partial HTML integration

Managed by | Updated .

In order to enable Funnelback's shopping cart and search history within partial integration, it's necessary to make modifications for handling session cookies. The following provides a general, illustrative example for how to enable the search history and shopping cart features with partial HTML integration. This example is written in PHP, so some details are specific to PHP. However, the concepts should apply to any implementation.

Session history

For PHP specific implementations, any HTML rendering must come after the code in this section.

In partial integration, the CMS will relay requests between the user and Funnelback servers. When a user submits a query, the CMS makes the request to Funnelback servers, receiving the cookie in the response header.

If a user already has a Funnelback cookie in their browser, it's necessary to send that cookie with the CMS request. In PHP, the cookie value can be identified using the global variable $_COOKIE with the ID user-id

$request_cookie = $_COOKIE['user-id'];

In the request from the CMS, we need to make sure the cookie is sent. In PHP, we use a CURL, sending the Funnelback cookie:

$curl = curl_init();
    curl_setopt_array($curl, array(
        CURLOPT_RETURNTRANSFER => 1,
        CURLOPT_URL => $url,
        CURLOPT_TIMEOUT => 5,
        CURLOPT_HEADER => true,
        // Send the FB cookie with the request
        CURLOPT_COOKIE => "user-id=" . $request_cookie
));

If this is the first time a user has searched, there's no cookie and that field will be empty. Then the CMS will receive a response from the Funnelback servers and we need to make sure that we get the header of that response in order to identify the cookie.

$response = preg_split("/\n\n/", curl_exec($curl), 2);

We then split the lines of the header into an array.

$header_lines = preg_split("/\n/", $response[0]);

Now it's possible to iterate through an array of the response header and identify the cookie. Once the cookie is identified, it's necessary to set the domain and path so that the browser sends the cookie when searches are performed anywhere on the domain.

foreach ($header_lines as $value) {
    if (strpos($value, 'Set-Cookie') !== false) {
        $cookie = rtrim($value) . ";Domain=phpapp.owen;Path=/";
        header($cookie);
    }
}

This code can be inserted within the additional code that's described in the example PHP wrapper.

Shopping cart

The Funnelback shopping cart utilizes AJAX requests, requiring further modifications. First, it's necessary to use a version of Angular that supports the withCredentials flag on Ajax requests (version 1.1.2 supporst this). After that, it's necessary to make three changes to Funnelback's javascript code used for AJAX requests, funnelback-session.js.

  • The funnelback-session.js must be modified so that the config removes the X-Requested-With header. This can be inserted after the .module settings.

    .config(['$httpProvider', function($httpProvider) {
        delete $httpProvider.defaults.headers.common["X-Requested-With"]
    
  • It's necessary to indicate an absolute path for the cart.

    var cartResource = $resource('//YourAbsolutePath/s/cart.json'
    
  • Finally it's necessary to pass the cookie with the AJAX request

            query: {method: 'GET',    params: {collection: collection}, isArray: true, withCredentials: true},
            clear: {method: 'DELETE', params: {collection: collection}, isArray: true, withCredentials: true},
            save:  {method: 'POST',   params: {collection: collection}, isArray: true, withCredentials: true}, 
            delete:{method: 'DELETE', params: {collection: collection}, isArray: true, withCredentials: true}
    });
    
  • Adjusting the path and adding the cooking must also be done for AJAX requests to clear the cart

    var historyResource = $resource('//YourAbsolutePath/s/:op-history.json',
    {collection: collection},
    {
        clear: {method: 'DELETE', params: {collection: collection}, withCredentials: true},
    });
    
Was this artcle helpful?

Tags
Type:
Features: Frontend > Search sessions and history