Martin's Blog - Developer Infos zu SharePoint, ASP.NET, BI und anderen Technologien

In einer SharePoint-Hosted App in ist ein Zugriff auf das Host Web über einen ClientContext nicht direkt möglich. Der Versuch die HostWeb-Url aus dem Request zu extrahieren und damit einen neuen ClientContext zu instanzieren schlägt fehl.

Richtig ist der Weg über die Klasse “AppContextSite”.

Zunächst muss aus dem Aufrufparametern der AppSeite die URL des HostWebs extrahiert werden. Hierfür bietet sich folgende Erweiterungsmethode für jQuery an:

$.extend({

    getUrlVars: function () {

        var vars = [], hash;

        var hashes = window.location.href.slice(window.location.href.indexOf('?') + 1).split('&');

        for (var i = 0; i < hashes.length; i++) {

            hash = hashes[i].split('=');

            vars.push(hash[0]);

            vars[hash[0]] = hash[1];

        }

        return vars;

    },

    getUrlVar: function (name) {

        return $.getUrlVars()[name];

    }

});

Sobald diese Erweiterungsmethode registriert wurde, können die URLs für AppWeb und HostWeb mit der Methode “getUrlVar” extrahiert werden:

    appWebUrl = decodeURIComponent($.getUrlVar('SPAppWebUrl');

    hostWebUrl = decodeURIComponent($.getUrlVar('SPHostUrl'));

Die AppWebUrl ist für dieses Beispiel nicht notwendig. Aber wenn wir schon dabei sind….

Über die Klasse “AppContextSite” wird der Zugriff auf das HostWeb und dessen Listen und Inhalte ermöglicht. Geladen werden die Inhalte aber weiterhin über den ClientContext des AppWebs. “AppContextSite” registriert sozusagen einen Proxy der den Zugriff durch den App Context zum HostWeb-ermöglicht.

   1:  function doIt() {

   2:      context = SP.ClientContext.get_current();

   3:      var hostctx = new SP.AppContextSite(context, hostWebUrl);

   4:      var web = hostctx.get_web();

   5:      

   6:      var list = web.get_lists().getByTitle('TestList');

   7:      var neuesItem = list.addItem(new SP.ListItemCreationInformation());

   8:      neuesItem.set_item('Title', 'Feldwert');

   9:      neuesItem.update();

  10:      

  11:      context.executeQueryAsync(onSuccess, onFail)

  12:  }

Dieses Code-Beispiel greift auf die Liste “TestList” im HostWeb zu und tragt in dieser ein neues ListeItem ein.