ForeSee Developer Portal

Everything you need to configure and optimize your ForeSee products. Home of developer documentation, implementation guides, and release notes.

Blueprint

Cloud Deployment

Implementing Web SDK - Cloud Deployment

Deployment Overview

This is the default option and requires minimal involvement on your part. In this case, you make a small addition to your global website template that links to a 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 automatically receive code updates from ForeSee. 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 receive new files if they are changed within 12 hours, but new visitors always receive the latest files from the Content Delivery Network.

Staging and Deployment Environments

We support both staging and production/deployment environments with unique URLs. You can take advantage of this functionality 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 slight change to your website template. This is a departure from the past model where customers needed to change 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, similar to the steps for implement Google Analytics or Omniture.

You should receive a small HTML snippet from your ForeSee client contact 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 works with 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 should 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

The following example represents the snippet of HTML that you must 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 the snippet 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 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 in the Using Tag Managers to Add the Embed Snippet article.

Here 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": "[//gateway.foresee.com/sites/[your sitekey]/staging/gateway.min.js]",
          "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 the hosted JavaScript. ForeSee hosts the assets for getting ForeSee products onto your website and you make a single, one-time change to your website template. The benefits of this approach include:

  • One-time code change. This greatly simplifies the process of implementing ForeSee code packages on your site. Once you have the 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 – FoeSee manages these steps for you.
  • No need to host ForeSee files. With this system you don't need to host any ForeSee scripts, stylesheets, or images, which simplifies the process of implementing ForeSee code.
  • 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 as quickly as possible.
  • 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 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. ForeSee makes every 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. ForeSee's supported browser set for the embed snippet and gateway script can be found in the Supported Platforms article.
  • API usage. Because the ForeSee client code is loaded asynchronously, there is a callback fsReady() that you can use to guarantee any interaction you may have with ForeSee JavaScript APIs waits until ForeSee modules have finished loading. You might use this in the same way as 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

Updated about a year ago

Cloud Deployment


Suggested Edits are limited on API Reference Pages

You can only suggest edits to Markdown body content, but not to the API spec.