SharePoint 2013: Cómo acceder a información del sitio raíz desde una aplicación “SharePoint-Hosted”!

Sí estás creando una aplicación de tipo “SharePoint-Hosted” y necesitas acceder a información del sitio raíz desde dónde se agrego la aplicación, tienes que tener en cuenta dos cuestiones importantes:

  • La primera, los permisos que tienes que configurar en el manifiesto de la aplicación: tienes que permitir que pueda acceder a información del sitio raíz. Por ejemplo, si se trata de acceder a información del sitio raíz de la colección de sitios simplemente añadimos ese ámbito y el permiso que queremos darle a la aplicación:

image

  • En segundo lugar, en la lógica de la aplicación (JavaScript, ya qué se trata de una aplicación “SharePoint-Hosted”) tienes que tener cuidado con como especificas la Url OData qué te da acceso a la información del sitio raíz. Por ejemplo, si quieres leer los usuarios contenidos en la “User information list”, tendrás que construir una Url qué te permita acceder al sitio raíz utilizando para ello /_api/site/rootweb/<Informacion_A_Consultar>. Como puedes deducir, la clave de acceso a la información del sitio raiz está en /site/rootweb qué permite en este caso acceder al sitio raíz de la colección. Por ejemplo, el siguiente código accede a la User Information List y obtiene para cada usuario almacenado en la lista los valores de las columnas Title y Name. Estos valores son usados luego para pintar la correspondiente HTML con los resultados devueltos.
   1:  $(document).ready(function () {
   2:   
   3:      Membership = {
   4:          element: '',
   5:          url: '',
   6:   
   7:          init: function (element) {
   8:              Membership.element = element;
   9:              //Membership.url = _spPageContextInfo.webAbsoluteUrl + "/_api/site/rootweb/lists/getByTitle('User%20Information%20List')/items?$select=Title,Name";
  10:              Membership.url = _spPageContextInfo.webAbsoluteUrl + "/_api/site/rootweb/lists/getByTitle('Lista de información del usuario')/items?$select=Title,Name";
  11:          },
  12:   
  13:          load: function () {
  14:              $.ajax(
  15:                      {
  16:                          url: Membership.url,
  17:                          method: "GET",
  18:                          headers: {
  19:                              "accept": "application/json;odata=verbose",
  20:                          },
  21:                          success: Membership.onSuccess,
  22:                          error: Membership.onError
  23:                      }
  24:                  );
  25:          },
  26:   
  27:          onSuccess: function (data) {
  28:              var results = data.d.results;
  29:              var html = "<table>";
  30:   
  31:              for (var i = 0; i < results.length; i++) {
  32:                  html += "<tr><td>";
  33:                  html += results[i].Title;
  34:                  html += "</td><td>"
  35:                  html += results[i].Name;
  36:                  html += "</td><tr>";
  37:              }
  38:   
  39:              html += "</table>";
  40:              Membership.element.html(html);
  41:          },
  42:   
  43:          onError: function (err) {
  44:              alert(JSON.stringify(err));
  45:          }
  46:      }
  47:   
  48:      Membership.init($('#peopleDiv'));
  49:      Membership.load();
  50:   
  51:  });
  • El resultado tras desplegar la aplicación, agregarla a un sitio y acceder a ella es el siguiente:

    .csharpcode, .csharpcode pre
    {
    font-size: small;
    color: black;
    font-family: consolas, “Courier New”, courier, monospace;
    background-color: #ffffff;
    /*white-space: pre;*/
    }
    .csharpcode pre { margin: 0em; }
    .csharpcode .rem { color: #008000; }
    .csharpcode .kwrd { color: #0000ff; }
    .csharpcode .str { color: #006080; }
    .csharpcode .op { color: #0000c0; }
    .csharpcode .preproc { color: #cc6633; }
    .csharpcode .asp { background-color: #ffff00; }
    .csharpcode .html { color: #800000; }
    .csharpcode .attr { color: #ff0000; }
    .csharpcode .alt
    {
    background-color: #f4f4f4;
    width: 100%;
    margin: 0em;
    }
    .csharpcode .lnum { color: #606060; }

image