ForeSee Developer Portal

Everything you need to set up and optimize your ForeSee product. Home of developer documentation, implementation guides, and question/answer forums.

Blueprint

Cloud Deployment

Implementing Client Code - Cloud Deployment

Deployment Overview

This is the default option and offers the most hands-off experience for you. In this case, you make a small addition to your global website template to link to the hosted JavaScript file. This method allows all code modifications to be made by ForeSee, without any further changes to your website. Once you’ve added the snippet to your template, you don’t need to touch it again to receive code updates from us. This is because the embed snippet references your permanent home in the cloud.

Caching for ForeSee Cloud Deployment

Server cache expiration on these endpoints is extremely short, though browser cache is 12 hours. Returning visitors will receive new files if they are changed within 12 hours, but new visitors will always receive the latest files from the CDN.

Staging and Deployment Environments

We support both staging and production environments with unique URLs. You can take advantage of this to make testing easier as you roll out changes to your website. Both environments utilize the same web-scale infrastructure, but are totally isolated from each other.

Implementation

To implement ForeSee’s web-based measurement products, you need only make a small change to their website template. This is a departure from the past model where customers needed to change their templates as well as host JavaScript and CSS files. Customers receiving code upgrades from older legacy code can take advantage of the new cloud-hosted model as well. If you are using a tag manager like the Google Tag Manager, this should be a quick change, not unlike the steps it takes to implement Google Analytics or Omniture.

You should receive a small HTML snippet that must be added to your global website template(s) so that the snippet is present on every page of your website. The purpose of this is to manage the asynchronous loading of any ForeSee products that you may be using. The snippet causes a small JavaScript file to be downloaded from the cloud. This file manages the injection of the ForeSee script, which is used to track usage of the site, and present survey invitations as needed.

In most cases, the ForeSee Implementation Team has worked with our clients, and possibly a Technical Contact, to pre-configure the JavaScript library so that there are minimal changes required to implement this code.

Some of the pre-configured requirements are:

  • When and where to present an invitation.
  • Where to prevent an invitation from appearing.
  • How frequently to present the invitation.
  • The look and feel of the invitation.
  • This library may also contain logic to collect additional client specific data points that are available on the site to be passed along with the survey results through the use of Customer Passed Parameters (CPPs).

The basic implementation is simple:

  1. Take the custom HTML snippet and place it in your global website template.
  2. Work with the ForeSee team to decide when users will be invited to participate in a survey.
  3. The ForeSee analyst implements the triggering rules and deploys the code to the cloud.

Multiple deployment models are supported to accommodate the specific needs of each client. Read on to learn more about these options.

The Embed Snippet

Below is the snippet of HTML that you need to add to your website template. This needs to appear on every page of your website, ideally in the <HEAD> area. Don't forget to include it on special areas of the site like in the checkout process and 'logged in' areas. This offers the greatest flexibility in how the triggering behavior works across your site. Also, if at some point in the future you adopt other ForeSee products, it greatly simplifies the process of deploying them, since the code already exists on all the pages.

If you are using a tag manager to manage JavaScript snippets on your site, you inject the below snippet just as you would other analytic tools such as Google Analytics or Adobe Omniture. More details on using a tag manager to add the snippet are found at the article on Using Tag Managers to Add the Embed Snippet.

Below is an example of the ForeSee embed snippet. You will receive your specific snippet from your ForeSee client contact:

<script type="text/javascript">
    // Instructions: please embed this snippet directly into every page of your website template.
    // For optimal performance, this must be embedded directly into the template, not referenced
    // as an external file.

    // ForeSee Embed Script v2.00
    // DO NOT MODIFY BELOW THIS LINE *****************************************
    ;(function (g) {
      var d = document, am = d.createElement('script'), h = d.head || d.getElementsByTagName("head")[0], fsr = 'fsReady',
        aex = {
          "src": "[PUT YOUR URL HERE]",
          "type": "text/javascript",
          "async": "true",
          "data-vendor": "fs",
          "data-role": "gateway"
        };
      for (var attr in aex){am.setAttribute(attr, aex[attr]);}h.appendChild(am);g[fsr] = function () {var aT = '__' + fsr + '_stk__';g[aT] = g[aT] || [];g[aT].push(arguments);};
    })(window);
    // DO NOT MODIFY ABOVE THIS LINE *****************************************
</script>

Benefits of ForeSee Cloud Deployment

The default option for deploying ForeSee products to your website is to use our hosted JavaScript. We host the assets for getting ForeSee products onto your website and you make a single, one-time change to your website template that you don’t need to touch from that point forward. The benefits of this approach include:

  • One-time code change. This greatly simplifies the process of implementing our code package on your site. Once you have our embed-snippet in your HTML template, you don’t need to make further changes when you want to tweak the way products trigger or behave on your site – we can take care of those steps for you.
  • No need to host ForeSee files. With this system you no longer need to host any ForeSee scripts, stylesheets, or images, making the process of implementing our code easier than before.
  • A reliable, enterprise-grade Content Delivery Network (CDN). We partner with an industry-leading CDN that provides low-latency, high-reliability, geographically distributed edge servers to ensure content is delivered to your website visitors quickly.
  • Asynchronous loading. Content is loaded onto your site in parallel with the rest of your content, meaning that ForeSee scripts have negligible impact on page-load times in the unlikely event the content server is slow or unreachable.
  • Payload size. The ForeSee script that it loads is small - usually around ~19Kb compressed, depending on the customer. The ForeSee script that eventually is loaded is larger, although this is also an asynchronous request, having minimal impact on page load. All ForeSee resources that are loaded also provide GZip compression when supported by the browser. This results in lower overall payload size - which is particularly important for mobile or on dial-up connections.
  • Caching. ForeSee resources also use very aggressive caching - both in the browser and on the server. We attempt to minimize redundant requests against the Content Delivery Network (CDN) to maximize page load performance in all situations.
  • Browser support.The ForeSee gateway script is built on top of an industry-standard AMD module loading utility, and has undergone browser testing across a wide array of browsers and devices. Our supported browser set for the embed snippet and gateway script can be found on the Supported Platforms page.
  • API usage.Because the ForeSee client code is loaded asynchronously, we provide a callback fsReady() that you can use to guarantee any interaction you may have with our JavaScript APIs waits until our modules have finished loading. You would use this in the same way that you would use a DomReady callback to guarantee that code runs after the page is ready. Here's an example:
    <script>
    fsReady(function() {
    // Run this function to simulate a page load
    FSR.run();
    });
    </script>
    

Code Hosting Diagram

Cloud Deployment