Managing SharePoint 2013 App Context

Scot Hillier

by Scot Hillier on 9/7/2013

Share this:

Article Details

Date Revised:

Applies to:
Article, Content Type, EDITORIAL USE ONLY

Originally published 9/8/2013 and reproduced here for reference

When creating SharePoint 2013 apps, you often need contextual information about the app and the user. This contextual information includes things like the URL of the host web or the account claim of the current user. While it isn’t technically difficult to get much of this information, I find that I am always writing the same code, creating hidden fields, or programmatically creating query strings. I also get annoyed by the fact that I have to rebuild the context for every page in the app. What I really wanted was a simple library that maintains context throughout the current session. To solve the problem, I created 2 libraries for managing context: one for SharePoint-Hosted Apps (wingtip.context.js) and one for Cloud-Hosted Apps (wingtip.remotecontext.js).

You can download the libraries and sample apps from here.  Basic sample code appears later in this article.

Both context libraries provide the same information. The difference is that the Cloud-Hosted App library (wingtip.remotecontext.js) uses the cross-domain library to get the contextual information while the SharePoint-Hosted App library (wingtip.context.js) just uses jQuery ajax. In addition to retrieving the contextual information, the libraries also cache the values using HTML 5 Session Storage so that you can use the contextual information across page calls. The following tables list the available contextual data in three tables: Base Contextual Information, Geolocation Information, and User Information.

Basic Contextual Information




This is the complete encoded query string stripped from the launch URL. This can be attached to subsequent URL links to maintain context if the current browser does not support Session Storage.


A message indicating the status of the context. Possible values are “undefined”, “success”, or a serialized JSON error object.


The timestamp when the current context was created.


The timestamp when the current contextual information was modified.


The identifier used when requesting an App Part resize with postMessage.


A Boolean value indicating if the current browser supports HTML5 Session Storage.


The Full URL of the Site Collection hosting the app.


The decoded value of the SPAppWebURL query string parameter.


The decoded value of the SPClientTag query string parameter.


The decoded value of the SPLanguage query string parameter.


The decoded value of the SPLibraryVersion query string parameter.


The decoded value of the SPHostUrl query string parameter.


The decoded value of the SPProductNumber query string parameter.


The value of the FormDigest for use with list item updates.


The lifetime of the FormDigest in milliseconds.


A Boolean value indicating if the current FormDigest is valid. A setTimeout function is used to invalidate the FormDigest based on the value in the FormDigestTimeout property.


The Full URL of the App Web.


Geolocation Information




A message indicating the status of the Geolocation context. Possible values are “undefined”, “success”, or an error message.


A Boolean value indicating if the current Geolocation information is valid.


The latitude of the current user.


The longitude of the current user.


User Information




A message indicating the status of the user context information. Possible values are “undefined”, “success”, or serialized JSON error object.


The account claim for the current user.


The display name of the current user.


The email address of the current user.


Using the Libraries

In order to use one of the libraries, simply add them to your project and reference it in the standard way as shown in the following sample code.

<script type="text/javascript" src="wingtip.contextinfo.js"></script>

After referencing the desired library, the context can be initialized. The libraries support initializing the portion of the context you are interested in (init_base(), init_location(), and init_user()). The libraries utilize promises in a when…done pattern so that you can detect when the initialization is complete and move on with your app functionality. The following code shows how to fully initialize the contextual information and receive notification when it’s complete.

'use strict';

window.Wingtip = window.Wingtip || {};


$(document).ready(function () {

    $.when( Wingtip.ContextInfo.init_base(),



        function () {

//Code here will execute
//when the context is fully initialized




Once initialized, you can access any of the properties using code similar to the following sample:


That’s all there is to it! Now, with just a few lines of code you can maintain critical contextual information for the duration of the current app session.


Topic: Article

Sign in with

Or register