SharePoint 2013 Apps Nuevo Modelo Desarrollo

SharePoint 2013 Apps:
el nuevo modelo de desarrollo
ADVERTENCIA LEGAL
Todos los derechos de esta obra estn reservados a SolidQTM Press
El editor prohbe cualquier tipo de fijacin, reproduccin, transformacin o distribucin de esta

obra, ya sea mediante venta, alquiler o cualquier otra forma de cesin de uso o comunicacin pblica de la misma, total o parcialmente, por cualquier sistema o en cualquier soporte, ya sea por fotocopia, medio mecnico o electrnico, incluido el tratamiento informtico de la misma, en cualquier
lugar del mundo.
La vulneracin de cualquiera de estos derechos podr ser considerada como una actividad penal tipificada en los artculos 270 y siguientes del Cdigo Penal.
La proteccin de esta obra se extiende al mundo entero, de acuerdo con las leyes y convenios
internacionales.
SolidQTM Press, 2012

ISBN: 978-84-940719-0-4
SharePoint 2013 Apps: el nuevo modelo de desarrollo

Serie SharePoint
Autores: Jos Quinto Zamora, Cristian Zaragoza, Guillermo Bas, Roberto Bern e Ivn Paredes.
Prlogo: Daniel A. Seara.
Revisor tcnico: Daniel A. Seara.
Revisin lingstica: Paco Marn.
Diseo y maquetacin: Roco Guerrero.
Imagen de cubierta: Ralph Bijker
Apartado de correos 202

03340 Albatera, Alicante, Espaa
http://www.solidq.com
Este e-Book est publicado con fines promocionales, no est permitida su venta.
ndice
Captulo 1. Novedades en SharePoint
2013
Cloud App Model
12
Herramientas de desarrollo
14
Visio 2013
14
SharePoint Designer 2013
16
Visual Studio 2012
20
Proyecto NAPA
23
Mayor uso de los estndares web
24
Ms tipos de aplicaciones
25
Representacin del lado del cliente (Client-side rendering)
26
Novedades en las API
27
Integracin de mapas y geolocalizacin
27
Caractersticas Sociales
29
Comunidades (Communities)
29
Flujos de trabajo (Workflows)
33
Servicios de conectividad empresarial (Business
Connectivity Services)
33
Bsqueda empresarial
38
Dispositivos mviles
44
Captulo 2. Introduccin a las SharePoint

Apps
Introduccin. El desarrollo sobre SharePoint a lo largo
de los tiempos
57
SharePoint 2013 y su nuevo modelo de aplicaciones 59
Cundo usar soluciones y cundo aplicaciones?
61
El Office Store
62
Tipos de SharePoint App. Visualizacin y funcionalidad

65
Interfaz grfica
44
Office Web Apps en mviles
45
Notificaciones y alertas desde listas de SharePoint
45
Contenido de inteligencia de negocio desde iPad
46
Geolocalizacin en aplicaciones mviles
46
Cmo se desarrollan aplicaciones de Windows Phone
46
para SharePoint 2013?
ECM (Enterprise Content Management)
47
eDiscovery
47
WCM (Web Content Management)
50
Gestor de diseo (Design Manager)
50
Sitios dirigidos por las bsquedas
51
Catlogos y publicacin entre colecciones de sitios 53
Mejoras en SEO (Search Engines Optimization)
54
Cambios en multimedia
54
Navegacin administrada (metadatos administrados) 54
Otras novedades
55
Nuevas aplicaciones de servicio
55
Novedades en inteligencia de negocio para SharePoint
2013
55
Conclusiones
56
Pgina completa (Immersive Full Page)

65
Parte de pgina (App Part)
66
Accin personalizada (UI Custom Action)
68
Tipos de SharePoint App. Opciones de alojamiento 69
Apps alojadas en SharePoint (SharePoint-hosted Apps)

69
Apps auto-alojadas (Autohosted Apps)
72
Apps combinadas (Hybrid Apps)
73
Resumiendo
75
Conclusiones
76
Captulo 3. Desarrollo de SharePoint

Apps
Mi primera app
Introduccin
Preparacin del entorno de desarrollo
Hola Mundo!
Maquetacin y diseo de apps
77
77
78
88
Introduccin
105
Cloud-hosted Apps
142
Modelo de objetos de cliente y API REST en SharePoint
2013
150
API REST en SharePoint 2010
155
API REST SharePoint 2013
156
Ejemplos de uso de las API
161
Conclusiones
176
105
Captulo 4. Instalacin y administracin

de SharePoint Apps
Instalando aplicaciones desde el Office Store
Administracin de aplicaciones instaladas
El catlogo de aplicaciones (App Catalog)
Conclusiones
Captulo 5. Novedades influenciadas

por las SharePoint Apps
Plataforma de desarrollo en la Nube Introduccin a
Microsoft Napa
190
Navegadores soportados
192
Instalando y ejecutando NAPA por primera vez
193
Conclusiones
201
Eventos en SharePoint 2013
201
Events Receivers Remotos
203
App Event Receivers
207
Conclusiones
208
Autores
177
185
187
189
Novedades de flujos de trabajo para SharePoint 2013

209

Para el diseador
209
Para el desarrollador
209
Para el responsable de IT
210
Arquitectura
210
Workflow Manager Client 1.0
211
Windows Azure Service Bus
211
Workflow Service Manager
212
Instalacin y configuracin del entorno
212
Interfaces de programacin
217
Conclusiones
218
Prlogo
Prlogo
Estos ltimos aos, durante este nuevo milenio, muchas cosas han cambiado en la comunicacin entre los seres humanos. La filosofa de las redes sociales ha terminado abarcando
tambin gran parte de la tarea de sincronizacin de actividades y conocimiento intrnseco en
las empresas.
Desde el punto de vista de la plataforma Microsoft, el elemento fundamental que ha dado
progresivamente soporte a esto es, indudablemente, SharePoint.
Las distintas versiones que conocemos, han evolucionado acompaando este proceso,
desde un simple repositorio de documentos, hasta convertirse hoy, en la plataforma de eleccin para almacenar, procesar y compartir toda la documentacin de muchos procesos en las
empresas.
No solo esto, se ha expandido para dar una visin pblica de las mismas, a travs de sus
infraestructuras de publicacin, ha facilitado la interaccin con los datos de negocio hasta el
punto de transformarse progresivamente en la cara visible de eleccin de los procesos de
Inteligencia de negocio.
Y tambin, cmo, facilitando la interaccin entre los miembros de las empresas, la facilidad de localizar informacin pertinente entre todo lo disponible en las mismas, de una forma
rpida, eficiente y clara para los usuarios y muchas cosas ms.
Estamos en las vsperas de una nueva versin del producto, denominado ya SharePoint
2013.
Por supuesto, se han dedicado muchos esfuerzos en brindar ms y mejores prestaciones.
Y adaptando la plataforma al devenir de los tiempos, con mayor presencia en la Nube, incrementado el acceso a la informacin desde distintos dispositivos y dems exigencias propias de
la evolucin de la humanidad.
Esto hace que, evidentemente, los mecanismos de personalizar las implementaciones en
SharePoint exijan cada vez ms de s, y requiera mayor integracin con la plataforma.
Adems, la apuesta va de cara a integrar cada vez ms, por ejemplo, las aplicaciones de
Office.
Y qu duda cabe que, en la relacin costo-beneficio, cada vez son ms las empresas que
deciden llevar su implementacin a entornos externalizados en la Nube, como es el caso de
Windows Azure.
Prlogo
De todo esto se decanta que, obviamente, la forma de generar personalizaciones e inclusive implementar aplicaciones sobre la plataforma SharePoint 2013, requiere adaptaciones y
mejoras.
Este libro, precisamente, realiza un recorrido completo de todas esas opciones, haciendo
hincapi en las diversas integraciones, as como en la comparacin con las formas previamente
existentes.
Los cambios por venir son realmente importantes, al punto que algunas cosas dadas como
novedosas en la versin actual, podran considerarse casi obsoletas en esta nueva por venir.
Partiendo de colaboraciones directas con el equipo de producto que el grupo que tengo
el honor de dirigir y yo mismo hemos mantenido durante todo el proceso de diseo y creacin
de esta nueva versin, nos hemos decidido, ahora que ya es de conocimiento pblico, dar un
fundamento adecuado a todos aquellos interesados en implementar soluciones para la nueva
versin de Office y SharePoint, tanto en instalaciones de los usuarios, como en lnea (en la
Nube que puedo asegurarte que no se cae). Si te lees el libro enterito, vas a entender como
es el tema en la nueva versin.
Desde ya aclaro que no vas a tener ejemplos complicados (espero que los pidan, as convenzo al equipo a expandirse en muchos ms detales), aunque s puedo asegurarte que vas a
entender perfectamente lo que vendr con el desarrollo de apps de SharePoint.
Y no quiero cerrar este prlogo sin reforzar un concepto que escrib previamente:
Es para m un verdadero honor guiar en lo esencial los pasos de esta pandilla de excelentes profesionales con los que comparto el da a da de nuestras tareas y proyectos en SolidQ.
Definitivamente, no sera posible hacer todas las cosas que hacemos, y conseguir objetivos tan
importantes, si su prestancia, profesionalidad, conocimiento, capacidad de progreso, generosidad, colaboracin y compaerismo.
Un orgullo, Cristian, Guillermo, Ivn, Jos, y Roberto.
Dani Seara
Madrid, un nublado da de octubre de 2012.
Prlogo
Organizacin del libro

El objetivo de este libro es profundizar en el nuevo modelo de desarrollo de SharePoint,
que pretende dar cabida a lo que llaman las SharePoint Apps. No obstante, dada la importancia
del resto de novedades incluidas en SharePoint 2013, no hemos querido perder la oportunidad
de hacer un repaso de ellas, profundizando un poco en aquellas que hemos considerado ms
importantes.
En el captulo 1 del libro veremos las novedades referentes a SharePoint 2013 separadas
por categoras. Este captulo pretende que el lector tenga una visin general de todas las
novedades sin profundizar mucho en ellas, pero s explicando claramente y con ejemplos y
diagramas aquellas novedades que no son tan fciles de entender, como por ejemplo, toda la
parte de eDiscovery.
En el captulo 2, veremos una introduccin a las SharePoint Apps, cuyo objetivo es sentar las
bases y explicar los porqus de un nuevo modelo de desarrollo.
En el captulo 3, profundizaremos en el desarrollo de las SharePoint Apps. Veremos desde
una aplicacin hola mundo, hasta los componentes ms complejos a la hora de maquetar
una app de SharePoint o de acceder a SharePoint 2013 desde una app mediante el modelo de
objetos cliente y el API REST. Todos sabemos que la teora en este tipo de desarrollos es muy
bonita y se explica detallado en la mayora de los recursos de MSDN, pero a la hora de la verdad,
siempre hay cosas que no van como dice la teora, sino como marcan los atajos o workarounds
que los propios programadores vamos experimentando a base de golpes. Adems todos los
ejemplos montados se han pensado en trminos del programador que parte desde cero.
En el captulo 4, veremos los detalles de la instalacin y administracin de apps, es decir,
como instalar una app del Office Store, capacidades de administracin en base a licencias,
permisos, etc. Adems, comentaremos qu es el nuevo catlogo de aplicaciones de SharePoint
2013.
En el captulo 5, entraremos ms en detalle en aquellas novedades que, an ya habiendo
sido mencionadas en el captulo 1, merecen un hincapi especial debido a su drstico cambio,
en parte, influido por el nuevo modelo de SharePoint Apps. Estamos hablando de Microsoft
NAPA, manejadores de eventos remotos (en ingls Remote Event Receivers) y la nueva arquitectura de los flujos de trabajo.
Prlogo
Ejemplos de cdigo
En este libro se han utilizado ejemplos de cdigo fuente, concretamente para los captulos 3 y 5. Los lenguajes utilizados han sido HTML, JavaScript, CSS, C# y Visual Basic. Todos los
ejemplos de cdigo utilizan la versin Microsoft Visual Studio 2012 y pueden ser descargados
desde las siguientes direcciones url:
http://www.solidq.com/sqj/books/Materials/Ejemplos-de-codigo-SharePoint-Apps.zip
Ante cualquier problema para descargar el cdigo contacten con webmaster@solidq.com.
Preguntas y comentarios
Si tienes cualquier comentario o idea acerca de este libro o del material relacionado, o
si tiene preguntas que no se responden en este libro, pngase en contacto con webmaster@
solidq.com.
Captulo 1. Novedades en SharePoint 2013 Preview
A lo largo de la historia de SharePoint, ha habido cambios importantes, siempre respondiendo a las necesidades del mercado en cada momento.
Los primeros productos de Microsoft que se acotaron bajo el trmino SharePoint fueron SharePoint Team Services (STS) y SharePoint Portal Server 2001 (codename Tahoe). El
equipo de SharePoint Team Services se encargaba de ayudar a los equipos de trabajo a compartir informacin rpida y fcilmente. Por su parte, SharePoint Portal Server 2001 ofreca capacidades de bsqueda, gestin documental y personalizacin, pero como a todas las primeras
versiones, le faltaba mucho por hacer.
Estos dos sistemas, aunque eran muy tiles resolviendo sus funciones, estaban poco integrados. Motivo por el cual, despus de importantes quejas de los clientes, en el ao 2002 estos
dos equipos se unieron para proporcionar una plataforma comn. Como resultado, ofrecieron
al mercado un conjunto de dos productos: Windows SharePoint Services 2.0 que era la edicin gratuita (licencia de Windows Server) y SharePoint Portal Server 2003. Se hizo un rediseo de la arquitectura con los objetivos principales de poner SQL Server 2000 como sistema
de almacenamiento y ASP.NET como plataforma de desarrollo, con lo que todo esto conlleva:
Master Pages, Web Parts, etc.
Paralelamente al equipo de SharePoint exista el equipo de Microsoft Content

Management Server 2002 que se dedicaba principalmente a gestin de contenidos web. En
10
2004, ante la peticin de muchos de sus clientes, decidieron unir tambin estos dos equipos,
surgiendo el producto Microsoft Content Management Server Connector for SharePoint
Technologies (codename Spark), que integraba algunas funcionalidades de SPS 2003 y MCMS
2002, como por ejemplo, poder utilizar el motor de bsquedas de SPS en MCMS. Spark fue
solamente un parche, ya que no proporcionaba una plataforma comn. Fue cuando, en octubre de 2006, Microsoft hizo el lanzamiento de Windows SharePoint Services 3.0 y Microsoft
Office SharePoint Server 2007. SharePoint 2007 tuvo un tremendo xito con cerca de 100
millones de licencias vendidas. Con SharePoint 2007 se introducen muchas capacidades y se
transforma el concepto de SharePoint de ser un sistema de portales y sitios de equipos de
trabajo a ser un portal de colaboracin de negocio en el que se integran capacidades de: colaboracin, portal, bsqueda, gestin de contenido, formulario de negocio, flujos de trabajo e
integracin con Inteligencia de negocio.
Dado el xito de SharePoint 2007, Microsoft sigui apostando por cada uno de los pilares
o capacidades (workloads en ingls) mejorndolos paralelamente. En 2007, adquiri Dundas
que son componentes de visualizacin avanzada, y en 2008, adquiri Powerset y FAST ESP,
dos empresas dedicadas a la bsqueda empresarial, la segunda de las ms importantes del
mercado en el momento.
En mayo de 2010, fue cuando Microsoft hizo el lanzamiento de SharePoint 2010, que
mejorara y rediseara las capacidades de la versin anterior. La versin gratuita, en este caso,
se llamara SharePoint Foundation 2010 (SPF 2010) y la versin de pago SharePoint Server
2010 (SPS 2010). En SharePoint 2010, se introduce la experiencia de usuario amigable (Ribbon
UI), se mejoran las capacidades de multi-navegador y dispositivo, viendo la evidente tendencia
del mercado, adems de utilizar AJAX para mejorar la experiencia del usuario. Adems, en esta
versin se convierte Groove en SharePoint WorkSpace permitiendo usar SharePoint en modo
offline. Otra gran mejora es Office Web Apps, que nos permite ver y editar documentos de
Office directamente en el navegador. Tambin se invierte mucho en mejorar las caractersticas
sociales: My Site, manejo de perfiles, conexin entre personas, etc. En cuanto a conexin con
sistemas externos, nacen los BCS (servicios de conectividad empresarial), que nos permiten
enlazar con fuentes externas en modo lectura y escritura. Sin olvidarnos de todas las ventajas
para desarrollador: REST, ATOM, JSON, LINQ, depurar con [F5], etc.
Esto es el estado del arte del producto SharePoint hasta su versin actual, SharePoint 2010.
No obstante, el 16 de Julio de 2012 sale la primera beta pblica de SharePoint 2013, llamada
11
SharePoint 2013 Preview. Adems, el da 24 de Octubre de 2012 sali la versin RTM en el

sitio de MSDN, descargable nicamente para aquellos desarrolladores con subscripcin con
suficientes derechos. Microsoft anunci que la disponibilidad general de SharePoint 2013 saldra el Q1 de 2013.
A todo esto, se aade el cambio de logos y branding que est ejecutando Microsoft en
todas sus reas siguiendo el diseo novedoso de Windows 8, la que lleva a un cambio de logo
en SharePoint tambin:
SharePoint 2013 trae muchas novedades tambin en todas las capacidades o workloads, siendo
dos de los ejes centrales, la Nube y el contenido social. Este captulo pretende dar una visin a
alto nivel de estas novedades. Con esto conseguimos que aquellos que disponemos de menos
tiempo para leer densas documentaciones podamos fcilmente conocer qu trae esta nueva
versin y cmo podemos aprovecharlo para nuestra rutina diaria.
Los desarrolladores web estamos de suerte, dado que con SharePoint 2013 vienen buenas
noticias, ya que Microsoft cada vez est centrando ms atencin en HTML, CSS y JavaScript,
tanto para desarrollos sobre el propio SharePoint 2013 como para el resto de productos de
Office 2013 a travs de las Office Apps (aplicaciones tipo complemento -addin- para Office
2013). Debido a ello, surgen nuevos tipos de componentes o aplicaciones sobre SharePoint
llamadas SharePoint Apps. Para aclarar, esta nueva forma de crear aplicaciones no elimina
la tradicional forma de crear soluciones SharePoint mediante Soluciones de granja o Sandbox,
sino que aade ms posibilidades. En esta seccin del libro nos centraremos en novedades de
desarrollo a ms alto nivel y no entraremos muy en detalle en las SharePoint Apps, puesto que
el resto de los captulos del libro se centran exclusivamente en las apps, incluyendo desarrollo,
gestin y publicacin en MarketPlace (Office Store).
Veamos a continuacin una relacin de las novedades para el desarrollador en SharePoint
2013.
12
Cloud App Model

Tal como comentaba, en SharePoint 2013 se introducen las SharePoint Apps y con ellas
un nuevo modelo de desarrollo de aplicaciones. Es decir, que en SharePoint 2013, tendremos dos opciones a la hora de desarrollar aplicaciones, podremos generar Soluciones (wsp) o
Aplicaciones (app).
Figura 1-1. Opciones de desarrollo en SharePoint 2013
Estas opciones tambin se vern reflejadas como plantillas de proyectos distintas en Visual
Studio 2012:
Figura 1-2. Plantillas de desarrollo para SharePoint 2013

en Visual Studio 2012
13
Las SharePoint Solutions son las soluciones tradicionales de SharePoint que pueden crearse
con Visual Studio para extender nuestras aplicaciones web con funcionalidad adicional. El concepto de SharePoint App es nuevo, pero la idea es similar, dotar a SharePoint de funcionalidad
adicional, aunque en este caso se redisea el paradigma con los siguientes objetivos:
-- Proporcionar un alto nivel de aislamiento en las aplicaciones, puesto que no tienen
por qu vivir en SharePoint. Pueden estar alojadas y consumir recursos de otros servidores (IIS,
Azure, etc.).
-- Facilitar la instalacin y actualizacin de aplicaciones a los usuarios, ya que las
SharePoint Apps se adquieren va MarketPlace a travs del SharePoint Store (pblico) o del
App Catalog (privado).
-- Solventar una nica necesidad de negocio. La finalidad de las apps es de solventar una
necesidad especfica de los usuarios, no de hacer una mega aplicacin que se encarga de todo.
No obstante, se podrn crear cualquiera de los dos tipos de aplicaciones para SharePoint
2013.
En los siguientes captulos de ste libro, hablaremos ms en detalle de este nuevo modelo
de desarrollo, ya que es nuestro objetivo principal.
14
Herramientas de desarrollo
Comenzando por el ms bsico, debido a que est ms orientado a usuarios de negocio
que a desarrolladores, tenemos a Visio, despus a SharePoint Designer, que est orientado a
usuarios ms tcnicos y a Visual Studio, que ya est orientado a desarrolladores puros. No olvidemos el proyecto NAPA, que es como un Visual Studio (simplificado y limitado a SharePoint
Apps) pero embebido en una pgina web. Comentaremos en este mdulo estos 4 productos
para el desarrollo de componentes a medida en SharePoint 2013, dejando el proyecto NAPA en
un captulo aparte debido a su novedad y aplicacin exclusiva para SharePoint y Office Apps.
Visio 2013
Dentro del mbito de SharePoint, se considera a Visio como una herramienta de desarrollo
debido a que nos permite de forma visual e intuitiva crear flujos de trabajo (en ingls workflows)
personalizados y despus exportarlos a SharePoint Designer para poder aadir algunas acciones ms avanzadas.
En Visio 2013 y SharePoint Designer 2013 se incluyen novedades en el desarrollo de flujos
de trabajo, entre ellas nuevas Formas (Shapes) que representan Etapas (Stages), Bucles (Loops)
y Pasos (Steps). Dichas Formas, en versiones anteriores de Visio, no estaban disponibles. Por el
nombre se puede intuir un poco la funcionalidad que desempean estos tres nuevos componentes. El objetivo del libro no es avanzar en este tema sino introducirlo; para ms informacin
sobre workflows de SharePoint 2013 en Visio 2013, vanse los siguientes enlaces:
Workflow development in SharePoint Designer 2013 and Visio 2013.
Shapes in the SharePoint Server 2013 workflow template in Visio 2013.
15
Figura 1-3.Plantilla de
SharePoint
2013 Workflow
en Visio 2013
Figura 1-4. Men de formas (shapes)

para flujos de trabajo de SharePoint
2013 dentro de Visio 2013.
16

En SharePoint Designer 2013 (SPD 2013) el primer cambio que observamos al instalarlo
y ejecutarlo es el logo:
Figura 1-5. Logo de

En esta parte, tenemos noticias para aquellos que nos dedicamos a aplicar diseos en
SharePoint. Parece ser que Microsoft no considera apropiado SharePoint Designer para aplicar
branding, de hecho, siendo as, yo no considero apropiado el nombre del producto SharePoint
Designer. Y esto no quiere decir que SPD est en peligro de extincin, ha habido cambios y
mejoras en el producto, pero mucho ms orientadas del lado de los flujos de trabajo. Veamos
una serie de mejoras que se han introducido:
1. Desaparece la vista de Diseo para HTML
Han quitado la vista de Diseo dentro del editor web de SPD 2013, por lo que
ahora solamente tenemos la posibilidad de editar pginas maestras, diseos de pginas, etc., con vista de cdigo. Ms informacin: SharePoint Designer 2013s missing
design view y SharePoint Designer 2013 Design View is Gone!
2. Crear flujos de trabajo basados en el nuevo .NET 4.x Workflow Infrastructure
(SharePoint 2013 Workflows)
Tambin se mantendr la compatibilidad hacia atrs para poder crear y editar
flujos de trabajo de SharePoint 2010.
17
Figura 1-6. rear flujo de trabajo para SharePoint 2013 desde SharePoint
Designer
Nota. Si no ves la opcin de SharePoint 2013 Workflow al crear un nuevo

flujo de trabajo en SPD 2013 es porque no tienes configurado Windows
Azure Workflow en la granja de SharePoint 2013. Recuerda que este componente no se instala con SharePoint 2013; hay que instalarlo aparte.
Ms informacin: Instalacin y configuracin de flujos de trabajo para
SharePoint Server 2013.
3. Integracin con Etapas (mquinas de estados)

Los flujos de trabajo hasta ahora deban crear actividades en serie. Ahora los flujos
de trabajo de SharePoint 2013 podrn implementar mquinas de estados, es decir,
podrn saltar de un estado a otro dependiendo de ciertas condiciones, incluso llegando a una etapa anterior.
18
Figura 1-7. Mquina de estados finitos para los flujos de trabajo de SharePoint 2013
4. Visual Designer (Integrado en SPD 2013)

Cuando desarrollamos flujos de trabajo en Visio, tenemos disponible un editor visual
mediante el que podemos usar figuras (shapes) directamente arrastrndolas y soltndolas. En el caso de SPD 2013, y solamente para desarrollar workflows de SharePoint
2013 (no para los de SharePoint 2010), tenemos integrado el Visual Designer de Visio
dentro de SPD. Normalmente desde el Visual Designer se introducen las etapas de la
mquina de estados y desde el diseador, en modo sentencias declarativas SentenceStyle, introduciremos las acciones como lo hemos hecho siempre.
5. Invocar HTTP (REST) Web Services

Existe una accin que nos permite invocar a un servicio web REST por HTTP de
forma grfica. Ejemplo de uso (en ingls): How to work with web service using Call
HTTP Web Service action in SharePoint Designer 2013.
19
6. Soporte a copiar y pegar

Una de las caractersticas ms solicitadas, sobre todo a nivel de diseo de flujos de
trabajo, es poder copiar y pegar ciertas acciones ante procesos repetitivos. Ahora ya
est soportado. Ms informacin (en ingls): Copy-and-Paste support in SharePoint
Designer 2013.
7. Loops
Por fin se pueden hacer bucles en los flujos de trabajo mediante la inclusin de una
actividad navita.
8. Iniciar Workflows de SharePoint 2010
Nueva accin que permite invocar a los workflows de 2010 desde uno de 2013. De
este modo se aumenta la compatibilidad hacia atrs.
9. Mejorado el editor de correo electrnico (formato enriquecido)
10. Variables de tipo Diccionario
Podremos crear variables para almacenar vectores o arrays de valores, combinando
esto con la nueva accin de Loop podremos alcanzar muchos ms escenarios.
Para ms informacin sobre SharePoint Designer, recomiendo mirar directamente en el
blog del equipo de producto: SharePoint Designer Team Blog.
20
Visual Studio 2012

Cada equipo de producto de Microsoft trabaja en paralelo para intentar mejorar da a da,
por esto es que el 12 de septiembre de 2012 fue el lanzamiento oficial de Visual Studio 2012
y, claro, en lo que a los desarrolladores SharePoint nos afecta hubieron novedades tanto para
SharePoint 2010 como para SharePoint 2013 . Veamos primero aquellas novedades que aplican
a ambas versiones de SharePoint y dejemos para el final las herramientas para desarrollo de
SharePoint Apps, que solamente afectan a SharePoint 2013.
1. Diseador de listas y tipos de contenido
Cuando creamos nuevas listas o tipos de contenido desde Visual Studio (a travs
de Nuevo Elemento...) ahora ya no tenemos que pelearnos con unos ficheros XML
tediosos y difciles de entender; han hecho un gran trabajo con el diseador visual
para esto, vase en la imagen:
Figura 1-8. Diseador de listas y tipos de contenido en SharePoint 2013.
2. Crear columnas de sitio

Tenemos disponible un nueva plantilla (Item Template) para la creacin de columnas de sitio.
3. Crear Web Parts de Silverlight
Nueva plantilla que nos facilita la creacin de Web Parts para Silverlight.
21
4. Publicar soluciones SharePoint en servidores remotos

Esto es desde Visual Studio tener la capacidad de desplegar en otros servidores.
Ms informacin: Cmo: Implementar, publicar y actualizar una solucin de SharePoint
en un servidor remoto.
5. Utilizar herramientas de generacin de perfiles para medir el rendimiento de
SharePoint
Estas herramientas nos permiten observar y grabar el comportamiento en cuanto
a rendimiento detectando: posibles cuellos de botella, cdigo ineficiente, fallos de
liberacin de memoria, etc.
Para ver ejemplos y ms informacin sobre esto vea estas pginas:
- Analizar el rendimiento de la aplicacin mediante las herramientas de generacin
de perfiles.
- Generar perfiles de rendimiento de aplicaciones de SharePoint.
6. Crear Sandboxed Visual Web Parts
En SharePoint 2010 no se permita crear de forma fcil un Visual Web Part con una
SandBoxed solution, ahora ya existe plantilla para ello.
7. Intellisense y depuracin para JavaScript
Han mejorado mucho la depuracin en JavaScript, para ver ms informacin:
Depurar soluciones de SharePoint.
22
Adems de todas estas novedades, para poder desarrollar las nuevas SharePoint Apps
(que aplican solamente a SharePoint 2013) vamos a necesitar Visual Studio 2012. Pero no es
suficiente con VS 2012 de base, sino que tenemos que instalar las Microsoft Office Developer
Tools for Visual Studio 2012 (descarga desde aqu). Estas herramientas nos proporcionan
plantillas para facilitarnos la creacin de aplicaciones de Office 2013 y SharePoint 2013:
Figura 1-9. Plantillas de Visual Studio 2012 para SharePoint 2013 Apps.
Debemos tener en cuenta que para poder instalar estas plantillas de desarrollo es requerida cualquiera de estas versiones de Visual Studio: Ultimate, Premium o Professional.
Adems, si nos preguntamos, podemos desarrollar SharePoint Apps con Visual Studio
2010? La respuesta es no. Con VS 2010, podremos desarrollar soluciones de granja y sandbox
como lo venamos haciendo para SharePoint 2010, pero en este caso para 2013.
23
Proyecto NAPA
No vamos a entrar muy en detalle, puesto que tenemos una seccin dedicada a ello en el
captulo 5 de este mismo libro, pero es un IDE de desarrollo web. Ah lo dejo.
Figura 1-10, Proyecto NAPA. Entorno de desarrollo en la Nube.
24
Mayor uso de los estndares web

Con SharePoint 2013, se abre la posibilidad de crear aplicaciones de SharePoint a un mayor
mbito de desarrolladores no acostumbrados a la tecnologa Microsoft. De hecho, para desarrollar las nuevas SharePoint Apps se utilizarn las tecnologas HTML, CSS, JavaScript, REST,
OData, OAuth, etc.
El hecho de que una SharePoint App se ejecute en un iFrame independiza a sta del contexto de SharePoint, por lo que pasa a ser una aplicacin remota. Como toda aplicacin remota,
para poder realizar la comunicacin con el propio SharePoint, se realiza o bien a travs de REST
o de Client Object Model. Con esto, se consigue que en cualquier plataforma y/o tecnologa
web se pueda desarrollar una aplicacin para SharePoint 2013. Por ejemplo, imaginemos una
aplicacin de gestin de vacaciones realizada con PHP, la cual queremos integrar en SharePoint.
Ahora es posible simplemente usando el modelo de objetos cliente para toda la comunicacin
con SharePoint; el resto de componentes de la aplicacin funcionaran tal cual estaban (presentacin, navegabilidad entre formularios, etc.). Vase en la imagen las posibles opciones de
acceso a datos desde una app hacia SharePoint.
Figura 1-11. Posibilidades de desarrollo de aplicaciones cliente en SharePoint 2013.
Ahora no entraremos ms en detalle en las tecnologas mencionadas, pues al tratarse de

un libro de desarrollo se va a profundizar sobre cada uno de estos puntos ms adelante. Por
adelantar un poco, cabe mencionar que hay muchas novedades en la parte de REST y modelo
de objetos cliente.
25
Ms tipos de aplicaciones
Con SharePoint 2013 podemos desarrollar ms tipos de aplicaciones que anteriormente.
Hagamos una categorizacin dependiendo de las herramientas usadas para crearlas, de los
modelos de programacin utilizados, de los mtodos usados para empaquetarlas, desplegarlas y publicarlas, y los dispositivos en los que se ejecutan.
-- SharePoint Apps (el tipo de aplicaciones en el que se centra este libro). Son soluciones
independientes para realizar tareas pequeas. Los usuarios pueden descargarlas e instalarlas
directamente desde un catlogo pblico llamado App Store. Pueden incluir componentes
bsicos de SharePoint como: listas, pginas, Web Parts, flujos de trabajo, tipos de contenido,
etc. Se pueden ejecutar en un servidor externo (Azure u otros).
-- Sitios de publicacin. En SharePoint un sitio de publicacin nos sirve para hacer implementaciones de webs pblicas. Debido a esto, y a la cantidad de conceptos a asimilar en una
web pblica (SEO, branding, navegacin, URL, usabilidad, etc.) se enmarcan la creacin de sitios
pblicos como una tipo de aplicacin propio dentro de SharePoint. Adems en SharePoint
2013, hay bastantes novedades en este sentido, las cuales veremos ms adelante.
-- Soluciones de granja. Las soluciones de granja son los .wsp que ya conocemos. Es
decir, aquellas soluciones que normalmente son un conjunto de Web Parts, y otras extensiones
cuyo despliegue es realizado por una caracterstica (feature) y que resulta en aadir ciertos
ensamblados (DLL) a la GAC (Global Assembly Cache) del servidor frontal de SharePoint (o servidores si hay ms de uno). Para instalar este tipo de aplicaciones, se requiere hacer el despliegue directamente en el servidor. Las soluciones de granja permanecen igual en SharePoint 2013,
salvo un detalle, ya que en SharePoint 2010 se podan desplegar con polticas CAS (Custom
Access Security) asociadas y estas polticas son ignoradas en SharePoint 2013. Adems, con la
aparicin de las SharePoint Apps aparecen ciertas recomendaciones sobre cundo usar unas u
otras, que las puedes ver en la seccin de SharePoint Apps de este libro (captulo 2).
-- Soluciones Sandbox. Son tambin .wsp como las soluciones de granja, pero con un
espacio aislado de ejecucin y con una API ms reducida. Adems, se instalan a nivel de sitio
sin requerir el acceso en el servidor para ello, simplemente subiendo el .wsp a la galera de
soluciones del sitio de SharePoint. Debemos de tener en cuenta que segn la documentacin
oficial de Microsoft las soluciones sandbox estn marcadas como obsoletas en SharePoint 2013.
-- Aplicaciones para mvil. Con SharePoint 2013, se abre el abanico de posibilidades en
cuanto al acceso a SharePoint desde las aplicaciones mviles. En el caso de Windows Phone,
26
existe una API de cliente disponible para ello, y en el caso del resto de dispositivos mviles, se
pueden usar los nuevos servicios REST/OData que incluyen mucha ms funcionalidad ahora.
Representacin del lado del cliente (Client-side rendering)

Una de las novedades en el ncleo de la plataforma SharePoint, y con el objetivo de dar
soporte a una rica experiencia de usuario, es la funcionalidad llamada representacin del
lado del cliente client-side rendering.
Es un mecanismo que nos permite producir nuestra propia salida para ciertos controles
que se hospedan en una pgina de SharePoint. Cuando decimos salida, nos referimos a que
podemos utilizar nuestro propio HTML y JavaScript para definir la lgica y presentacin de
cierto control.
Un ejemplo es la construccin de un tipo de campo (field) personalizado al cual queremos asociarle una representacin muy personalizada:
Figura 1-12. Caracterstica de Client-side rendering.
27
Podemos ver un ejemplo completo: Cmo personalizar un tipo de campo con la representacin del cliente.
Novedades en las API

Tal como comentbamos en el punto anterior, donde afirmbamos que SharePoint 2013
hace mayor uso de los estndares, tambin cabe decir que el equipo de SharePoint ha hecho
un gran esfuerzo para ofrecer mucha de la funcionalidad que tiene en el modelo servidor, tambin por cliente, tanto en la API de cliente como en la API REST. Hay un apartado completo que
habla sobre estas novedades en el captulo 3 de este libro.
Integracin de mapas y geolocalizacin

Por fin ha llegado, en SharePoint 2013 ya tenemos de forma nativa un tipo de columna
(field type) para la geolocalizacin. Esto es algo que llevbamos implementando manualmente
desde las primeras versiones de SharePoint.
Figura 1-13. Caracterstica de Mapas en SharePoint 2013. Imagen obtenida de M;SDN.
Concretamente en un campo de tipo Geolocation podemos introducir coordenadas como

valores decimales, tanto para la latitud como longitud, aunque tambin podemos configurarlo
28
de modo que obtenga las coordenadas del usuario actual directamente desde el navegador
(siempre que implemente la API W3C de Geolocalizacin).
En esta integracin tenemos dos factores a tener en cuenta:
1. Almacenamiento de coordenadas.
Como hemos comentado anteriormente, la forma en la que SharePoint almacena la informacin de las coordenadas es a travs de un tipo de columna nuevo y esto a nivel de SQL
Server queda representado con los nuevos tipos de datos geometry, geography y hierarchy ID,
que requieren tener instalado SQLSysClrTypes.msi en el servidor de SQL Server. Para descargarlo, podemos usar este paquete: Microsoft SQL Server 2008 R2 SP1 Feature Pack.
Nota. Es importante tener en cuenta que este tipo de columna no est
habilitado de forma visual al aadir una nueva columna, para poder aadirlo a una lista lo deben hacer los desarrolladores va cdigo.
2. Representacin grfica de mapas:

En cuanto a la representacin grfica de los puntos geogrficos, SharePoint 2013 utiliza los
mapas de Bing, concretamente Bing Maps Ajax control V7. Adems, tenemos un nuevo tipo
de vista que es de tipo Mapa.
Nota. Para habilitar el mapa de Bing en nuestra granja de
SharePoint 2013, debemos establecer la clave de Bing Maps o bien
mediante modelo de objetos cliente o bien mediante PowerShell:
Set-SPBingMapsKey BingKey <Enter a valid Bing Maps key>
Ms informacin aqu.
Tambin debemos saber que se puede personalizar la representacin grfica del mapa
usando la caracterstica Client-side rendering que mencionbamos anteriormente.
29
Caractersticas Sociales
En la parte social, SharePoint ha mejorado mucho, y ms que lo har porque el 25 de junio
de 2012 Microsoft compr la red social empresarial Yammer. Concretamente para SharePoint
2013 tenemos novedades en las dos reas sociales Communities y My Sites.
Comunidades (Communities)
En SharePoint 2010 se podran crear listas de discusin para crear algo parecido a un foro
que permita debates entre los usuarios. En SharePoint 2013 sigue estando la lista de discusin,
pero tenemos dos plantillas de sitio nuevas llamadas Community Site y Community Portal.
Community Site es la plantilla de tipo foro, tan deseada. Podremos organizar discusiones
por categoras, tener moderadores, aplicar reglas, revisin de comentarios o crear insignias
de talento para motivar a los usuarios. De forma automtica, se genera una reputacin en el
contenido de los foros (cuando tiene ms votos -tpico like o me gusta-, es ms respondido, o
incluso es marcado como respuesta) y tambin habr una reputacin por miembro que ser
mayor cuanto ms activo sea dicho miembro.
Community Portal es una plantilla para obtener un resumen de todas las plantillas
Community Site, es decir, cuando tenemos muchos foros organizados en distintos sitios o
colecciones de sitio, esta plantilla nos rene informacin sobre todos los foros para que los
usuarios puedan descubrirlos y unirse a ellos. Adems, los sitios basados en esta plantilla utilizan todas las caractersticas de bsqueda empresarial ofreciendo as una buena experiencia de
usuario y un filtrado de seguridad, no permitiendo ver ciertos foros a aquellos usuarios que no
tienen permisos para verlos.
30
Figura 1-14. Community Site en SharePoint.
31
My Sites
Llamamos My Sites a las caractersticas de SharePoint que nos permite tener un espacio
privado como empleados, donde guardar nuestra informacin, aadir nuestras preferencias,
aadir a compaeros a nuestra red de colleagues o compaeros, etc.
En SharePoint 2013, seguimos teniendo estos sitios pero la interfaz grfica ha sido rediseada completamente, vase en la imagen:
Figura 1-15. My Site en SharePoint 2013.
Adems, se han introducido dos nuevas caractersticas: Microblog y Newsfeeds, que

convierten los My Sites en un entorno social muy parecido a Facebook y Twitter. Podremos
hacer cosas que probablemente ya nos suenen a todos:
-- Participar en conversaciones con nuestros amigos poniendo comentarios.
-- Compartir imgenes y enlaces.
-- Utilizar tags del estilo #palabra mediante las cuales los usuarios podrn buscar luego.
-- Mencionar a gente con @nombre.
-- Compartir, comentar y me gusta.
-- Seguir a gente, documentos, sitios y etiquetas para personalizar nuestro newsfeed.
32
Como consideracin a tener en cuenta, de forma predeterminada en SharePoint 2013,

toda esta informacin se almacena en una biblioteca en el perfil de cada usuario (cada usuario
almacena sus estados, comentarios, etc.) y adems no se va eliminando la informacin segn
un umbral de das (como pasaba en SharePoint 2010). Por este motivo, hay que hacer la planificacin del espacio en disco que puede albergar todo esto.
Aadido a esto tenemos la nueva caracterstica de Compartir Contenido que nos permite como usuarios compartir hasta nivel de tem o documento con otros usuarios sin tener
que llamar al administrador de seguridad o sin tener que conocer el modelo de seguridad de
SharePoint. En los My Site se ha rediseado la estructura y ahora no tendremos dos bibliotecas, una privada y otra pblica, sino que habr solamente una y utilizando la caracterstica
de compartir contenido, podremos dar permisos a determinados usuarios para ver algunos
contenidos. Adems, esta biblioteca estar en las opciones de Office 2013 como sitio preferido
para guardar informacin; para ello, Office 2013 tendr un servicio de eDiscovery que permitir
descubrir si cierto usuario tiene disponible un My Site.
En cuanto a desarrollo, cabe mencionar que hay cambios en los espacios de nombres, as
como algunos nuevos:
-- Microsoft.Office.Server.ActivityFeed
-- Microsoft.Office.Server.Audience
-- Microsoft.Office.Server.Infrastructure
-- Microsoft.Office.Server.Security
-- Microsoft.Office.Server.Social
-- Microsoft.Office.Server.SocialData
-- Microsoft.Office.Server.UserProfiles
-- Microsoft.Office.Server.WebControls
-- Microsoft.Office.Server.WebControls.FieldTypes
33
Tambin, al igual que en las dems reas, el equipo de Microsoft ha hecho un gran esfuerzo
para permitir que muchas de estas API estn disponibles tambin desde modelo de objetos
cliente y/o REST. Concretamente, las reas donde ms esfuerzo han hecho implementando
REST y CSOM son:
-- Social Feeds (CreatePost, LikePost, GetAllLikers, GetMentions, GetFeed, etc.)
-- Follow people (Follow, GetFollowers, GetFollowed, GetSuggestions, etc)
-- Follow content (FollowedDocumentsUri, GetFollowed, etc.)
-- User Profiles (SetMyProfilePicture, GetMyProperties, GetUserProfile, etc.)
Puesto que esto no pretende ser un libro de MSDN, para obtener ms informacin sobre los
mtodos y propiedades disponibles para cada seccin, puede visitar estos recursos: Novedades
de los sistemas sociales en SharePoint Server 2013 y Caractersticas sociales y de colaboracin
en SharePoint 2013.
Adems, en el captulo 3 se hace un ejemplo donde se accede a la API de JavaScript.
Flujos de trabajo (Workflows)

En SharePoint 2013, se ha rediseado completamente toda la infraestructura de flujos
de trabajo con el doble objetivo de implementar Windows Workflow Foundation 4 y compatibilizar estos flujos de trabajo con la Nube. Tanto es as, que el nuevo motor de flujos de
trabajo que hasta ahora estaba dentro del propio SharePoint, ahora es un motor de ejecucin
aislado llamado Workflow Manager Client 1.0, lo que implica que la comunicacin entre
SharePoint y este motor se har en base a protocolos como OAuth. Todo esto viene muy en
lnea de la aparicin de SharePoint Online, ya que se pretende estandarizar de tal forma todos
los componentes que funcionen de igual forma en SharePoint on-premise y online. Adems, el
nuevo modelo de SharePoint Apps tambin ha impulsado este cambio de arquitectura de los
flujos de trabajo, para entre otras cosas permitir esta funcionalidad en las SharePoint Apps. No
obstante, no pretendo avanzar ms en este tema, puesto que en el captulo 5 hay una seccin
exclusivamente sobre esto.
Servicios de conectividad empresarial (Business Connectivity Services)

Desde que conozco SharePoint, versin 2007 en adelante, he podido conectarlo con sistemas o repositorios externos como SAP, ERP, CRM, Bases de datos y dems LOB (Line-Of-
34
Business Systems). Cuando digo conectarlo, dejo muy abierto el abanico de operaciones que
se puede hacer sobre esa fuente externa de datos.
En SharePoint 2007, recuerdo que tenamos el BCD (Business Data Catalog) que nos permita solamente leer datos desde sistemas externos y ofrecerlos a SharePoint a modo de campo
de lista y tambin a travs del indexador de SharePoint.
En SharePoint 2010 se introducen los BCS (Business Connectivity Services) que dan soporte
tambin a la escritura en sistemas externos, adems de los tipos de contenido externos, etc.
Ahora en SharePoint 2013, la nueva arquitectura de BCS es la que se muestra en la figura:
Figura 1-16. Arquitectura de BCS (Business Connectivity Services). Imagen obtenida de MSDN de
Microsoft.
De esta imagen cabe destacar que existir por una parte toda una arquitectura BCS en
SharePoint 2013 (tal cual ocurra en SharePoint 2010, pero con mejoras) y adems una pequea
infraestructura de BCS en Office 2013.
35
En cuanto al BCS de Office 2013, permite conectar a Office directamente con fuentes
de datos externas sin tener un SharePoint por el medio. S que es verdad que a la hora de
crear el modelo o solucin de BCS, debemos asegurarnos de que es compatible con Office
2013, es decir, nos aseguramos que se implementa como lo que llaman client-side solution.
Adems, cuando instalamos Office 2013, de forma predeterminada se nos instala el Business
Connectivity Services Client Runtime que se encarga de cachear (podemos trabajar offline) y
sincronizar datos externos con Office 2013. No es objetivo de este libro entrar ms en detalle
en la parte de BCS y Office, pero se puede ver ms informacin aqu.
En cuanto a la arquitectura BCS de SharePoint tenemos las siguientes novedades:
-- Integracin con las SharePoint Apps
Podemos crear un BCS en el mbito de una SharePoint App. Qu significa esto? Pues que
ese BCS ser creado y desplegado cuando instalamos la App, y ser eliminado si la desinstalamos. Este tipo de modelo de BCS se llaman SharePoint app-scoped external content type.
Una consideracin a tener en cuenta es que el acceso a las fuentes externas definidas en este
tipo de BCS estar limitado a esta app en particular.
-- OData como fuentes de datos
En SharePoint 2010 se poda conectar desde fuentes WCF, .NET y SQL Server. Ahora, adems de estas tres, tambin se permite un origen OData. En cuanto a autenticacin en el origen
son soportados: Annimo, Bsica, Windows y usndolo conjuntamente con el Secure Store
Service de SharePoint tambin se puede una autenticacin personalizada.
Algunos ejemplos de servicios que pueden generar OData son:
SharePoint 2010
SQL Azure
Windows Azure Table Storage
Windows Azure Marketplace
SQL Server Reporting Services
Microsoft Dynamics CRM 2011
Windows Live
36
-- Event Receivers remotos

Hasta ahora no se podan asociar Event Receivers a tipos de contenidos externos, pero
en SharePoint 2013 s que se podr gracias al concepto de Event Receivers remotos. Dada la
importancia de esto y dado que tambin puede servir como sistema de alertas ante cambios
en las fuentes de origen, hay una seccin en este libro exclusiva explicando en detalle este
tipo de Event Receivers (captulo 5.2). Aclaro que las alertas tampoco estn permitidas en listas
externas de SharePoint 2010.
-- Mejoras en listas externas (External Lists)

Al igual que en la versin anterior, para poder mapear una base de datos con una lista de
SharePoint, tendremos que crear el tipo de contenido externo y despus crear la lista externa.
Este tipo de listas tiene limitaciones en comparacin con las listas normales de SharePoint. En
la versin de 2013 han introducido una serie de mejoras:
Mejor rendimiento en el renderizado de listas debido a que se realiza un paginado,
filtrado y ordenamiento antes de obtener los datos. De este modo, vienen los datos ya
ordenados, filtrados y solamente los de la pgina que toque. Me parece que esto debera
de haber sido as desde el principio.
Se puede establecer el lmite de elementos que se muestran por pgina.
Capacidad de filtrado en columnas avanzada. Con esto podemos definir a nivel
de base de datos cmo queremos que sea el filtro, siempre que luego lo indiquemos en
el BCD Model.
Ordenamiento en las columnas. Se pueden definir ordenamientos que afectarn a
todo el conjunto de datos y no solamente a los datos parciales obtenidos.
Exportar a Excel. Se puede exportar una lista externa hacia Excel 2010 y 2013.
-- BCS en SharePoint Online

En Office 365 para empresas, el mdulo de SharePoint Online incluye BCS. En la versin de
2013 se podr obtener informacin desde las fuentes de datos: WCF services, SQL Azure Data
Services, OData Endpoints y servicios web.
37
-- Acceso desde plataforma mvil con los servicios REST

Comparto algunos enlaces en los que se hace uso de esta caracterstica, para aquellos que
quieran profundizar en este tema:
Referencia a BCS REST API para SharePoint 2013.
Acceder a datos externos desde cdigo JavaScript usando los servicios REST.
-- CSOM - Modelo de Objetos Cliente .NET

Tambin podremos utilizar modelo de objetos cliente para BCS.
La referencia completa de programacin con BCS para desarrolladores de MSDN la pueden ver aqu.
38
Bsqueda empresarial
Una de las novedades ms importantes de SharePoint 2013 es la bsqueda empresarial. Es
que, claro, una cosa es bsqueda como la conocemos en entornos de Internet (Bing, Google,
etc.) y otra cosa muy distinta es un motor de bsqueda empresarial que tiene que cumplir con
necesidades especficas de cierto empleado y normalmente de manera urgente.
Adems de esto, por el simple hecho de tener un motor de bsqueda en el interior de un
firewall, debemos tener en cuenta varios aspectos importantes:
-- Seguridad. En una red empresarial, los recursos a los que cada empleado tiene acceso
dependen del rol y los permisos de cada uno. Esto es muy importante tenerlo en cuenta en un
sistema BE.
-- Diferentes tipos de ficheros. PDF, DOC, DOCX, PPT, PPTX, ZIP, HTML, RDL, BD con formato propio,
-- Distintos repositorios. Bases de datos, intranets corporativas (SharePoint,), carpetas
de red compartidas, correo electrnico (Exchange, ), ficheros de Excel, sistemas de archivos,
servidores web, Lotus Notes, Sistemas ERP, Sistemas CRM,
-- Combinacin de informacin estructurada y no estructurada. Existe informacin
estructurada en bases de datos, listas, libros de Excel, etc Pero tambin informacin en pginas web, vdeos, documentos, etc que est totalmente desestructurada. Adems, muchas
veces existe relacin entre los distintos tipos de informacin, por lo que otro reto es el de
combinar toda esta informacin de la forma ms adecuada.
-- Vocabularios y taxonomas propias. Una de las ventajas es que la mayora de las bsquedas tendrn un mbito concreto de la empresa.
-- Fechas de los documentos. Fecha de creacin, fecha de anlisis de un informe, fechas
que estn dentro de los documentos,
-- Bsqueda de un documento concreto. Si comparamos con la bsqueda en Internet,
en la cual la mayora de las veces el usuario no sabe lo que est buscando, en la bsqueda
empresarial, el usuario muchas veces busca cierta documentacin que sabe de su existencia,
puesto que ya la consult en el pasado, pero no recuerda exactamente donde estaba almacenada. Un sistema de bsqueda empresarial debe aprovechar este aspecto.
-- Personalizacin del modelo de relevancia. En la bsqueda en Internet no tiene sentido
hablar de personalizar el modelo de relevancia para ciertos casos, ya que suele ser propietario,
39
pero en sistemas de bsqueda empresarial es muy habitual que las empresas puedan adaptar
el modelo de relevancia a sus necesidades.
Microsoft ha dado la importancia que requiere a este tema y en SharePoint 2013 ha integrado la bsqueda de FAST para SharePoint 2010 dentro del ncleo de bsquedas. S, en otras
palabras, no habr que comprar este producto aparte si queremos disfrutar de sus ventajas.
Cabe decir que no es una integracin directa, sino que se ha rediseada toda la arquitectura, pero teniendo en cuenta aquellos factores de FAST que proporcionan mejoras indudables.
Veamos cul es la nueva arquitectura de bsqueda:
Figura 1-17. Arquitectura de Bsqueda Empresarial en SharePoint 2013.
1. Componente Rastreador (Crawler)

Este componente es responsable de rastrear el contenido que proviene desde distintas
fuentes de informacin. Invoca a los conectores y manejadores de protocolos adecuados para
cada fuente de datos.
40
Importante: podemos desarrollar nuestros propios conectores

personalizados Ms informacin: Marco de conectores de bsqueda en SharePoint 2013.
La base de datos de Crawl (A) se utiliza para almacenar informacin sobre los elementos
rastreados y el historial del rastreo (tiempo del ltimo rastreo, Id del ltimo rastreo,)
2. Componente de procesamiento de contenido (Content Processing)
Procesa los elementos rastreados y los pasa al componente de indexacin. Aqu es donde
se usan los iFilters para hacer el parsing de los documentos. En SharePoint 2013 sigue pudindose extender los Format Handlers y crear un propio iFilter.
Realiza una serie de procesos como: creacin de tokens, deteccin de lenguaje, extraccin
de entidades, stopwords, stemming o lematizacin, etc.
Escribe informacin en la base de datos de Links (B) para formar un Web Graph y poder
usarlo en el modelo de ranking. Es decir, utiliza el mismo concepto que los motores de bsqueda de Internet para mejorar el ranking de resultados.
Adems, tambin genera variaciones fonticas para la bsqueda de personas.
3. Componente de procesamiento de analticas (Analytics Procesing)
Analizan los elementos rastreados y cmo los usuarios interaccionan con los resultados de
bsqueda (Analytics Reporting Database - C). Por ejemplo, cuando un usuario ve una pgina,
ese evento se recoge en el Event Store y este componente puede usar esto para analizar comportamientos y mejorar el ranking consecuentemente.
Podemos crear nuestros propios eventos personalizados.
Tambin utiliza la base de datos de Link (B) para combinar esta informacin con la informacin
de uso y obtener as mejoras para el algoritmo de ranking.
Concretamente se realizan los siguientes anlisis:
-- Search Analysis
Link and Anchor Text Analysis
Click Distance
41
Search Clicks
Deep Links
Social Tags
Social Distance
Search Reports
-- Usage Analysis
Recommendations
Usage Counts
Activity Ranking
4. Componente de indexacin (Index Component)
Se encarga de obtener los elementos rastreados y procesados, y escribirlos de forma adecuada en los ficheros de ndices.
Tambin recibe las consultas de usuario en un formato compatible y comparable con el
formato en que se almacenaron lo elementos. De esta forma, es capaz de comparar la consulta
del usuario con todos los documentos que tiene almacenados en el ndice y devolver el conjunto de documentos (resultados) ms adecuado.
5. Componente de procesamiento de consulta (Query Processing Component)
Realiza el procesamiento lingstico en tiempo de consulta (word breaking, stemming,
query spellcheking, expansin de la consulta -thesaurus-).
Utiliza el modelo de similitud para convertir y adaptar la consulta en un formato adecuado
y comparable con los documentos que existen en el ndice.
Optimiza la precisin y relevancia del motor de bsquedas
Decide cuales de las Reglas de Consulta (nuevo trmino) son aplicables.
Devuelve a la aplicacin cliente los resultados de bsqueda
6. Administracin de bsqueda (Search Administration)
Responsable del aprovisionamiento y cambios en la topologa de servidores de bsqueda.
42
Responsable de la coordinacin de los distintos componentes mencionados anteriormente.

La base de datos de Admin Search (D) almacena informacin sobre:
-- Topologa
-- Crawl Rules
-- Query Rules
-- Managed Properties Mappings
-- Content Sources
-- Crawl Schedules
-- Configuraciones de Analytics
A nivel informativo, los procesos de bsqueda son:
-- Host Controller: Servicio de Windows que supervisa los procesos NodeRunner.
-- NodeRunner.exe: Proceso que contiene los componentes de bsqueda (uno por cada
componente: Crawl, Content Processing, Query, Index, Analytic). Puede haber ms de uno por
servidor.
-- MSSearch.exe:
Windows
Service
que
contiene
el
componente
de
Crawl.
Consejo. Cuando estamos en un entorno de desarrollo, y queremos desarrollar algn tipo de aplicacin referente con el uso de la bsqueda, hay que
tener en cuenta que el proceso noderunner.exe consume gran cantidad de
recursos. Para reducir un poco la cantidad de recursos que consume se puede:
1. Ejecutar PowerShell:
Set-SPEnterpriseSearchService PerformanceLevel Reduced
2. Ir al archivo de configuracin c:\Program Files\Microsoft Office

Servers\15.0\Search\Runtime\1.0\noderrunner.exe.config y cambiar el valor
de <nodeRunnerSettings memoryLimitMegabytes=0>
3. Reiniciar el servicio SharePoint Search Host Controller
43
En lo que a novedades exclusivas de desarrollo se refiere tenemos tambin una lista de

cosas:
Sintaxis de consulta SQL eliminada

Es decir, que ahora para lanzar una consulta al motor de bsquedas desde el modelo de
objetos, tendremos que recurrir o bien a KQL (Keyword Query Language) o bien a FQL (FAST
Query Language); este ltimo se introduce debido a la integracin de FAST que comentaba
antes.
Servicio Web de Bsqueda Obsoleto

El tpico servicio web http://servidor/sitio/_vti_bin/search.asmx queda como obsoleto en
SharePoint 2013 , esto no significa que no funcione, ya que por temas de compatibilidad con
aplicaciones ya creadas si que funciona, pero si ests desarrollando una aplicacin que requiere
de acceso al motor de bsquedas evita usar este servicio web y utiliza en su lugar o bien el
modelo de objetos cliente o la API REST (_api).
Programacin con aplicaciones cliente

Podemos tener una aplicacin dentro del servidor de SharePoint para invocar al modelo
de objetos de servidor de SharePoint y hacer aplicaciones personalizadas de bsqueda o que
utilizan la bsqueda. Pero esto en la mayora de los casos no sirve, y necesitamos acceder al
motor de bsqueda desde fuera. Para ello, tenemos dos posibilidades en SharePoint 2013 :
utilizar el modelo de objetos cliente en caso de que nuestra aplicacin sea .NET o Web basada
en llamadas de JavaScript; o la API REST en caso de tener una aplicacin de mvil, o de cdigo
de servidor en tecnologas no .NET, como Java, PHP, Cocoa, Flash, etc. Concretamente, para
la bsqueda tenemos muchas novedades en este apartado, pero como estn perfectamente
descritas en MSDN, os comparto los enlaces:
- Modelo de objetos cliente de Bsqueda en SharePoint 2013.
- API REST de Bsqueda en SharePoint 2013 (en ingls).
44
Otras novedades
Existen ms novedades en este campo como la inclusin de los operadores NEAR, ONEAR
y XRANK en el KQL. Tambin la posibilidad de desarrollar un proceso personalizado en el procesamiento de contenido del indexador.
Adems de todo el rediseo que se ha hecho a nivel de administracin y configuracin con
los Result Types, Query rules, Result Sources, etc. No es objetivo de este libro comentar estos
temas, pero puede obtener ms informacin: Novedades de Bsqueda en SharePoint 2013.
En el captulo 3 de este libro hay un ejemplo de uso del modelo de objetos cliente .NET de
bsqueda en el que se hace una consulta al motor de bsquedas usando la clase KeywordQuery.
Dispositivos mviles
En SharePoint 2013 hay nuevas caractersticas referentes a los dispositivos mviles, no
solamente en cuanto al desarrollo, sino que tambin hay mayor soporte nativo para mviles.
Podemos dividir las novedades en secciones:
Interfaz grfica
A nivel de cmo se muestran los contenidos de SharePoint en un dispositivo mvil se ha
implementado una vista nueva llamada Vista contempornea, que se aade a las dos existentes en SharePoint 2010:
Vista clsica. La misma que en SharePoint 2010.
Vista contempornea (Contemporary View). Vista optimizada para HTML5 soportada
para Mobile Internet Explorer 9.0 para WP 7.5 en adelante, Safari 4.0 para iOS 5.0 en adelante
y Android 4.0 en adelante.
Vista Pantalla completa. Vista de SharePoint normal usada para escritorio.
45
Figura 1-18. Vistas mviles disponibles en SharePoint 2013. Imagen obtenida de MSDN de Microsoft.
Puede ver ms informacin sobre los navegadores soportados en SharePoint 2013.
Office Web Apps en mviles

En SharePoint 2010 Office Web Apps se instalaba como un componente integrado en
SharePoint, el cual ofrece vistas desde el navegador de escritorio y mvil para Word, Excel y
PowerPoint. Ahora, en SharePoint 2013, Office Web Apps pasa a ser un producto separado
que requiere instalarse en un servidor aparte, no obstante, sigue pudindose integrar con
SharePoint 2013 ofreciendo los visores llamados Word Mobile Viewer, Excel Mobile
Viewer y PowerPoint Mobile Viewer los cuales estn optimizados para ver documentos
de Office desde el navegador del mvil, sin tener que descargar el propio fichero al dispositivo
mvil.
Notificaciones y alertas desde listas de SharePoint

SharePoint 2013 da soporte a las notificaciones para las aplicaciones mviles, es decir,
que cuando se aade o modifica algn elemento de una lista de SharePoint en la aplicacin
del mvil recibiremos una alerta. Adems, tambin se puede configurar una cuenta de mvil
46
en SharePoint 2013 para permitir a los usuarios suscribirse para recibir un SMS ante cualquier
cambio en una lista de SharePoint.
No es objetivo de este libro adentrase en esto, sin embargo, comparto contigo algunos
recursos interesantes:
- Configurar cuentas de mvil en SharePoint 2013.
- Configurar y usar Push Notifications en SharePoint 2013 apps para Windows Phone.
Contenido de inteligencia de negocio desde iPad

SharePoint 2013 permite a los usuarios de iPad poder ver ciertos tipos de contenidos de
PerformancePoint y Excel Services. Para profundizar en esto, tienes este recurso: Visualizacin
de informes y cuadros de mandos en dispositivos Apple iPad.
Geolocalizacin en aplicaciones mviles

En un apartado anterior, comentaba las novedades de SharePoint 2013 en lo que a geolocalizacin y mapas se refiere. Debemos decir que en las aplicaciones mviles para SharePoint
2013 tambin tendremos disponible el tipo de columna o campo location. Ms informacin
en: Uso del tipo de campo de ubicacin de SharePoint 2013 en aplicaciones mviles y Cmo
integrar mapas de SharePoint 2013 con aplicaciones de lista de Windows Phone.
Cmo se desarrollan aplicaciones de Windows Phone para SharePoint 2013?

Para empezar, se necesita tener Visual Studio con el SDK de Windows Phone instalado. Es
importante saber que esta plataforma requiere Windows Vista SP2 o Windows 7. Esto quiere
decir que no se puede instalar todo este SDK de desarrollo para Windows Phone sobre un
Windows Server. As que el entorno ideal de desarrollo sera: dos mquinas, una con SharePoint
2013 sobre Windows Server y la otra con Windows 7 con Visual Studio y el SDK de Windows
47
Phone instalado. Para profundizar en este tema puede ver Cmo configurar un entorno para
desarrollar aplicaciones mviles para SharePoint.
ECM (Enterprise Content Management)

SharePoint 2013, al igual que las versiones anteriores, tiene un ncleo muy fuerte en lo
que se refiere a la gestin documental empresarial, tambin llamada Enterprise Content
Management.
Como principales novedades en este mbito tenemos:
eDiscovery
Se habla mucho de esta caracterstica en SharePoint 2013, y a primera vista lo asociamos
con algo futurista que nos permitir descubrir ciertos patrones al estilo de cmo se hace con
minera de datos. El objetivo real de esta nueva caracterstica (o al menos uno de ellos) es actuar
como lo haca en SharePoint 2010 la caracterstica Records Management, es decir, ayudar a
proteger a tu negocio, preservando todo el ciclo de vida de los records, que son activos de una
organizacin que deben ser almacenados para cumplir ciertos requerimientos legales.
Poniendo todo esto sobre la tierra, algunas empresas necesitan almacenar cierta documentacin para tenerla visible ante algunas inspecciones legales recurrentes. Esta informacin
puede que la tengan distribuida a lo largo de la(s) intranet(s) corporativa(s) y no hay una persona que sepa dnde est todo, a no ser que se dedique exclusivamente a ello. Aadido a todo
est tambin que esta documentacin se requiere mantenerla durante una cantidad exacta
de tiempo, por ejemplo unos meses, un ao, dos aos, depende del caso. Tambin est la
problemtica que a veces se requiere cierta versin de los records, pero tambin se quiere que
pueda ser modificado. Ante esto, lo lgico es pensar pues hago una copia del documento y
sigo trabajando con ella, pero claro, dnde lo guardo?, cmo aviso a todos los involucrados? Vaya marrn no? En SharePoint 2013, eDiscovery viene a cubrir todas estas necesidades.
Veamos un resumen de cmo lo hace:
El centro de eDiscovery
Un nuevo tipo de plantilla de coleccin de sitios que permite gestionar todos los casos de
eDiscovery.
48
Proceso de eDiscovery en SharePoint 2013
Figura 1-19. Proceso de eDiscovery en SharePoint

2013. Imagen obtenida de TechNet de Microsoft.
Cuando se recibe una peticin de eDiscovery o de Record Management, lo que haces es

ir al sitio creado con la plantilla de tipo eDiscovery y crear un eDiscovery Case, llammosle
un caso.
Al caso definido, se le asocia un conjunto de fuentes de origen, filtros, y holds (documentos que queremos preservar tal cual estn). Respecto a los holds, decir que en SharePoint
2010 se permitan marcar los documentos como hold, lo cual pona ese documento como solo
lectura y los usuarios no podan seguir haciendo cambios sobre ellos. Ahora en SharePoint
2013 , se introduce el concepto de in-place holds que permiten mantener una copia intacta
del documento que se ha marcado como hold, pero a su vez permite que los usuarios puedan
seguir modificndolo. Para ello, y con el objetivo de ahorrar todo el espacio en disco que se
pueda, lo que SharePoint hace es crear una biblioteca llamada preservation hold library
(que solamente es visible para site collection admins) y guardar en ella aquellos documentos a
los que se les hace algunas modificaciones desde el momento que se marcan como in-place
holds.
En la parte de del diagrama de arriba, cabe destacar el concepto de Team Folders que proporcionan una interfaz comn para los documentos encontrados tanto en SharePoint, como en
Exchange, incluso le podemos asociar una direccin de correo electrnico a una Team Folder.
Siguiendo el flujo, aparte de hacer el conjunto de definicin de nuestro caso de eDiscovery,
tambin definimos la consulta final y cmo ser el conjunto de documentos, listas, pginas, y
49
objetos de Exchange exportados para la liberacin del caso. Adems, la exportacin se hace
siguiendo el formato de acuerdo a EDRM (Electronic Data Reference Model). Ms informacin:
Informacin general sobre la exhibicin de documentos electrnicos y las suspensiones en
contexto en SharePoint Server 2013.
Hablando un poco ms de los orgenes permitidos para esto cabe destacar que eDiscovery
hace uso (es requisito) del motor de bsquedas de SharePoint Search. As que, permite utilizar
los Result Sources que son algo parecido a los Content Source mezclados con Federacin.
Es decir, las fuentes de datos como carpetas compartidas, sitios de SharePoint, web pblicas,
Documentum, etc.
El objetivo de este proceso, como comentbamos antes, es exportar informacin filtrada
y relevante para auditores externos u otro tipo de usuarios que requiera cierta informacin de
nuestra empresa basada en unos patrones.
Por supuesto, las caractersticas de Record Management de SharePoint 2010 siguen estando
soportadas, vea ms informacin: Novedades en Record Management para SharePoint 2013.
50
WCM (Web Content Management)

Como bien sabemos, SharePoint tambin puede actuar como sistema de contenidos web,
para ello se define el tipo de plantilla de publicacin, las caractersticas de publicacin, etc. En
SharePoint 2013, tenemos buenas noticias en esta parte, ya que se ha hecho un gran esfuerzo
en conseguir que SharePoint cada vez sea un WCM mejor valorado. Veamos las principales
mejoras:
Gestor de diseo (Design Manager)

Con SharePoint 2013, se introducen tambin cambios que afectan al diseador de
SharePoint, es decir, las personas encargadas de crear todo lo referente a branding, HTML, CSS,
etc. El gestor de diseo proporciona un paso a paso de todos los artefacto s necesarios para
personalizar el diseo de SharePoint. Adems, tambin tendremos la posibilidad de crear el
diseo desde herramientas ms orientadas al diseo, como Dreamweaver, y poder luego subir
los archivos HTML y CSS a SharePoint, de forma que SharePoint 2013 lo transforma en la
estructura de master pages, layouts, etc. Vase en la Figura 120 los pasos que se realizaran
para construir un diseo de SharePoint con el gestor de diseo:
Figura 1-20. Pasos del

gestor de diseo de
SharePoint 2013.
No vamos a entrar en detalle en esta parte, ya que no es el objetivo de este libro. Para ms
informacin puedes ver: Desarrollando el diseo del sitio en SharePoint 2013. No obstante, en
el captulo 3 se entra muy en detalle respecto a maquetacin y diseo dentro de las SharePoint
Apps.
51
Sitios dirigidos por las bsquedas

Una de las caractersticas de las que prescinda SharePoint 2010 es poder orientar un
sitio pblico hacia el eCommerce o comercio electrnico, sin tener que hacer un trabajo de
desarrollo considerable. Ahora, en SharePoint 2013 , se introduce la plantilla de coleccin de
sitios llamada Product Catalog, que nos va a permitir de forma fcil que nuestro sitio de
productos pueda actuar como una coleccin de elementos a clasificar por distintas categoras,
de los cuales vamos a querer tener vistas de un conjunto de productos filtrados, as como vista
de elementos particulares. A este tipo de sitios se les llama sitios dirigidos por las bsquedas,
aunque yo los identifico mejor como sitios de comercio electrnico o incluso sitios de catlogo
de productos.
Los elementos clave de este tipo de sitios son:
-- Pgina maestra (igual que la de publicacin).
-- Diseo de pgina. Destacamos dos:
o Categora: para ver un conjunto de productos en modo de agrupaciones o
filtrados.
o Vista de elemento: para ver la pgina de detalle de un elemento o producto
concreto.
-- Pginas: creadas en nuestro sitio usando la pgina maestra y seleccionando un diseo
de pgina de los de arriba.
-- Search-driven Web Part: el nuevo Content Search Web Part que permite obtener
elementos de una consulta al motor de bsquedas y aplicarle un estilo de forma fcil.
o Display Templates (o plantillas de visualizacin): doble objetivo de controlar
las propiedades que se mostrarn para los resultados de la bsqueda y tambin
aplicarle un estilo de acuerdo a nuestro branding.
Control Display Templates: para definir el estilo y diseo del conjunto
completo de productos, as como la paginacin, ordenamientos, etc.
Item Display Templates: donde se definen los estilos y diseo para un
tem concreto en la coleccin de productos.
52
Figura 1-20. Configuracin del

Content Search Web Part de
SharePoint 2013. Imagen obtenida de MSDN.
Figura 1-22. Control Template para el Content Search Web Part.

Imagen obtenida de MSDN de Microsoft
53
Figura 1-23. Item Template para el Content Search Web Part. Imagen
obtenida de MSDN de Microsoft.
Catlogos y publicacin entre colecciones de sitios

Como en todas las nuevas versiones, se definen nuevos trminos que no son difciles, pero
que si no se conoce su definicin formal, o el objetivo por el que fueron creados, no se llegan
a entender del todo bien. Esto me pas con el trmino Catlogos de SharePoint 2013. Y es
que los catlogos son listas o bibliotecas compartidas que sirven para poder publicar contenido entre colecciones de sitio. En la seccin anterior he definido la estructura bsica de un
sitio dirigido por bsquedas que hace uso de un catlogo para ello. Pero aqu juntamos dos
conceptos, por una parte catlogo como representacin visual de cara a realizar un sitio de
eCommerce en Internet, y por otra parte, catlogo como medio para compartir contenido
entre colecciones de sitios, que es a lo que me refiero ahora. Esta caracterstica se denomina
Publicacin Cruzada o Cross-Site Publishing (XSP) en ingls. Existe una API especfica para
esto en SharePoint 2013.
54
Mejoras en SEO (Search Engines Optimization)

ste es uno de los aspectos donde se han hecho ms progresos, bajo mi punto de vista.
La verdad es que cuando instal SharePoint 2013 y vi la cantidad de novedades de SEO
(Search Engine Optimization) que tena, me qued sorprendido. Las capacidades WCM (Web
Content Management) de SharePoint 2010 haban mejorado respecto a la versin 2007, pero
en lo que a SEO se refiere, se haba quedado como materia pendiente. Pero todo llega, ya
tenemos SharePoint 2013 que es mucho ms WCM.
Para ms informacin acerca de las novedades en SEO, te recomiendo visitar el siguiente
post del blog del equipo de SharePoint de SolidQ: Novedades en SEO para SharePoint 2013.
Cambios en multimedia
Cuando estamos creando pginas web que van a ser publicadas en Internet, debemos ser
muy cuidadosos con el contenido multimedia, concretamente con el tamao de las imgenes,
publicacin de los vdeos, integracin con YouTube, etc. SharePoint 2013 tiene mejoras en este
aspecto tambin. Vemoslas:
-- Image Renditions. Consiste en que por cada imagen o vdeo que subimos a SharePoint,
sta se almacena teniendo en cuanta una serie de dimensiones que previamente el administrador ha establecido. Con esto conseguimos que cuando insertamos una imagen en una pgina
podamos decidir las dimensiones de sta.
o Los tipos de imgenes soportados son: gif, jpg, jpeg, jpe, jfif, bmp, dib, png,
tif, tiff, ico, wdp y hdp. Y los tipos de vdeos soportados son: wmv, wma, avi,
mpg, mp3, mp4, asf, ogg, ogv, oga y webm.
-- Mejoras en el vdeo. Aparte de lo mencionado en el punto anterior, tenemos tambin

la capacidad de incluir vdeos externos como YouTube y tambin la generacin automtica de
thumbnails.
Navegacin administrada (metadatos administrados)

Uno de los cambios sorprendentes es el tema de la navegacin, ya que hasta ahora
dependa de los sitios, subsitios, pginas y algn enlace a medida que pudisemos introducir.
En SharePoint 2013, se puede configurar para que la navegacin sea administrada, es decir,
mediante metadatos administrados. Esto no quiere decir que tenemos que ir creando toda
55
la estructura de navegacin a mano. El funcionamiento ser parecido, ya que cuando creamos

un sitio automticamente se nos crea el metadato administrado para la navegacin. Vamos,
que no nos va a traer complicaciones, sino ventajas, ya que podremos cambiar la URL a nuestro antojo (y esto es bueno a la hora de definir buenas URL para SEO). Adems, para el caso
concreto de eCommerce que comentbamos anteriormente, nos viene bien, ya que podremos
hacer URL distintas para las distintas categorizaciones, por ejemplo, en caso de una tienda de
electrodomsticos: /frigorficos, /lavadoras, /hornos, etc.
Otras novedades
Adems de todas las mencionadas anteriormente, tenemos ms novedades a las que no
entraremos en detalle por quedarse fuera del mbito de este libro. Pero no por ello dejaremos
de mencionarlas y dejar un enlace con ms informacin para los curiosos:
Nuevas aplicaciones de servicio

o Machine Translation Services. Encargado de hacer traduccin automtica.
o PowerPoint Automation Services. Conversin de .ppt y .pptx hacia otros
formatos.
o Mejoras en Access Services 2013.
Novedades en inteligencia de negocio para SharePoint 2013

En la parte relacionada con inteligencia de negocio tambin hay bastantes novedades
sobre todo para Excel Services, Visio Services, PerformancePoint Services, etc. No entraremos en detalle en ellas en este libro, pero si tenemos curiosidad, tenemos ms informacin:
Novedades de Inteligencia de negocio en SharePoint 2013.
56
Conclusiones
A lo largo de la evolucin de SharePoint, hemos ido observando como el equipo de
Microsoft en cada versin nueva del producto ha puesto el foco en ciertos componentes. Por
ejemplo, en SharePoint 2007 el foco de novedades estuvo de cara del desarrollador, concretamente todo el sistema de caractersticas (features) y soluciones. Ms adelante, para SharePoint
2010, el principal foco fue la arquitectura de servicios ms escalable y tolerante a fallos, por lo
que fue ms orientado haca el profesional IT. Finalmente, en esta nueva versin observamos
que el foco de novedades se centra en el usuario, puesto que se han rediseado todo de cara
a seguir las guas de estilo Windows 8 Metro y obtener as una mejor experiencia del usuario.
Con esto no quiere decirse que en los dems campos no hayan novedades, como habis ido
observando en este captulo, s las ha habido. Lo que quiero dejar como conclusin es que
Microsoft est escuchando al usuario final en este sentido y esto siempre es buena noticia para
todos.
A todo esto aadir que tambin tenemos disponible una serie de webcasts mostrando
la novedades de Office 2013 y concretamente uno en el que se muestran las novedades de
SharePoint 2013, puede verlo aqu.
57
Captulo 2: Introduccin a las SharePoint Apps
En este captulo dedicado a las nuevas apps de SharePoint vamos explorar de forma terica
los fundamentos de este nuevo modelo, desde su concepcin hasta el despliegue, pasando por
todos los tipos y clases de apps que seremos capaces de desarrollar con las herramientas que
nos ofrece SharePoint 2013.
En esta versin, Microsoft ha hecho el mayor esfuerzo nunca visto hasta ahora por unificar
todas las plataformas de colaboracin bajo un mismo lanzamiento, propiciando una mayor
compenetracin entre todos sus productos. Empezando por SharePoint y acabando por Office
y Lync, esta vez SharePoint estar completamente alineado en el tiempo en ambas plataformas,
online y on premise.
Pero antes de esto, comencemos situndonos en contexto con una introduccin sobre el
desarrollo de aplicaciones para SharePoint en sus ltimas versiones.
Introduccin. El desarrollo sobre SharePoint a lo largo de

los tiempos
Me inici en esto del desarrollo sobre la plataforma SharePoint en la primavera del ao 2007,
en aquel momento la versin del producto que estaba en el mercado era Microsoft Office
SharePoint Server 2007 o en su versin reducida y gratuita Windows SharePoint Services
3.0, adems, tena algn viso de integracin con Office 2007 aunque limitado y con una gran
cantidad de hndicaps por la escasa documentacin y la gran cantidad de errores que tena
en aquel momento por ser una tecnologa joven ( joven porque era tan solo la tercera versin
del producto, precedida por la 2001 y la 2003, que fue la que de alguna manera sent ciertas
bases en torno al producto).
En aquel tiempo (tiempos de SharePoint 2007) solo haba una manera oficial de desarrollar aplicaciones para SharePoint; es lo que comnmente se llamaban soluciones, que en
la mayora de los casos constaban de Web Parts y/o controles de ASP.NET 2.0. sta era la
58
manera de extender esa plataforma de gestin de contenidos increblemente grande y, dado el

potencial de la plataforma ASP.NET, las posibilidades eran prcticamente ilimitadas. Eran tiempos de programar Web Parts a ojo, sin utilizar diseadores grficos (que ya existan para la
plataforma ASP.NET pero no para las Web Parts), directamente desde el cdigo C# o VB haba
que inyectar cdigo HTML con las clases todo mezclado. El modelo de despliegue y las restricciones de seguridad de la plataforma hacan de cada despliegue prcticamente una maniobra
de guerra, en la que no hacer una copia de seguridad del servidor, etiquetar una rama en el
repositorio y dems acciones preventivas no eran una opcin, sino una necesidad imperiosa
para no morir en el intento.
En cualquier caso, eran tiempos divertidos, el problema era que no haba lmites, que
tocando un XML de polticas o insertando una DLL en la GAC del servidor podamos violar
todas las normas de seguridad del servidor de un banco sin darnos apenas cuenta de lo que
habamos hecho. Y estos problemas en la confiabilidad de las aplicaciones, y sobre todo de
su ilimitada capacidad de accin sobre un servidor en determinadas circunstancias nos acab
llevando al modelo de desarrollo de SharePoint 2010.
Microsoft SharePoint Server 2010 Standard/Enterprise y Microsoft SharePoint
Foundation 2010 en su versin gratuita, stas son las tres versiones que Microsoft present
con el lanzamiento de SharePoint 2010. En su versin 2010, SharePoint trajo un modelo de
desarrollo nuevo que intentaba paliar los problemas de seguridad que presentaba el modelo
absoluto que presentaba SharePoint 2007. Este modelo de SharePoint 2007, que segua siendo
un modelo perfectamente soportado en su versin 2010, se pas a llamar soluciones de granja
o en ingls farm solutions, nombre muy acertado ya que las soluciones desplegadas de esta
manera tienen capacidad para acceder a prcticamente a todos los recursos de la granja de
servidores con la nica restriccin de los permisos de usuario, sorteable, por otra parte, por el
propio desarrollador de la solucin. Esta parte trajo grandes novedades en cuanto al desarrollo
en capas; al fin tenamos la parte de presentacin separada de la lgica, como cualquier otro
desarrollador en ASP.NET y todo gracias a las Visual Web Parts, un hbrido que consista en
una Web Part que cargaba un control de usuario de .NET. Pero esto es solo un ejemplo de las
mejoras lineales razonables que se espera de una nueva versin. Hablemos de la extensin del
modelo de desarrollo.
Tambin hicieron su aparicin las comnmente llamadas sandbox solutions o en espaol
soluciones de espacio aislado, que como bien indica el nombre fueron un nuevo tipo de
solucin incluido en la versin 2010 que ejecutaba su cdigo (cdigo de la API de servidor de
SharePoint al igual que en el resto de soluciones) en una caja aislada del resto de procesos
del servidor SharePoint. Estas soluciones, aunque mucho ms restrictivas en las posibilidades
de ejecucin, trajeron consigo una gran flexibilidad en cuanto a instalacin y despliegue. Tan
solo subiendo un archivo de solucin a una biblioteca de soluciones gestionada por un administrador de coleccin de sitios, ya tenas disponible dicha solucin. Adems, este tipo de
soluciones son fcilmente gestionables por el administrador de coleccin de sitios, y permitan
59
poner lmites a los recursos del servidor que consumen, de forma que sea prcticamente imposible que una solucin aislada de este tipo tire abajo todo el servidor.
Una de las principales razones para el uso de este tipo de soluciones aisladas es la posibilidad de desarrollar para SharePoint Online incluido en Office365, s, la tan recurrente nube
pblica en su versin SharePoint. Pero esto ha sido claramente insuficiente para equiparar
las versiones online (en la Nube) y on premise (en servidores cuya administracin queda de
nuestro lado), y estas diferencias pretenden hacerse cada vez ms y ms pequeas con cada
versin de SharePoint.
Adems, otra de las razones por las que el modelo de soluciones para SharePoint es insuficiente para el actual mercado, es la falta de un modelo claro de comercializacin. Es decir, el
llamado marketplace de aplicaciones que se utiliza con un gran xito en diversas plataformas
mviles con un rotundo xito. Este modelo, en el cual una persona puede acceder a cualquier
aplicacin, descargarla e instalarla en su sistema sin miedo a que dae la plataforma gracias a
una serie de certificaciones que ha tenido que pasar previamente a su publicacin en la tienda
de aplicaciones. Sin un modelo robusto como ste en el que marketing, calidad y distribucin
queden completamente homogeneizadas para la plataforma, se haca difcil la unificacin de
plataformas online y on premise.
Estos dos ingredientes, el modelo de comercializacin, as como el modelo de despliegue
y ejecucin aislados es lo que nos lleva a la versin actual del producto SharePoint 2013 y a
su tercer y nuevo modelo de programacin para esta versin, el llamado Cloud App Model
(literalmente, modelo de aplicaciones en la Nube).
SharePoint 2013 y su nuevo modelo de aplicaciones

SharePoint 2013 nos trae un modelo de aplicaciones en la Nube que nos permite crear
apps. Las apps para SharePoint, desde un punto de vista funcional, son piezas aisladas de funcionalidad que extienden las caractersticas de un portal SharePoint. Han sido concebidas para
que sean fciles de utilizar, consuman pocos recursos del servidor que las utiliza y sobre todo
para que resuelvan una necesidad especfica de los usuarios.
En este contexto, se crea un ecosistema para los usuarios de la plataforma Office 3651 en
el que las distintas aplicaciones de Office son extensibles a travs del Office Store (SharePoint y
Office Apps). Pero antes de meternos en la materia principal de este libro que son las SharePoint
1 De ahora (2012) en adelante, Microsoft llama Office 365 al conjunto de productos Office que o bien estn
exclusivamente en la Nube o bien se instalan desde la Nube, por lo tanto, cabe tener en cuenta que este trmino
ahora engloba tanto al Office tradicional como a Lync Online, Exchange Online y SharePoint Online.
60
Apps, voy a explicar brevemente lo que son las Office Apps y por qu las SharePoint Apps pueden integrarse con las mismas, haciendo nuestro trabajo sobre SharePoint Apps el doble de
til.
Desde un punto de vista de un desarrollador clsico de SharePoint, las SharePoint Apps
podramos decir que se reducen a una Web Part con algunas consideraciones especiales de
aislamiento respecto al servidor en el que estn instaladas. Dado que no son ms que un trocito
de web, podemos acceder a alguno de sus componentes desde otros visores de web. Y aqu
es donde entran las Office Apps, Qu son las Office Apps?, para el usuario, desde un punto
de vista funcional, las Office Apps son aplicaciones que extendern la funcionalidad de Office,
ya sea interactuando con los datos de su documento o con recursos externos, como pueden
ser los mapas de Bing o cualquier otra aplicacin web. Bien, pero desde un punto de vista ms
tcnico, Qu son en realidad?, pues no son ms que navegadores2 incrustados en Office con
un determinado factor de forma, que muestra aquello que nosotros hemos desarrollado. Y sta
es la razn por la que es posible integrar nuestras SharePoint Apps dentro de una Office App
(componentes web que se integran dentro de navegadores web).
Despus de introducirnos brevemente en algunos conceptos, estamos preparados para
comenzar a conocer realmente el nuevo modelo de aplicaciones de SharePoint. En la Figura 21
podemos ver un pequeo dibujo extrado de MSDN que es muy ilustrativo, a grandes rasgos,
de cmo nosotros como desarrolladores proveemos aplicaciones a travs de la Nube, en este
caso en forma de Office Store, hacindoselas llegar a los usuarios de manera transparente para
nosotros.
Figura 2-1. Desarrolladores proveen aplicaciones a

travs de la Nube
Oficialmente, a este modelo de aplicaciones se le ha dado el nombre de Cloud App Model

debido a que fundamentalmente se cre para que fuera posible desplegar este tipo de aplicaciones en la Nube, tanto desde el lado del proveedor (componentes de la aplicacin), como del
2 Concretamente utilizan el motor de Internet Explorer 10.
61
lado del usuario que adquiere la aplicacin, ya que son compatibles con la plataforma Office
365, paquete que incluye SharePoint Online.
Con este modelo en la Nube, automticamente obtenemos toda la versatilidad de la plataforma Azure o de OData, haciendo que nuestras aplicaciones sean mucho ms verstiles, por
ejemplo, en cuanto a uso de recursos de servidor. Para ser un poco ms grfico, voy ilustrar
con un ejemplo este tipo de ventajas. Imaginemos una aplicacin que muestra los datos en
tiempo real de una carrera de Frmula 1. Esta aplicacin constara al menos de una pgina para
mostrar los datos, una base de datos que los almacena y servicios web para refrescar y leer la
base de datos de forma constante. Si todos estos recursos de nuestra aplicacin estn en un
solo servidor que tenemos en propiedad, es muy fcil que un nmero de usuarios elevado desborde los recursos de nuestro servidor rpidamente, y si por el contrario contratamos una gran
cantidad de servidores de forma permanente, estaremos desperdiciando una gran cantidad de
recursos una vez que acaba la carrera. En este escenario, alojar nuestros recursos haciendo uso
de servicios web en Azure y SQL Azure para la base de datos, consumiramos solo lo que gastamos, empezando por lo mnimo (el equivalente a un pequeo servidor) y Azure se encargara
de auto-provisionar servidores de forma dinmica conforme la demanda aumentase.
En el ejemplo anterior he mencionado Azure como posible plataforma en la Nube y SQL
Azure como posible base de datos. Cabe destacar que las aplicaciones son compatibles con
la gran mayora de tecnologas web existentes, es decir, en lugar de usar .NET para nuestros
servicios en Azure, podramos utilizar PHP y una base de datos MySQL en lugar de SQL Azure.
Esto es posible gracias los nuevos modelos de objetos que incluye SharePoint 2013, como
puede ser el modelo de objetos de JavaScript y la nueva _api, como han bautizado al nuevo
acceso a travs de servicios REST, ahora muchsimo ms completo que en la versin anterior,
incluyendo entre otros acceso a los servicios de bsqueda, workflow, la parte de redes sociales,
taxonomas, perfiles de usuario y BCS3.
Cundo usar soluciones y cundo aplicaciones?

Hasta este momento, hemos repasado la historia de los desarrollos en SharePoint y hemos
echado un vistazo introductorio el nuevo modelo de desarrollo de SharePoint Apps. Con esta
informacin es posible que muchos lleguemos a una pregunta necesaria a la hora de iniciar
un nuevo desarrollo sobre SharePoint. Debemos utilizar soluciones o deberamos optar por
el nuevo modelo de aplicaciones?, para arrojar un poco de luz en este sentido, a continuacin
podemos encontrar los puntos ms representativos de cada una y as poder tomar esta decisin dependiendo de qu necesidades tenga el proyecto en cuestin.
Aplicacin (app)
3 Business Connectivity Services, el servicio que nos permite conectar a distintas fuentes de datos de otras
herramientas de negocio (LOB Line Of Business) desde SharePoint.
62
-- Escenarios en los que se necesitan funcionalidades con un contexto muy acotado (como
en una aplicacin de escritorio).
-- Ms flexibilidad en tecnologas, capacidades e infraestructura.
-- Mayor nivel de aislamiento de datos, procesos y usuarios.
-- Solucin (wsp)
-- Personalizaciones profundas.
-- Despliegue de pginas maestras, diseos de pgina, recursos.
-- Escenarios de personalizacin de administracin de SharePoint.
El Office Store
En este apartado vamos a echar un vistazo al Office Store y sus ventajas desde el punto de
vista de negocio y ciclo de vida de las apps. En el captulo 4 Administracin de SharePoint Apps
de este mismo libro trataremos en profundidad cmo publicar y administrar nuestras aplicaciones en el Office Store, as como en el catlogo privado de nuestra granja de SharePoint.
El modelo de negocio tipo Marketplace4 tiene mltiples ventajas a la hora de publicar
nuestras aplicaciones. Por una parte, nos facilita el contacto directo con los usuarios, homogeneizndolo con todos ellos a travs de canales nicos como puede ser el sistema de valoraciones de nuestras aplicaciones, mediante el cual podremos obtener informacin y opiniones de
los usuarios de una forma natural para ellos y unificada para nosotros. Aunque en algn caso
pueda parecer contraproducente, si hacemos un buen trabajo o bien si escuchamos a los usuarios, aadiendo aquellas caractersticas que son ms solicitadas o corrigiendo aquellos bugs
que ms usuarios reproducen, lo normal es que seamos premiados con buenas opiniones y en
consecuencia con un aumento en el nmero de descargas.
4 A partir de este punto me referir al significado de Marketplace directamente como Office Store ya que
es el nombre del autntico mercado de aplicaciones que nos ocupa.
63
Figura 2-2 Office Store de Estados

Unidos en fase Beta.
Por otra parte, otra de las ventajas importantes de publicar en el Office Store est en el
ciclo de vida de las aplicaciones, muy simplificado en la siguiente figura. El ciclo de vida de
desarrollo para el Office Store nos proporciona una forma muy sencilla de publicar y actualizar
nuestras aplicaciones. Cuando desarrollamos una aplicacin, antes de publicarla en el Office
Store, la empaquetamos en un solo archivo que contiene todos los recursos, no necesitamos
crear un instalador complejo que deba funcionar en cientos de servidores con distintas configuraciones, solo el paquete que genera Visual Studio. Una vez que publicamos dicho paquete
(nuestra aplicacin) a travs del Office Store, solo necesitaremos re-publicar dicho paquete
para que todos los usuarios de nuestra aplicacin puedan actualizarla de forma totalmente
integrada con SharePoint 2013. Este proceso remplazar los componentes anteriores por los
de la nueva versin, garantizando que nada falle durante dicho proceso de actualizacin. Cabe
destacar que lo realmente importante de este paquete es un archivo XML llamado manifest
que contiene la informacin esencial de nuestra aplicacin (ttulo, versin), el resto de componentes son los recursos (pginas HTML, hojas de estilos CSS).
64
Figura 2-3. Ciclo de vida de las aplicaciones

en Office Store.
Otras de las ventajas que nos proporciona el Office Store son:

-- Administracin de nuestra aplicacin
o Ciclo de publicacin (publicacin de actualizaciones automatizadas, es decir,
cuando publicamos una nueva versin de nuestra aplicacin, el Office Store se
encarga de avisar a todos los usuarios automticamente de que existe una nueva
versin de la aplicacin que tienen instalada)
o Datos de anlisis (nmero de descargas, nmero de pginas vistas)
o Licenciamiento de servicios. El Office Store incluye un marco de trabajo o framework para licenciamiento especialmente orientado a licenciar servicios y no aplicaciones como tal. El objetivo es proteger los datos ms all de la propia aplicacin,
ya que est demostrado que no hay dispositivo cuya seguridad sea infranqueable. La propuesta de Microsoft en este sentido pretende acabar con la piratera
a travs de la proteccin de los servicios de datos. Si tu usuario no tiene licencia
para acceder a los datos de un determinado servicio, da igual que tenga la aplicacin instalada (de forma irregular), ya que sta resultar inservible sin el debido
acceso a los servicios de datos en la Nube. Para verlo ms claro, imaginemos que
hemos publicado una aplicacin que mediante un servicio web provee informacin
general en tiempo real sobre el campeonato nacional de liga de ftbol de nuestro
pas, nosotros publicamos dicha aplicacin a 3,99, y con ello esperamos amortizar entre otras cosas el coste de los servidores que mantienen dicho servicio web.
Como estamos cobrando esa cantidad, decidimos que no es necesario ningn tipo
de autenticacin para acceder a los datos, ya que el mero hecho de consumirse
65
desde nuestra aplicacin implica, en teora, que han pagado los 3,99 por utilizar
la aplicacin. Qu ocurrira en el momento en el que rompieran la seguridad del Office
Store? En ese momento, mucha gente comenzara a utilizar la aplicacin sin pagar
previamente los 3,99. Aqu es donde entra el framework de licenciamiento que nos
permite validar si la peticin de la aplicacin tiene una licencia vlida, asignada por
el Office Store, y en caso contrario podemos denegar las peticiones al servicio web.
Protegiendo as nuestra aplicacin tambin desde fuera del dispositivo en el que se
ejecuta.
o Monetizacin. El Office Store integra las cuentas Microsoft que todos utilizamos
a menudo en otros mercados existentes como el Windows Phone Marketplace, el
Windows 8 Store y Xbox Live. Esto significa que nuestros posibles usuarios no tendrn que crear cuentas complejas ni aadir de nuevo su tarjeta de crdito para
poder comprar aplicaciones.
Tipos de SharePoint App. Visualizacin y funcionalidad

Ahora que comenzamos a tener una idea general de los conceptos ms bsicos de este
nuevo modelo, es el momento de comenzar a adentrarnos en los detalles. Las SharePoint Apps
pueden tener diferentes formas de representacin en una pgina (capa de presentacin), concretamente son tres los tipos de app que podremos desarrollar segn la forma en la que vamos
a presentarla al usuario y el tipo de funcionalidad que va a cubrir.
Pgina completa (Immersive Full Page)

Las apps de Pgina completa, son aquellas que ocupan toda la interfaz de usuario, es decir
que tienen una pgina maestra propia y todo lo que se muestra en pantalla cuando accedemos
a una de ellas es parte de la app. Normalmente, escogeremos este tipo de app cuando queramos una inmersin contextual completa del usuario, por ejemplo, para una app compleja de
gestin de vacaciones de empleados, que utilizara presumiblemente varios elementos de la
interfaz visual (elementos de navegacin, paneles con informacin, formularios, etc).
66
Figura 2-4. SharePoint 2013 App del tipo pgina completa
Para acceder a este tipo de apps, normalmente, entraremos en los contenidos del sitio y
seleccionaremos la app en cuestin. Cabe destacar que ahora todo son apps en los contenidos
del sitio, tanto las plantillas de lista como las de biblioteca quedan tambin representadas
como apps, de forma que las nuestras quedan completamente integradas como un elemento
ms dentro del contenido del sitio.
Parte de pgina (App Part)

Las aplicaciones tipo Parte de pgina o App Part5 que es el trmino original con el que
fueron bautizadas, quedan representadas en una pgina con Web Part Zones como cualquier
otra Web Part de SharePoint. Por dentro, estas App Parts no son ms que Web Parts que dibujan un iframe para mostrar la pgina en la que representamos todos los componentes de nuestra
App Part.
5 A partir de este punto, me referir a este tipo de aplicaciones como App Part ya que la traduccin es literal
y probablemente no tendremos una versin oficial en espaol de este trmino en la documentacin oficial.
67
Figura 2-5. SharePoint 2013 App del tipo App Part
Normalmente, la utilizaremos para proveer al usuario de una funcionalidad ms concreta y

reducida que con las aplicaciones de Pgina completa. Por ejemplo, un mapa que site geogrficamente proveedores en funcin de los parmetros que le pasemos a nuestra App Part. He
dicho parmetros, exacto, esta Web Part especial que vendr dada por la clase ClientWebPart
del modelo de objetos, tambin podr recibir parmetros, ya sea a travs de las propiedades
del Tool Part como hacamos hasta ahora con el resto de Web Parts, o como consecuencia de
otras acciones del usuario o del contexto de la pgina. Para agregar nuestras App Parts a una
pgina, solo tendremos que buscar bajo la pestaa Insertar de la cinta de opciones, la seccin Piezas y en sta tenemos la opcin Elemento de aplicacin que nos mostrar las App
Parts disponibles para insertar en la pgina. Tambin podemos encontrar e insertar las App
Parts disponibles bajo la categora Aplicaciones desde el men de insercin de elementos
web.
Figura 2-6.
Men Insertar en
SharePoint 2013.
Cuando utilizamos App Parts, no estamos necesariamente limitados a una sola App Part
por proyecto de SharePoint App, realmente podemos complementar una app de Pgina com-
68
pleta, con uno a varias App Parts que hacen las veces de widget o complemento reducido de
nuestra App completa, es decir, se complementan.
Accin personalizada (UI Custom Action)

En esta forma de representacin, las apps son accedidas de la forma ms integrada posible,
esto es, mediante botones contextuales en la cinta de opciones (Ribbon) de cualquier pgina o
bien en forma de extensin en los mens contextuales de elementos de lista o biblioteca.
Figura 2-7. SharePoint 2013 App del tipo UI Custom Action
Esta forma de entrada para acceder a la funcionalidad de nuestras apps es realmente interesante en escenarios en los que necesitamos que nuestras apps se ejecuten sobre un objeto
contextual muy concreto como puede ser l envo por correo de una determinada informacin perteneciente a un elemento concreto de una lista, o la activacin de algn proceso que
afecta a todo un contexto como hacen el resto de acciones de la cinta de opciones.
Las acciones personalizadas se configuran mediante XML, en este XML se configuran todas
las propiedades del botn que ejecutar la accin, as como la accin que debe activar. Las
acciones pueden ser desde un simple enlace con parmetros que dirija al usuario a una pgina
concreta, hasta una compleja funcin JavaScript que lleve a cabo operaciones mucho ms costosas. Es decir, desde las acciones personalizadas solo tendremos de nuevo cdigo de cliente
disponible.
69
Tipos de SharePoint App. Opciones de alojamiento

Hasta ahora, hemos hablado de que las apps estn compuestas por diferentes recursos
como CSS, pginas o archivos JavaScript, pero no hemos visto donde pueden alojarse dichos
recursos y qu opciones tenemos como desarrolladores a la hora de escoger dicho alojamiento. Segn donde se alojen los recursos que hacen funcionar nuestra app, podemos hablar
de tres tipos de app, ms una cuarta opcin ms compleja que seran las apps de alojamiento
hbrido. Estas opciones son: alojada en un proveedor (Provider-hosted6), auto-alojada en
la Nube pblica (Autohosted7), alojada en el propio servidor SharePoint en el que se instala (SharePoint-hosted) y, por ltimo, una aproximacin hbrida que combina varias de las
anteriores.
Apps alojadas en SharePoint (SharePoint-hosted Apps)

Las apps alojadas en SharePoint se instalan directamente en un sitio de SharePoint 2013, al
que llamaremos Host Web (el sitio que aloja). Los recursos de nuestra app quedarn completamente aislados bajo un sub-sitio de este Host Web, a este sub-sitio lo llamaremos App Web
(el sitio de la app), ya que el sitio en s representar a nuestra app y todos sus recursos.
Este tipo de alojamiento nos permite acceder, y por tanto reutilizar, todos los artefactos del
Host Web en SharePoint, ya que nuestra aplicacin obtendr el contexto de dicho sitio y con
ello obtendr acceso mediante el modelo de objetos de JavaScript a los distintos artefactos
del sitio. Y precisamente JavaScript es el nico modelo de objetos disponible para este tipo de
aplicaciones, ya que no nos est permitido usar ningn modelo de objetos de servidor desde
ellas.
Estas aplicaciones se despliegan e instalan cuando se descargan desde el Office Store o el
catlogo corporativo de aplicaciones.
6 Dado que los tipos de alojamiento han sido nombrados con combinaciones peculiares que es difcil que
sean traducidas dos veces igual, acompao mis traducciones de estos trminos con el trmino original, que muy
probablemente os encontraris en otras publicaciones.
7 En algunas ocasiones tambin se les ha llegado a llamar Windows Azure Autoprovisioned Apps, en
algunos de los vdeos de formacin oficiales.
70
Figura 2-8. Visualizacin y alojamiento en una SharePoint-hosted App
Apps alojadas en un proveedor (Provider-hosted Apps)

Las apps alojadas en un proveedor incluyen una serie de componentes que estn alojados
fuera de la granja de SharePoint donde la app est instalada, normalmente estos componentes
son alojados por el desarrollador de la propia app aunque se puede dar el caso, bien por restricciones de seguridad o bien por una cuestin de costes, en los que el propio consumidor de
la app aloja estos componentes externos en servidores administrados por l mismo.
Este tipo de aplicaciones pueden ser alojadas tanto en plataformas web remotas de Microsoft,
como es Windows Azure, como en otras plataformas, incluidas las que no son de Microsoft, por
lo tanto, podemos decir que la gran ventaja de esta aproximacin es que podemos elegir cualquier servicio de alojamiento (hosting) que exista en el mercado. La comunicacin remota con el
servidor de SharePoint se puede realizar a travs de alguno de los modelos de objetos de cliente
existentes, as como a travs de los servicios web basados en REST y OData. La autenticacin en
este escenario puede ser o bien implementando el estndar OAuth para autenticacin o bien
a travs de la biblioteca de JavaScript para autenticacin a travs de dominios (JavaScript crossdomain library).
El nico punto que tenemos que considerar como posible contrapartida a la flexibilidad
que nos proporcionan las aplicaciones alojadas en el proveedor, es en el caso de que nosotros
mismos seamos los alojadores de dichos componentes externos. En este caso, tenemos la responsabilidad de asegurar el funcionamiento ininterrumpido, as como de actualizar el entorno
que aloja los componentes. En resumen, una gran flexibilidad conlleva una gran responsabilidad.
Existen dos opciones a la hora de montar nuestro servidor, hacerlo dentro del firewall corporativo donde se encuentre el servidor remoto de SharePoint, o fuera del firewall corporativo.
Dependiendo de la opcin, habr diferencias en cuanto a las opciones que podemos utilizar
durante el desarrollo. Veamos estas dos opciones.
71
Figura 2-9. Apps alojadas en un proveedor (Provider-hosted App)
Con componentes remotos fuera del firewall

En este escenario podemos utilizar JavaScript o los servicios web REST/OData y la autenticacin se realiza a travs de la biblioteca de JavaScript para autorizacin a travs de dominios
(cross-domain library8).
En este caso, la responsabilidad cae completamente del lado del desarrollador a la hora de
mantener el aislamiento entre los datos de los diferentes usuarios de la aplicacin. Esto es as
debido a que el servidor va a quedar alojado directamente en los servidores del proveedor, los
que estn completamente controlados por l, por lo que tanto la seguridad del servidor como
el aislamiento de los datos en el mismo corren a cargo del propio proveedor.
Imaginemos que tenemos una aplicacin que necesita una base de datos SQL Server completa para funcionar. En este caso, posiblemente hablaramos de una aplicacin alojada en el
proveedor, lo que nos llevara a tener que alojar algunos componentes en nuestro servidor
(siendo nosotros el proveedor), esta base de datos en caso de que el cliente no tuviera posibilidad de ubicarla dentro de sus sistemas tendramos que tenerla en un servidor en nuestros
sistemas y, por tanto, quedara fuera del firewall (la red corporativa) del cliente.
8 Ms informacin sobre cmo utilizar esta biblioteca de JavaScript aqu http://msdn.microsoft.com/en-us/

library/fp179927(v=office.15).aspx (en ingls).
72
Con componentes remotos dentro del firewall

En este escenario podemos utilizar el lenguaje de programacin que deseemos. Para
comunicar con SharePoint podremos utilizar cualquiera de los modelos de objetos de cliente
o bien los servicios REST/OData, y en este caso, tambin podremos utilizar el protocolo para
autenticacin y autorizacin de apps OAuth.
En este punto, la responsabilidad del desarrollador queda en proveer al cliente con un
paquete de instalacin completo para implantar los componentes remotos en su servidor
remoto que queda dentro de la red corporativa (dentro del firewall). Es decir, siguiendo con el
ejemplo anterior en el que nuestra aplicacin necesita una base de datos SQL Server propia,
proveeramos al cliente de una copia de seguridad o un instalador que creara todas las bases
de datos necesarias en el servidor que correspondiera dentro de su red corporativa. En este
caso, al tratarse de un servidor propio del cliente, la gestin y, por tanto, la responsabilidad
sobre la seguridad de los datos, queda del lado del propio cliente ya que nosotros no tenemos
posibilidad de controlar su red corporativa.
Apps auto-alojadas (Autohosted Apps)

Las apps auto-alojadas se alojan sobre Windows Azure Web Sites9 (una especie de Windows
Azure reducido). Al igual que ocurre en con las aplicaciones alojadas en el proveedor, las autoalojadas quedan en un servidor remoto utilizando recursos de dicho servidor, pero tambin
pueden acceder a los elementos del servidor SharePoint donde se instala la aplicacin.
En este caso, como estamos utilizando un sistema de nube pblica que aprovisiona recursos
de forma automtica segn la necesidad, cuando nuestra aplicacin se instala en el servidor de
cualquier cliente, todos los componentes de Windows Azure y SQL Azure son aprovisionados
automticamente sin necesidad de que hagamos algo cada vez. El problema del aislamiento
que tenamos con las aplicaciones alojadas en el proveedor aqu desaparece, ya que Azure provee un nuevo Windows Azure Web Site cada vez que se instala la aplicacin, garantizando as el
aislamiento entre los diferentes usuarios de nuestra aplicacin, y lo ms importante, quedando
la responsabilidad de dicho aislamiento del lado de la propia Microsoft.
Aadido a todo esto cabe destacar una ventaja fundamental, inherente al uso de este tipo
de servicios en la Nube, y es que Azure administrar por nosotros el balanceo de carga as
como el resto de tareas de mantenimiento y administracin que puedan necesitar los sitios de
Azure.
9 Aquellos lectores interesados en ampliar informacin sobre este servicio, pueden hacerlo aqu http://www.
windowsazure.com/es-es/home/scenarios/web-sites/
73
Figura 2-10. App auto-alojada (Autohosted App)
Apps combinadas (Hybrid Apps)

Las apps combinadas no son realmente un cuarto tipo de app, sino que son la representacin de lo que supone combinar apps alojadas en SharePoint con algunos componentes en
la Nube. Este escenario aporta las ventajas de ambos tipos de despliegue, pudiendo utilizar el
modelo de objetos de JavaScript desde los componentes alojados en SharePoint, y teniendo
que autenticar mediante OAuth para aquellos que estn en la Nube.
La contrapartida de este escenario es que hay que analizar de forma muy exhaustiva las
comunicaciones entre servidores, as como las restricciones de seguridad que podemos encontrar con el cross-site scripting10 a la hora de acceder a los distintos componentes mediante el
modelo de objetos de JavaScript.
Aunque este tipo de combinaciones pueden ser muy variadas, un posible ejemplo de app
combinada podra ser una aplicacin de gestin de prstamos con inters variable. Esta aplicacin podra concebirse inicialmente como una aplicacin de tipo SharePoint-hosted dado
que podra crear todas las estructuras de datos en forma de listas dentro del propio sitio
de SharePoint. La diferencia con una aplicacin clsica de este tipo vendra cuando necesita-
10
Wikipedia provee una definicin muy completa del trmino cross-site scripting para aquellos interesados en ampliar informacin http://es.wikipedia.org/wiki/Cross-site_scripting
74
mos obtener de forma peridica el nuevo ndice burstil para los intereses de los prstamos
en los distintos plazos. Estos ndices para un mejor rendimiento los obtendramos desde un
componente externo (por ejemplo un web role en Azure) los almacenaramos en una base de
datos intermedia (que podra estar en uno de nuestros servidores) y finalmente accederamos
a dichos datos a travs de un servicio web, tambin alojado en nuestros servidores.
Este servicio web sera accedido desde nuestra aplicacin inicialmente concebida como
SharePoint-hosted y que ahora ya sera una aplicacin que combina componentes de los distintos tipos de aplicacin.
75
Resumiendo
Para acabar, vamos a resumir de una forma grfica los tres tipos bsicos de alojamiento
que hemos visto a lo largo de las pginas anteriores, a continuacin tenemos la tabla con la
informacin ms importante resumida. De ella sacaremos nuestras propias conclusiones a la
hora de decidirnos por un tipo u otro de aplicacin desde el punto de vista del alojamiento.
TIPO DE APP
SharePoint-hosted
Programacin
La ms sencilla de implementar y alojar. En ella, todos los componentes de la HTML y
aplicacin se alojan directamente dentro de la granja de SharePoint del usua- JavaScript
CARACTERISTICAS
rio. Cada instalacin de dicho tipo de aplicaciones queda como un sub-sitio del
mismo aislado.
Esta opcin solo se recomienda cuando no es necesario acceder a ningn servicio alojado fuera de la granja de SharePoint.
Provider-hosted
Se pueden utilizar elementos del sitio de SharePoint (listas, elementos, Web Parts).
Esta opcin requiere un servidor dedicado o al menos un sistema de alojamiento
que garantice el aislamiento de los datos de los distintos clientes (y sus usuarios).
El servidor puede estar dentro o fuera del firewall corporativo del cliente. El desarrollador es el responsable de proveer el servidor o bien el paquete de instalacin
completo.
HTML, JavaScript
con restricciones
cross-domain y
servicios web
REST/OAuth
El desarrollador es el responsable del aislamiento.

Aporta mayor flexibilidad pero tambin una mayor responsabilidad.
Se pueden usar elementos del sitio de SharePoint (listas, elementos, Web Parts).
Autohosted
Similar al anterior, pero con la diferencia de que los componentes queda autom- HTML, JavaScript
ticamente aprovisionados en Windows Azure.
con restricciones
cross-domain y
Los componentes Web y SQL se aprovisionan automticamente al instalar la servicios web
aplicacin.
REST/OAuth
La administracin y mantenimiento de todos los componentes as como el aislamiento de los datos corre a cargo de Microsoft.
Se pueden usar elementos del sitio de SharePoint (listas, elementos, Web Parts).
76
Conclusiones
Hace unos aos trabajando en un proyecto de extranet corporativa para una empresa
relacionada con la banca espaola, se dio el problema de que era totalmente imposible desde
el punto de vista de la seguridad de dicha empresa acceder a la cach global de ensamblados
(GAC) de Windows. Por esta razn, la solucin que por aquel entonces desarrollamos fracas
dado que no poda ser concebida sin introducir ciertos ensamblados en la GAC. Esta ancdota
que es real, y viene precisamente a cuento de la importancia que tiene el aislamiento del servidor de nuestros desarrollos.
A lo largo de este captulo hemos recorrido de forma terica lo que supone el nuevo modelo
de desarrollo para la plataforma SharePoint. Quizs lo ms significativo de este modelo no est
en la tecnologa que utiliza, y probablemente tampoco en cmo se desarrollan las aplicaciones,
lo que mayor valor le debe dar este modelo a todos los desarrolladores es la capacidad de
generar nuevas oportunidades de negocio de una forma sencilla y muy segura para los clientes
finales de nuestras aplicaciones. Si esto se consigue finalmente, todas las novedades presentadas y el esfuerzo que los desarrolladores hacemos cada vez que hay un cambio de modelo
como ste, habrn valido la pena.
77
Captulo 3: Desarrollo de SharePoint Apps
El objetivo de este captulo es dar una visin ms en detalle de cmo se desarrollan las
nuevas apps de SharePoint 2013.
En primer lugar se ver un paso a paso de cmo, partiendo desde cero, se puede desarrollar una app de SharePoint. Luego veremos ms en detalle aquellas buenas prcticas de
maquetacin y diseo con ejemplos reales. Y finalmente se vern varios ejemplos del modelo
de objetos cliente y REST accediendo a SharePoint desde las apps.
Mi primera app
Introduccin
Una vez vistos los aspectos tericos del nuevo modelo de aplicaciones que presenta
SharePoint 2013 con las apps, es el momento de untarse las manos haciendo aquello que
mejor saben hacer los desarrolladores: desarrollar. Veremos que a la hora de desarrollar apps
para SharePoint 2013, Visual Studio 2012 se encarga de prcticamente todo el trabajo tedioso
de configuracin de proyectos, dejando al desarrollador un precioso lienzo a su disposicin.
As pues, veremos cmo configurar y desarrollar nuestra primera app basndonos en la
arquitectura SharePoint-hosted Apps, y partiendo del tipo ms simple de app, la App de
Pgina completa (Immersive Full Page App). Como ya sabemos, esta arquitectura permite
desplegar apps dentro del propio servidor donde est instalado SharePoint 2013. Por lo tanto,
es ideal para una fase inicial de desarrollo y pruebas. Y adems, como veremos, es el modelo
ms cercano a lo que conocemos de SharePoint 2010, por lo que es perfecto para asentar
conocimientos y fijar las bases del nuevo modelo de programacin que suponen las SharePoint
apps. Seguidamente, veremos cmo desarrollar los otros dos tipos de apps disponibles, App
Parts y de Accin personalizada (UI Custom Actions). De esta manera, cubrimos todo el aba-
78
nico de posibilidades, y podremos conocer las diferencias en cuanto a desarrollo, de un tipo

de app con el resto.
Pero antes siquiera de abrir Visual Studio 2012, se requiere de una serie de configuraciones en el entorno de desarrollo a fin de evitar problemas posteriores, y poder desplegar apps
correctamente. Empezamos?
Preparacin del entorno de desarrollo

Lo primero a aclarar es que los pasos que se siguen a continuacin se aplican a una
mquina con una instancia de SharePoint 2013 instalada localmente. Lo ms cmodo y seguro
es tener una mquina virtual aislada a fin de evitar posibles problemas en la mquina anfitrin.
Concretamente, para la realizacin de los distintos laboratorios que veremos, parto de una
mquina virtual con Windows Server 2008 R2 x64 como sistema operativo, SQL Server 2012,
SharePoint 2013 y Visual Studio 2012. En cuanto a las especificaciones hardware, es importante,
para un buen rendimiento y no desesperar, dar cuanta mayor RAM sea posible. Microsoft recomienda para un entorno de desarrollo un mnimo 6 GB de RAM. Como referencia, mi mquina
tiene 10 GB de RAM, y 50 GB de disco duro. Bien hasta ahora? Seguimos.
Sitio del Desarrollador

El primer paso, y ms sencillo, es crear una coleccin de sitios bajo una aplicacin web
en SharePoint 2013 con un sitio raz creado a partir de la nueva plantilla de sitio, Sitio de
Desarrollador. sta es una plantilla especfica para instalar y probar las apps que vayamos
desarrollando. No podremos desplegar apps desde Visual Studio 2010 en una coleccin de
sitios que est construido con otra plantilla.
79
Figura 3-1. Plantilla de Sitio de desarrollador.
Reservar un Dominio Aislado para las apps

El siguiente paso es crucial en el desarrollo de una SharePoint-hosted App, y muy importante tenerlo claro, ya que es clave para comprender el funcionamiento de las SharePoint apps.
Necesitamos reservar el nombre para un dominio, a partir del cual formar las direcciones de los
sitios web que contienen las apps. La idea es sencilla: cada app que creamos se almacena aisladamente en su propia aplicacin web, ya se encuentre ste en el mismo servidor donde est
instalado SharePoint (SharePoint-hosted Apps), en Azure (Autohosted Apps), o en cualquier
otro servidor que queramos (Provider-hosted Apps), como se ha visto anteriormente. sta es
precisamente una de las grandes ventajas de las apps, que se ejecutan bajo un proceso aislado
de modo que en ningn caso pueden afectar a SharePoint, ni al servidor en s.
En el caso de una SharePoint-hosted App, quin, dnde y de qu tipo es el sitio que se
crea? Pues bien, cuando instalamos una app, el propio SharePoint 2013 se encarga de crearle
un sitio (SPWeb), a partir de la nueva plantilla APP#0 App Template, bajo el sitio donde
instalamos la app. Este sitio que se crea se conoce como App Web. Y el sitio donde se instala
la app, es decir, el SharePoint anfitrin, se conoce como Host App.
80
Figura 3-2. Relacin entre una Host Web y una App web.
Qu ocurre cuando instalamos la app en distintos sub-sitios? Bajo cada uno de estos subsitios, se crear a su vez un sitio hijo, que es el que contendr finalmente a la SharePoint-hosted
App. Es decir, cada app se define a nivel de sitio (SPWeb), y vive aisladamente con el resto de
apps en su propio sitio, como sub-sitio del sitio donde se instal. Vaya trabalenguas!.
Hay que aclarar que una app web no se crea nicamente para una app del tipo SharePointhosted, sino que tambin se crea en el caso de que nuestra app, sea del tipo que sea, contenga
componentes propios de SharePoint como Listas, Workflows, Caractersticas (Features), etc.
Es decir, una app del tipo Cloud-hosted (Provider-hosted o Autohosted) puede tener tanto
componentes en la Nube, como componentes propios de SharePoint. Es en el caso de tener
algn componente de SharePoint, cuando se creara una app web para as poder alojarlos.
Estaramos entonces antes un caso mixto de aprovisionamiento de apps.
81
Figura 3-3. Caso mixto de aprovisionamiento de SharePoint Apps
Y bajo qu direccin se crea dicho sitio? Aqu es donde entra en juego el dominio aislado
del que hablamos al principio. Por ejemplo, supongamos que tenemos una intranet con la
siguiente direccin: laintranet.miempresa.com. Un posible dominio aislado que podemos
reservar sera el siguiente: apps.miempresa.com. Si lo hacemos as, al instalar una nueva instancia de una app se crear un sitio para la misma con una URL similar a http[s]: App-Prefijoa1b2c3d4.apps.miempresa.com, donde la cadena a1b2c3d4 es un identificador nico que se le
asigna aleatoriamente a cada instancia de una app. Entendiendo por instancia, cada app que
instalamos a nivel de sitio de SharePoint. Es decir, dentro una misma coleccin de sitios, podemos tener distintas instancias de una app, una por cada vez que la instalemos en cada sitio.
Por ltimo, antes de pasar a ver cmo crear dominios aislados para las apps, queda en el
aire la cuestin de cmo registrar esos dominios de manera que sean accesibles. Tenemos la
posibilidad clsica de usar un servidor de DNS, que es la opcin recomendada para un entorno
de produccin. Pero para un entorno de desarrollo, es perfectamente vlido utilizar el fichero
Hosts de Windows. Para alegra nuestra, Visual Studio 2012 se encarga de hacer las modificaciones oportunas en el fichero Hosts por nosotros, en el momento de compilar y desplegar una
nueva app.
Y bien, cmo reservamos un dominio aislado para las apps? Con nuestro querido amigo
Windows PowerShell. Para SharePoint 2013 se han creado una serie de nuevos comandos, o
cmdlets como se les conoce en Windows PowerShell. Uno de ellos es el que nos permite reservar el dominio aislado para las aplicaciones, tal que as:
82
Set-SPAppDomain apps.miempresa.com
Para lanzar este cmdlet, y los que vienen a continuacin, es preciso hacerlo con un
usuario que sea administrador de la granja, y tambin iniciar la instancia de Windows
PowerShell como Administrador. Tambin es importante, asegurarse de que los servicios
spadminv4 y sptimerv4 estn levantados. Para ello podemos lanzar los siguientes comandos:
net start spadminv4

net start sptimerv4
Por ltimo, podemos comprobar que efectivamente, se ha registrado correctamente el dominio aislado, usando
el cmdlet Get-SPAppDomain.
Figura 3-4. Resultado del cmdlet Get-SpAppDomain
Servicios y aplicaciones de servicio

Bien, ya hemos reservado un dominio para aislar las apps, pero siento decir, amigo lector,
que an quedan unos cuantos pasos ms antes de dar por terminada la configuracin del
entorno de desarrollo. El siguiente es iniciar, o ms bien, asegurarnos de que est iniciado,
tanto la instancia del servicio en el servidor, como la aplicacin de servicio, que permite ejecutar apps localmente. Estamos hablando de la aplicacin de servicio App Management Service
Application (Aplicacin de Servicio de Administracin de Apps). Normalmente, a no ser que
83
explcitamente hayamos desmarcado la casilla, tanto servicio como aplicacin de servicio se

crean al lanzar el Asistente de Configuracin de la Granja.
Figura 3-5. Aplicacin de servicio App Management Service en el Asistente de Configuracin de la

Granja.
Despus, debemos comprobar que la instancia del servicio en el servidor est iniciada
(Started), accediendo desde la Administracin central, a Administrar los servicios del servidor (Manage Services on server).
Figura 3-6. Comprobacin de que el servicio est iniciado.
Y queda otra aplicacin de servicio, algo ms complicada tanto de crear (es necesario
crearla manualmente), como de entender por qu es necesaria. Nos referimos a la aplicacin
de servicio Microsoft SharePoint Foundation Subscription Settings Service Application
(es corto el nombre) Al igual que con la aplicacin de servicio anterior, debemos asegurarnos
tanto de que est creada la aplicacin de servicio, como tambin de que est iniciada la instancia del servicio en servidor.
Para entender por qu necesitamos esta aplicacin de servicio conviene tener en cuenta
en todo momento, que el modelo de programacin de las Sharepoint apps fue desarrollado
inicialmente para Office 365. Es por ello, que para poder trasladar dicho modelo a SharePoint
2013, el entorno para ejecutar las Sharepoint apps debe de configurarse a nivel de inquilino
84
o como es ms conocido, tenant. Es decir, como una entidad que contrata un servicio en la
Nube. Este concepto de tenant tiene todo el sentido dentro del contexto de Office 365, sin
embargo, resulta confuso que para un entorno local, sea necesario crear y configurar inquilinos que consuman servicios. Aun as, necesitamos emular el sistema de tenants en un entorno
local, y es por ello por lo que necesitamos la anteriormente citada aplicacin de servicio. Sin
este servicio, no sera posible crear tenants, lo que a su vez no hara posible instalar y ejecutar
apps. Cuando se crea una instancia de Subscription Settings Service Application, el servicio
automticamente crea un inquilino o tenant por defecto, que se corresponde con todos los
sitios y colecciones de sitios de la granja. Es decir, imaginemos a los sitios y colecciones de
sitios de la granja, como una persona que ha contratado un servicio. Del mismo modo que
para Office 365, una persona contrata un servicio, y por ello, tiene su tenant correspondiente
que le permite consumirlo.
Figura 3-7. Comprobacin de que la aplicacin de servicio est iniciada.
As pues, tanto para iniciar las dos instancias de los servicios en servidor hacemos uso del
siguiente comando de Windows PowerShell:
Get-SPServiceInstance | where{$_.GetType().Name
eq AppManagementServiceInstance -or
$_.GetType().Name -eq SPSubscriptionSettingsServiceInstance} |
Start-SPServiceInstance
Figura 3-8. Secuencia de comandos para iniciar las instancias de servicio.
85
En caso de que los servicios ya estuvieran iniciados, obtendramos el siguiente resultado:
Figura 3-9. Sercvicios ya iniciados.
A continuacin, comprobamos que ambas aplicaciones de servicio estn ejecutndose,

verificando que su estado es Online:
Get-SPServiceInstance | where{$_.GetType().Name
eq AppManagementServiceInstance -or
$_.GetType().Name -eq SPSubscriptionSettingsServiceInstance}
Figura 3-10. Comprobacin de que los servicios estn ejecutndose.
Por ltimo, queda configurar ambas aplicaciones de servicio para indicar la cuenta
de usuario con la que van a ejecutarse, la agrupacin de aplicaciones (Application
Pool) y la base de datos en la que se apoyan. Para la cuenta de usuario, necesitamos un
SPManagedAccount. Si ya tenemos uno, nos saltamos el siguiente paso, en el que lo creamos:
$account = New-SPManagedAccount
86
Figura 3-11. Creacn de una cuenta de usuario administrada (Managed Account).
El comando anterior pedir que se introduzca el usuario en formato dominio\usuario y la

contrasea del mismo. Cuando ya tenemos el SPManagedAccount, lanzamos los siguientes comandos secuencialmente:
$account = Get-SPManagedAccount dominio\usuario

$appPoolSubSvc = New-SPServiceApplicationPool
-Name SettingsServiceAppPool -Account $account
$appPoolAppSvc = New-SPServiceApplicationPool
-Name AppServiceAppPool -Account $account
$appSubSvc = New-SPSubscriptionSettingsServiceApplication ApplicationPool
$appPoolSubSvc Name SettingsServiceApp DatabaseName SettingsServiceDB
$proxySubSvc = New-SPSubscriptionSettingsServiceApplicationProxy
ServiceApplication $appSubSvc
$appAppSvc = New-SPAppManagementServiceApplication -ApplicationPool
$appPoolAppSvc -Name AppServiceApp -DatabaseName AppServiceDB
$proxyAppSvc = New-SPAppManagementServiceApplicationProxy
-ServiceApplication $appAppSvc
Y finalmente, el ltimo y definitivo paso (bueno, casi) es crear el inquilino o

tenant del que hablamos anteriormente. En realidad, como se ha dicho, solo necesitamos crear un nombre con el que identificar a la identidad que va a consumir los servicios
de manera local. Para ello tenemos el siguiente comando, el cual nos pedir confirmacin:
Set-SPAppSiteSubscriptionName -Name app -Confirm:$false
87
Configurar Internet Explorer

Una vez reservado el dominio aislado, y configurado las aplicaciones de servicio, tenemos
el entorno de desarrollo casi a punto. Nuestra primera app ya casi tiene un hogar donde nacer
y crecer feliz. Falta un detalle: configurar Internet Explorer para que nos permita navegar hacia
el dominio que hemos creado anteriormente. Para ello, seguimos las siguientes instrucciones:
1. Abrimos la configuracin de Internet Explorer.
2. En la pestaa Conexiones, clic en Configuraciones LAN.
3. Desmarcamos Detectar configuraciones automticamente.
4. Seleccionamos Usar un servidor proxy para la LAN.
5. Marcamos No usar servidor proxy para direcciones locales.
6. Hacemos clic el botn Avanzado y aadimos a la lista de excepciones el nombre
de nuestro dominio aislado, tal que as: *.apps.miempresa.com.
7. Cerramos todo, haciendo clic en OK.
Las configuraciones que hemos hecho, deben haber quedado as:
Figura 3-12. Configuraciones en Internet Explorer
88
Y ahora s, si hemos llegado hasta aqu sanos y salvos, ya podemos decir que tenemos un
entorno local de desarrollo a punto para las SharePoint apps. En cualquier caso, solo recordar
que estas configuraciones son nicamente necesarias para el caso de querer desarrollar apps
localmente. Si nuestra intencin es desarrollar apps para para Office 365, Microsoft ya nos dej
un entorno preparado, e incluso la posibilidad de usar una herramienta de desarrollo online,
Microsoft NAPA, de la cual hablaremos ms adelante.
Hola Mundo!
Por qu ser que todo programador se inicia en un lenguaje con un Hola Mundo? Es
acaso un vestigio de una humanidad antigua, que perdura en nuestros das? O tal vez es
cierta la leyenda urbana que en caso de no iniciarse de tal modo, caer sobre nosotros aos
de penuria programacional? Bueno, desvaros aparte, y fuere como fuere, nosotros no vamos
a ser ms originales que nadie, por lo que pueda pasar. As pues, una vez configurado nuestro
entorno de desarrollo, vamos a ver cmo crear nuestra primera SharePoint App. Con la arquitectura SharePoint-hosted App como partida, crearemos en primera lugar una app de Pgina
completa donde simplemente se muestre el inmortal Hola Mundo. A continuacin, veremos
el resto de tipos de apps, para tener as una visin global del alcance y las posibilidades de este
nuevo modelo de programacin.
App de Pgina completa

Veamos a continuacin un paso a paso de como crear una app de este tipo.
Abrimos Visual Studio 2012 como Administrador...

Y creamos un proyecto nuevo. Bajo el lenguaje de programacin con el que ms cmodo
nos sintamos (Visual Basic en mi caso), encontramos la nueva seccin Office/SharePoint11. Esta
seccin contiene plantillas de proyectos tanto para SharePoint, como para Office. Si desplegamos el (+), encontramos una sub-seccin especfica para las apps, y es aqu donde podemos
seleccionar App for SharePoint 2013.
11
Es necesario instalar las Microsoft Office Developer Tools for Visual Studio 2012 (requiere la versin
Premium como mnimo). Se puede descargar mediante la aplicacin Web Platform Installer 4.0, que puedes encontrar
en http://www.microsoft.com/web/downloads/platform.aspx. O tambin desde el siguiente enlace directo: http://
go.microsoft.com/fwlink/?LinkID=261869
89
Figura 3-13. Plantilla de proyecto para las SharePoint Apps.
Seleccionar la arquitectura
Figura 3-14. Configuracin de la App en la plantilla de Visual

Studio 2012.
90
Llegamos a la pantalla de la imagen, donde debemos seleccionar, en primer lugar, el sitio

SharePoint donde probar nuestra app. Este sitio SharePoint, como vimos en la configuracin
del entorno de desarrollo, debe ser un sitio creado a partir de la plantilla Sitio del Desarrollador.
Tambin especificamos la arquitectura de nuestra app. En nuestro caso, SharePoint-hosted.
Repaso de los componentes del proyecto

Una vez creado el proyecto, podemos ver que la plantilla de Visual Studio 2012 que hemos
utilizado para crear la SharePoint-hosted App, automticamente incluye una serie de mdulos
para desplegar los archivos que la componen. Concretamente tenemos un mdulo para las
imgenes (Images), donde por defecto se encuentra el logo de la app. Tambin un mdulo
para las distintas pginas (Pages). Otro para archivos CSS (Content). Y finalmente un mdulo
para archivos JavaScript (Scripts). Nos debe llamar la atencin que se incluye en ste, la librera
de jQuery, tanto en su versin reducida, como tambin la ampliada con comentarios, especial
para desarrollos. En el siguiente captulo dedicado a la maquetacin y diseo de apps, estudiaremos en profundidad las particularidades de los archivos que componen una SharePointhosted App.
En definitiva, el proyecto que tenemos se parece mucho al proyecto que podramos tener
en una solucin para SharePoint 2010. Y es que en esencia lo que estamos haciendo es precisamente eso, construir una solucin de SharePoint clsica, con sus Caractersticas (Features) y
dems componentes, para desplegarla en el sitio web, mejor dicho, la app web, que contendr
nuestra app.
Figura 3-15. Plantilla de proyecto de

Visual Studio 2010 para una SharePointhosted App.
91
Un primer despliegue
El proyecto que tenemos, an sin haber hecho nada, ya tiene una serie de archivos funcionales per se, que dotan de una funcionalidad por defecto a la app para tener un punto
de partida a partir del cual seguir trabajando. Y cul es esa funcionalidad por defecto? Pues
casualmente, resulta que es un Hola Mundo J. Por tanto, hacemos deploy del proyecto, y si
toda va bien, Visual Studio 2012 nos premiar con un Succesfully installed App for SharePoint.
Una vez desplegada la app, abrimos nuestro Sitio de Desarrollador, y vemos que en la
pgina de inicio hay una seccin Apps in Testing, bajo la cual aparece nuestra recin desplegada app.
Figura 3-16. Apps in Testing en el Sitio de Desarrollador.
Si queremos ver a nuestra app en accin, debemos ir a Ver el Contenido del Sitio, donde
aparece un listado con todas las apps instaladas.
Figura 3-17. Listado de Apps en el Contenido de Sitio.
Haciendo clic en nuestra app, enlazamos con la pgina por defecto de la App Web que
tiene el comportamiento por defecto de la app, y que hace las veces de la app de Accin personalizada que andbamos buscando.
92
Figura 3-18. Resultado de la app Hola Mundo.
Y ya tenemos nuestra primera app para SharePoint 2013. Fcil, verdad? Obviamente, Visual
Studio 2012 lo ha hecho casi todo, por no decir todo. Es ahora donde empieza realmente nuestro trabajo como desarrolladores. Pero una vez que ya tenemos la app desplegada e instalada,
resulta ms fcil hacer las modificaciones que tengamos que hacer, aadir los componentes
que tengamos que aadir, y hacer de nuestra app el producto que queramos que sea.
93
App Parts
El proyecto que tenemos hasta ahora tiene la estructura ms bsica que un proyecto de
SharePoint apps puede tener. Tenemos nicamente una pgina ASP.NET (adems del resto de
archivos CSS, JavaScript, etc.), con la que construimos una app de Accin personalizada. No
obstante, dentro del mismo proyecto, podemos agregar ms apps de los dos tipos que restan, App Parts y de Accin personalizada. Podemos verlos agregando un nuevo elemento al
proyecto.
Figura 3-19. Tipos de Apps disponibles en SharePoint 2013.
Junto con elementos que ya conocemos como son Workflows, Mdulos, Columnas de sitio,
etc., tenemos el elemento Client Web Part (Host Web) que se corresponde con una App Part, y
el elemento UI Custom Action (Host Web).
Como ya hemos visto anteriormente, una App Part es bsicamente un iFrame que se inserta
en una pgina de SharePoint, del mismo modo que insertaramos una Web Part. El contenido
de ese iFrame es una pgina web que nosotros especificamos. Es importante no confundir una
App Part con una Web Part, ya que aunque en apariencia final puedan ser idnticos, son conceptos completamente distintos que se apoyan en tecnologas distintas.
En un proyecto de SharePoint Apps real, por organizacin y limpieza, puede ser ms interesante tener por cada tipo de app un proyecto de Visual Studio 2012 distinto. En nuestro
94
caso, vamos a agregar al proyecto que ya tenemos un nuevo elemento del tipo Client Web Part
(Host Web), es decir, una App Part, de manera que aunque en apariencia tendremos una nica
app que instalar, en realidad sern tres (contando el UI Custom Action App que aadiremos
despus).
As pues, aadimos una Client Web Part y la llamamos App Part. Una vez aadido, Visual
Studio 2012 nos muestra automticamente el fichero Elements.xml del mismo. En realidad,
una App Part, al igual que una app de Accin personalizada (UI Custom Action), est compuesta nicamente del fichero Elements.xml. Es dentro de este fichero, donde se hacen las
configuraciones, y se referencian los archivos necesarios de los que se sirven las apps para su
funcionamiento.
El aspecto que muestra el fichero Elements.xml por defecto es el siguiente:
<?xml version=1.0 encoding=utf-8?>

<Elements xmlns=http://schemas.microsoft.com/sharepoint/>
<ClientWebPart Name=Mi App Part Title=Mi App Part Title
Description=Mi App Part Description
DefaultWidth=300 DefaultHeight=200>
<Content Type=html Src= />
</ClientWebPart>
</Elements>

Con la etiqueta ClientWebPart se instancia la App Part y se definen las propiedades bsicas de sta, como son el nombre, ttulo, descripcin y tambin la anchura y altura del iFrame
que lo contiene. Para especificar el contenido de la App Part, o lo que es lo mismo, qu pgina
web se muestra en el iFrame, est la etiqueta Content. En esta etiqueta tenemos el atributo Src
para especificar el origen de la pgina que se mostrar en la App Part, y el atributo Type con
el que se dice de qu tipo es la pgina. Finalmente, para dar propiedades de configuracin a
la App Part, del mismo modo que podemos dar propiedades de configuracin a una Web Part,
tenemos las etiquetas Properties/Property.
<Properties>
<Property
Name=nombre
Type=string
RequiresDesignerPermission=true
95
DefaultValue=Mundo
WebCategory=Mis Propiedades
WebDisplayName=Nombre>
</Property>
</Properties>
El concepto es sencillo, la forma de configurar una App Part, es a travs de la QueryString. Y

los parmetros de configuracin que van en ella, los definimos en el documento Elements.xml
con las etiquetas Properties/Property. Podemos aadir tantas propiedades de configuracin
como queramos. Por cada propiedad, de manera similar a las propiedades de configuracin de una
Web Part, especificamos un nombre y el tipo, entre cuatro tipos posibles: cadena de texto (string),
entero (Int), lgico (bool) y enumerado (Enum). Tambin especificamos si se requieren permisos de
diseador para editar la propiedad, el valor por defecto de la misma, y el grupo en el que ubicar la
propiedad dentro del panel de configuracin de la App Part. Y, por ltimo, el nombre de la propiedad dentro del grupo mencionado.
Una vez tenemos las propiedades definidas, debemos volver a la etiqueta Content, para
agregar las propiedades que hemos definido, en la QueryString de la direccin de la pgina
que establecimos en el atributo Src. Para ello, debemos seguir el siguiente formato predefinido: ?prop1=_prop1_&prop2= _prop2_& prop3=_prop3_. Por lo que segn todo lo
dicho, el fichero Elements.xml para nuestra primera App Part, debe quedar de la siguiente
manera (podemos substituir todo el contenido, por el que sigue):
<?xml version=1.0 encoding=UTF-8?>

<ClientWebPart Title=Hola Mundo Name=Hola Mundo
Description=Mi primer AppPart!. >
<Content Src=~appWebUrl/Pages/AppPart.aspx?nombre=_nombre_
Type=html/>
<Properties>

<Property
Name=nombre
Type=string
DefaultValue=Mundo
WebCategory=Mis Propiedades
WebDisplayName=Nombre>

</Property>
</Properties>
</ClientWebPart>
</Elements>
96
Si nos fijamos, en el atributo Src de la etiqueta Content, estamos haciendo referencia a

la pgina AppPart.aspx, que an no hemos creado. Por lo que el siguiente paso es crear dicha
pgina, dentro del mdulo Pages. En esta pgina, lo que haremos es muy sencillo: analizamos la
QueryString en busca del parmetro nombre. Una vez tenemos el valor del mismo, lo insertamos en una etiqueta <span> al principio de la pgina. El resultado ser que la App Part, nos dar
un Hola Mundo! por defecto, o bien configuramos la propiedad nombre dentro del panel
de configuracin, para obtener un saludo personalizado.
<%@ Register Tagprefix=WebPartPages

Namespace=Microsoft.SharePoint.WebPartPages
Assembly=Microsoft.SharePoint, Version=15.0.0.0, Culture=neutral,
PublicKeyToken=71e9bce111e9429c %>
<WebPartPages:AllowFraming ID=allowframing runat=server />
<html>
<body>



<h1>Hola <span id=nombre></span>!</h1>



<script lang=javascript>
var params = document.URL.split(?)[1].split(&);
var nombre;

// Iterativamente extraemos los valores de la Query String, y

// almacenos su valor en variables.
for (var i = 0; i < params.length; i = i + 1){
var param = params[i].split(=);
if (param[0] == nombre) nombre = decodeURIComponent(param[1]);
}

// Finalmente, buscando la etiqueta correspondiente a partir de su

// ID, y le insertamos el texto correspondiente.
document.getElementById(nombre).innerText = nombre;
</script>
</body>
</html>
97
Ahora ya lo tenemos todo, por lo que solo nos queda volver a desplegar el proyecto y
probar nuestra App Part. Una vez hecho, vamos a cualquier pgina que tenga elementos de
publicacin. La pgina por defecto del Sitio de Desarrollador nos vale. Editamos la pgina, y
bajo la cinta contextual (Ribbon), nos vamos a la pestaa INSERT, y vemos que adems de
poder insertar Web Parts, como hasta ahora en las ediciones anteriores de SharePoint, tenemos tambin la opcin de insertar App Parts.
Figura 3-20. Botn para insertar App

Parts desde la cinta contextual (Ribbon)
En el listado que aparece debemos encontrar nuestra recin creada App Part, con el nombre de Hola Mundo.
Figura 3-21. Listado de App Parts disponibles en un sitio de SharePoint 2013.
Lo aadimos, y automticamente lanzamos un cordial saludo al mundo mundial.
Figura 3-22. Resultado de nuestra primera App Part
Si somos curiosos (y lo somos), podemos indagar un poco en el funcionamiento interno

de la App Part. Mediante las herramientas del desarrollador de Internet Explorer (F12 para los
98
amigos), podemos comprobar cmo efectivamente, una vez insertamos la App Part en la pgina,
lo que realmente estamos insertado es sencillamente un iFrame que muestra el contenido de
una pgina externa.
Figura 3-23. iFrame generado por una App Part!
Adems, en la URL de la propiedad Src del iFrame, vemos como automticamente se

forma la QueryString con las propiedades de configuracin que especificamos,
http://app-b85358d732ed70.apps.devsite.local/HolaMundoApp/Pages/AppPart.aspx?nombre=Mundo
Lo ltimo que nos queda por ver es el panel de configuracin de la App Part, para comprobar que los parmetros de configuracin que especificamos en el fichero Elements.xml, efectivamente aparecen bajo el grupo y nombre que indicamos. Adems, segn la lgica que
establecimos en la pgina que referenciamos en la App Part, cambiando la propiedad nombre,
cambiaremos el destinatario del saludo. Para ello, editamos la pgina de nuevo y editamos la
App Part, del mismo modo que editaramos una Web Part.
99
Figura 3-24. Panel de configuracin de la App Part.
Vemos, como a parte de las propiedades que podemos encontrar en cualquier Web Part, y
que son comunes con una App Part, tenemos una seccin con el grupo y las propiedades que
definimos en el Elements.xml. Si por ejemplo, cambiamos el valor de la propiedad Nombre,
deberamos cambiar el destinatario del saludo, segn la lgica que implementamos en la
pgina.
Figura 3-25. Resultado de la App Part una vez modificadaos los parmetros de
configuracin.
Y hasta aqu llegamos con la configuracin y desarrollo de nuestra primera App Part. Como
vemos, es un ejemplo muy sencillo, pero sienta las bases de futuros desarrollos ms complejos.
Como se puede vislumbrar, el potencial de las App Parts es incrustar en pginas SharePoint
100
contenido de cualquier tipo, desarrollado con prcticamente cualquier tecnologa, y con la

ventaja de aislar a SharePoint de todo el procesamiento.
UI Custom Actions Apps

Para terminar de ver y tocar todos los tipos de apps que hay disponibles, nos falta hacer
nuestro particular Hola Mundo con una UI Custom Action App. Este tipo de app permite
crear botones personalizados en la cinta contextual, y tambin en el men desplegable de un
elemento de lista. Si hemos hecho alguna personalizacin de este tipo para SharePoint 2010,
la forma de proceder es prcticamente la misma. Una vez agregado al proyecto de SharePoint
App un elemento del tipo UI Custom Action (Host Web), automticamente Visual Studio 2012
nos muestra el fichero Elements.xml del mismo, al igual que ocurra con las App Parts. Dentro
de dicho fichero crearemos los botones personalizados para la cinta contextual, o los enlaces
en el men desplegable, referenciando siempre stos a pginas externas donde se realiza la
lgica de negocio que queramos. Para implementar dicha lgica, podemos usar parmetros
del elemento asociado con el botn personalizado, como su ID y ttulo, la lista o sitio al que
pertenece, etc. Bueno, como dira aquel, no lo explico, lo hago.
Volvemos a aadir un elemento al proyecto que tenemos; esta vez del tipo UI Custom
Action App (Host Web). Le damos como nombre CustomAction. Automticamente se abre el
fichero Elements.xml asociado. El aspecto del mismo es el siguiente:


<CustomAction Id=f0dca5d0-ed9d-484c-a4e4-09c4f89efb36.HostWebCustomAction1

RegistrationType=List

RegistrationId=100

Location=EditControlBlock

Sequence=100

Title=Invoke HostWebCustomAction1 action>
<!-Update the Url below to the page you want the custom action to use.
Start the URL with the token ~remoteAppUrl if the page is in a
separate web project, use ~appWebUrl if page is in the app project.
-->
<UrlAction Url=~remoteAppUrl/Default.aspx?{StandardTokens} />
</CustomAction>
</Elements>
101
Por medio de la etiqueta CustomAction definimos una accin personalizada con sus parmetros, del mismo modo que haramos en SharePoint 2010. Por defecto, tenemos una Accin
personalizada asociada al men desplegable (EditControlBloc), para cada elemento de una
lista genrica. Y para definir la accin que se lleva a cabo, est la etiqueta UrlAction, al igual
que en SharePoint 2010. Como vemos, la forma de trabajar es idntica con respecto a la versin
anterior de SharePoint. La novedad en este punto, es que en el atributo Url podemos formar
parmetros en la QueryString, cuyo valor provenga de una palabra reservada, que indica informacin sobre el sitio donde est alojada el botn. Esto lo veremos una vez hayamos sustituido
el contenido del fichero Elements.xml por el que sigue:

<CustomAction
Id=47708c0a-505a-4db1-b424-989328b7abfb.CustomAction
RegistrationId=101
Sequence=114
Title=Hola Mundo!>
<UrlAction Url=~appWebUrl/Pages/CustomAction.html?HostUrl={HostUrl}&
Source={Source}&ListURLDir={ListUrlDir}&
ListID={ListId}
&ItemURL={ItemUrl}&ItemID={ItemId}/>
</CustomAction>
<CustomAction Id=75dd24d9-0c16-4ef5-be0a-f52ed0e620fa.CustomAction
RegistrationId=101
Location=CommandUI.Ribbon
Sequence=115
Title=Invoke custom action>
<CommandUIExtension>
<CommandUIDefinitions>
<CommandUIDefinition Location =
Ribbon.Documents.Manage.Controls._children>

<Button
Id=Ribbon.Library.Connect.PropertyViewer
Alt=Hola Mundo!
Sequence=100
Command=Invoke_CustomAction
LabelText=Hola Mundo!
TemplateAlias=o1
102
Image32by32=/_layouts/15/1033/images/formatmap32x32.png
Image32by32Left=-137
Image32by32Top=-137/>
</CommandUIDefinition>
</CommandUIDefinitions>
<CommandUIHandlers>
<CommandUIHandler
CommandAction=
~appWebUrl/Pages/CustomAction.html?HostUrl={HostUrl} &
SelectedListID={SelectedListId}&
SelectedItemID={SelectedItemId}/>
</CommandUIHandlers>
</CommandUIExtension>
</CustomAction>
</Elements>
Definimos dos Acciones personalizadas, una para el men despegable de un elemento de

una biblioteca de documentos (ntese el RegistrationID=101), y otro para el mismo elemento,
pero en este caso en forma de botn en la cinta contextual.
Para ambos casos, la forma de proceder sigue siendo la misma con respecto a SharePoint
2010. Solo cambia el hecho que comentbamos anteriormente, de poder enviar parmetros
referentes al elemento que desencadena la accin, en la QueryString de la pgina que contiene la
lgica. Concretamente, si nos fijamos en el valor del atributo Url de la etiqueta UrlAction, vemos
que en la QueryString estn las siguientes palabras reservadas:
Hosturl -> URL del sitio donde est instala la app.
Source -> URL de la pgina desde donde se inicia la Accin personalizada.
ListUrlDir -> URL relativa con respecto al sitio de la lista.
SelectedListID -> ID de la lista que contiene el elemento que inicia la Accin.
SelectedItemID -> ID del elemento que desencadena la Accin personalizada.
Finalmente, solo queda crear la pgina que contiene la lgica, la cual se est referenciando
desde el fichero Elements.xml, en la citada etiqueta UrlAction. Para ello, una vez ms, dentro
del mdulo Pages aadimos una pgina, pera esta vez, de HTML bsico, en vez de ASP.NET.
Llamamos a la pgina CustionAction.html, y le damos el siguiente contenido:
103
<!DOCTYPE html>
<html xmlns=http://www.w3.org/1999/xhtml>
<head>
<title>Mi Accin Personalizada (Custom Action)</title>
</head>
<body>
<h2>Parmetros de la Query String pasados por la Accin personalizada

(Custom Action):</h2>


<ul id=qsparams/>
<script lang=javascript>


var paramsHTML = ;

// Extracts the parameters from the query string.

// Parameters are URLencoded, decode for rendering

// in page.

for (var i = 0; i < params.length; i = i + 1)

{

params[i] = decodeURIComponent(params[i]);

paramsHTML += <li> + params[i] + </li>;

}

// Render parameters in the placeholder.

document.getElementById(qsparams).innerHTML = paramsHTML;
</script>
</body>
</html>
Como se ve, estamos usando HTML 5 bsico, con todo lo que ello supone en cuanto a
poder utilizar todas sus nuevas etiquetas de video, audio, etc. Extraemos los parmetros de la
QueryString, y mediante JavaScript los insertamos en la pgina con su nombre y valor.
As pues, volvemos a desplegar el proyecto desde Visual Studio 2012, para actualizar nuestra app. Una vez hecho, nos dirigimos a alguna biblioteca de documentos, y ser necesario que
aadamos algn documento a la misma. Una vez lo hagamos, podremos ver los siguientes
elementos dese la interfaz de usuario.
104
Figura 3-26. Nuestra App en la cinta contextual.
El resultado final es que ambos botones enlazan con la siguiente pgina, donde se estn
mostrando parmetros de la lista en cuestin:
Figura 3-28. Resultado de nuestra app de Accin personalizada.
105
Maquetacin y diseo de apps

Introduccin
En el proceso de desarrollo de una app para SharePoint 2013, as como prcticamente para
cualquier otra plataforma, sucede que muchas veces son tan importantes los engranajes del
interior, como el envoltorio exterior con el que se presenta. E incluso dicho envoltorio puede
resultar tanto o ms costoso de llevar a cabo. Pero no debemos olvidar, que si bien SharePoint
2013 puede ser muchas cosas, la base es la de una plataforma de colaboracin basada en la
Web. Por ello, el desarrollador SharePoint 2013 debe saber hacer tanto que los engranajes de
su Web Part no paren de girar, como que la presentacin luzca bien. Es la conocida dualidad
desarrollador/diseador (e incluso administrador) con la que el programador SharePoint debe
saber convivir.
En el marco en el que nos encontramos, a saber, el desarrollo de SharePoint apps, stas,
aunque si bien pueden ser orientadas a un catlogo interno empresarial donde tal vez se le
preste menos importancia a la presentacin en lugar de la funcionalidad, lo ms comn es
que cuando se desarrolla una app, se haga pensado en llegar al mayor nmero de usuarios
posibles. Usuarios, que pueden tener su portal SharePoint de cualquier manera. Y por ello, se
debe proveer a nuestra app de mecanismos para permitir que encajen y se adapten al mayor
nmero de entornos posibles. Pudiera ser la app que por s misma resolviera los misterios
del Universo, que si toda maana al acceder a nuestro SharePoint tuviramos la sensacin
de haber instalado un parche, estaramos fallando en algo tan importante, como es que sea
apetecible (se me ocurre patentar appetecible) para el usuario.
Adems, para conseguir adaptar y conseguir que nuestra app encaje con los estilos del
entorno que la rodea debemos tener muy en cuenta, ya que determinar nuestra forma de
proceder, si nuestra app va a estar alojada en el propio SharePoint (SharePoint-hosted), o por
el contrario, va a estar alojada en la Nube (Cloud-hosted). La distincin se debe a que segn
donde se aloje la app, podremos utilizar para su desarrollo unas tecnologas web u otras. Por
ejemplo, para las SharePoint-hosted, como ya hemos visto en captulos anteriores, SharePoint
2013 crea un sitio (un SPWeb) para alojar la app. Este sitio se crea a partir de una nueva plantilla de sitio especfica para apps, la cual aplica por defecto en el sitio raz, una nueva pgina
maestra de la que hablaremos ms tarde. Es decir, tecnologa ASP.NET que ya conocemos de
versiones anteriores de SharePoint, por lo que las consideraciones a tener en cuenta en cuanto
a cmo aplicar estilos, diseos, maquetado etc., en su mayora ya las conocemos. Por el contrario, cuando tratamos con apps del tipo Cloud-hosted, no tenemos limitacin en cuanto qu
tecnologa usar para maquetar y disear la app. Podemos usar tanto PHP, HTML bsico, ASP.
NET como cualquier otra tecnologa con la que nos sintamos cmodos (lo cual amplia enormemente el rango de desarrolladores capaces para desarrollar apps para SharePoint 2013).
106
Por tanto, las opciones para maquetar y diseas apps, son prcticamente ilimitadas. En
ambos casos, SharePoint 2013 proporciona herramientas al desarrollador para conseguir cumplir con el objetivo de que nuestra app, a parte de funcional sea bonita. Y adems, que sea
bonita, respetando lo bonito que ya es el sitio que la contiene.
Vuelven los iFrames

En realidad nunca se fueron. Pero s han recobrado fuerza. E incluso pudiera pensar alguno
que es un nuevo invento de la empresa de la manzana. Pero no es as. Los iFrames llevan en
el mundo del desarrollo web prcticamente desde los inicios. Pero si bien hace una dcada, se
consideraba una mala prctica su uso, hoy en da es pieza clave en la arquitectura de apps de
SharePoint 2013, as como de otras arquitecturas de apps, como la de Facebook. Y si lo analizamos, tiene todo el sentido del mundo que sea as. En el caso de SharePoint 2013, ya sabemos
que las aplicaciones viven completamente aisladas del sitio SharePoint donde se instalan.
Incluso las apps del tipo SharePoint-hosted, tienen su propio entorno con un dominio aislado.
De qu otra forma bamos a poder incrustar el contenido de un sitio web aislado dentro de
otro? Es cierto, tal vez existan otros mecanismos, mejores o peores, como pudiera ser el uso
de JavaScript. Pero la curva de aprendizaje con iFrames es prcticamente nula, ya que es un
elemento que en mayor o menor medida todo desarrollador conoce.
No obstante, los iFrames siguen presentando limitaciones, tanto a nivel de seguridad,
como de integracin con el entorno raz a tener cuenta. Por ejemplo, tenemos la problemtica
de redimensionar el tamao del iFrame segn la resolucin de pantalla del usuario. As como
tambin, la comunicacin entre el entorno raz, y el iFrame, y los conocidos problemas de
cross-domain. Esta clase de limitaciones se han tenido en cuenta en SharePoint 2013, y se le
proporcionan al desarrollador mecanismos de manera que la percepcin para el desarrollador
se asemeje (al menos en cuanto a diseo y experiencia de usuario se refiere), a la que podra
ser el desarrollo de un Web Part para SharePoint.
Cmo y cundo hace uso SharePoint 2013 de los iFrames? Bien, como ya sabemos, existen
bsicamente dos formas de mostrar el contenido de una app. La primera de ellas es mediante el
conocido modo Pgina completa. En este caso, se accede a la app desde un enlace, o una Accin
personalizada, que redirige hacia la app web desde donde se muestra el contenido de la app,
ocupando toda el rea visible del navegador. No debemos olvidar que lo que estamos haciendo
es navegar hacia otra aplicacin web completamente distinta, con respecto a la aplicacin web
desde donde se lanz la app. Por lo tanto, en este caso no tenemos iFrames. Pero es labor del
diseador conseguir, que de cara al usuario, parezca que nos mantenemos en el mismo sitio,
respetando los estilos y maquetacin del sitio origen. La otra opcin para mostrar apps, son
las App Parts. Las App Parts, como ya hemos visto, son en ltima instancia una pgina dentro
de otra. Lo cual es, bsicamente, la definicin de un iFrame. Aunque tambin es posible, como
veremos, hacer uso de las ventanas modales (Modal Dialogs) que ya conocemos de SharePoint
107
2010, para mostrar el contenido de una app, usando igualmente iFrames, pero alterados por
SharePoint 2013.
As pues, e insistiendo en lo que considero que es el punto clave en la maquetacin y
diseo de apps para SharePoint 2013, el desarrollador de una app para SharePoint 2013 debe
tener presente en todo momento que el SharePoint donde vaya a instalarse finalmente su app,
puede variar enormemente, con respecto al de otros usuarios. Es su labor conseguir, que su
app se adapte perfectamente, y encaje dentro de los estilos y maquetacin, sea cual fueren
estos, en cualquier escenario. Cmo podemos conseguir esto sin morir en el intento? Bien, la
cuestin es adaptar la solucin, segn al tipo de problema, o mejor dicho, al tipo de app.
No perder el enfoque
A modo de conclusin final, antes de meternos de lleno en el diseo apps, me gustara
recalcar algo de lo que ya hemos hablado brevemente antes. Es importante no confundir cul
es el objetivo cuando hablamos de maquetacin y diseo de apps. Habr observado el lector,
que en ningn momento ha aparecido la palara branding, para referirnos al diseo y maquetacin de apps. Y no es casual. Hablamos de branding cuando aplicamos estilos corporativos
(colores, fuentes, logos, etc.) de una marca para una intranet, web pblica, blog, etc. Es en este
caso, cuando usamos todos los recursos que estn a nuestra disposicin, (los recursos que
ofrece SharePoint en este caso) y todos los trucos que podamos. Pero ahora, no estamos
hablando de branding. Estamos hablando de cmo puedo hacer que mi app encaje con los
estilos que ya existen, o mejor dicho, con el branding que ya existe, en la aplicacin web donde
vaya a parar mi app. se debe ser nuestro enfoque, y a eso va dedicado este captulo. Es por
ello, que no tiene sentido que tratemos de reinventar la rueda, haciendo trabajos innecesarios.
SharePoint 2013 ya ofrece mecanismos para el diseo de apps, precisamente con ese objetivo:
tener una app plenamente funcional, con un acabo visual acorde con el resto de elementos de
la pgina, sin tener que dedicarle ms tiempo a lo segundo que a lo primero. As pues, vamos
a ver cules son esos mecanismos.
SharePoint-hosted Apps
Tal vez, la forma ms rpida de comprender y familiarizarse con las apps para SharePoint
2013, sea mediante las SharePoint-hosted Apps, en el sentido de que se apoyan en elementos
de SharePoint que podemos conocer de versiones anteriores. En captulos anteriores, hemos
hablado ampliamente sobre cmo funcionan las SharePoint-hosted Apps por debajo, qu
las distingue de las Cloud-hosted Apps, as como sus ventajas e inconvenientes. En este caso,
vamos a desmenuzar este tipo de apps, pero para ver cmo podemos sacarles todo el jugo en
cuanto a maquetacin y diseo se refiere.
108
Es fcil perderse con tanta nomenclatura nueva en SharePoint 2013, sobre todo en cuanto
al nuevo modelo de desarrollo de apps se refiere. Pero en realidad hay que tener el esquema
en la cabeza, y no perder de vista que existen tres tipos de apps que podemos alojar de tres
formas distintas. Centrndonos en maquetacin y diseo de apps se refiere, nos va a importar
si la app se aloja en SharePoint (SharePoint-hosted) o lo hace en la Nube (Provider-hosted y
Autohosted). Si es el primer caso, partimos con mucho trabajo hecho, y adems contamos con
una base importante de conocimientos, si ya hemos trabajado con versiones anteriores de
SharePoint. Y es que, simplificando al mximo las SharePoint-hosted Apps, stas no son ms
que pginas (usualmente ASP.NET, pero tambin puede ser HTML bsico) dentro de SharePoint.
La peculiaridad la tiene dicho sitio en s (que programticamente no deja de ser un objeto
SPWeb), ya que no es accesible del mismo que el resto de sitios de SharePoint, y presenta una
serie de restricciones.
Es probable que el lector ya se est planteando cuestiones del tipo si es un sitio de
SharePoint normal y corriente el que contiene a la app, qu pagina maestra se usa? Es posible modificar dicha pgina maestra? Puedo usar una pgina maestra propia? Puedo crear
diseos de pgina (layouts)? Qu estilos CSS y archivos JavaScript se aplican? En adelante,
trataremos de dar respuesta a estas y otras preguntas con el objetivo de tener presente cules
son las herramientas con las que contamos a la hora de maquetar SharePoint-hosted Apps, en
cualquiera de sus tres variantes y cul es la forma ms eficiente de hacerlo. Y el primer paso
para ello es diseccionar un proyecto de Visual Studio 2012 de una SharePoint-hosted App, y ver
qu elementos lo compone.
Estructura de un proyecto SharePoint-hosted

As pues, recin creado un proyecto de SharePoint-hosted App en Visual Studio 2012, tenemos la siguiente estructura en el mismo:
109
Figura 3-27. Nuestra App en el men desplegable
Vemos que se trata de un proyecto muy parecido, por no decir idntico, al proyecto tpico
de una solucin para SharePoint 2010. Nos tiene que llamar la atencin que el proyecto cuenta
con cuatro mdulos para proveer de archivos al sitio SharePoint. As pues, tenemos el mdulo
Content, para desplegar la hoja de estilos App.css. El mdulo Images, donde por defecto se
ubica a la imagen del icono de la app, pero que pudiramos usar para aadir ms imgenes.
Un mdulo Pages para desplegar pginas, que son en ltima instancia la app, s. Y por ltimo,
un mdulo Scripts para desplegar archivos JavaScript (entre ellos, vemos como hay una versin de jQuery). Por lo tanto, el pensamiento que debemos tener al ver este tipo de proyecto,
es que es un proyecto clsico para desplegar archivos. Archivos que utilizaremos, finalmente,
para maquetar y disear nuestra app.
Por ejemplo, si abrimos el archivo de hoja de estilos App.css, solo encontraremos en l
una lnea a modo de comentario, invitndonos a introducir nuestros estilos personalizados en
dicho archivo. Tambin podemos, obviamente, crear uno o varios archivos de hojas de estilos
como, y referenciarlos desde la pgina en cuestin. De igual modo, para el cdigo JavaScript
que queramos aadir a nuestra app, tenemos el fichero App.js. Este fichero no est vaco,
cuenta con algunas funciones en su interior, pero perfectamente podemos borrarlas ya que
nicamente se usan para el Hola Mundo, a modo de ejemplo de la app. No obstante, antes
de borrar a lo loco, vamos a fijarnos (y adems viene muy bien comentado), en que existe una
funcin que est siendo llamada desde un jQuery(document).ready() que se encuentra en la
pgina default.aspx. La funcin sharePointReady().
110
// Esta funcin se ejecuta cuando el DOM est listo y los scripts de

// SharePoint se han cargado Aadir en este funcin el cdigo que se quiera
// ejecutar cuando Default.aspx est lsto Se crea un objecto de contexto que
// es necesario para utilizar el modelo de objectos de SharePoint
function sharePointReady() {
context = new SP.ClientContext.get_current();
web = context.get_web();
getUserName();
}
Es decir, cuando llegamos a esta funcin, el DOM de la pgina -adems del resto de scripts
de SharePoint- estn cargados, por lo que podemos usarla para realizar el resto de llamadas
a las funciones e iniciar nuestra lgica de JavaScript. Para ello debemos asegurarnos de tener
antes el siguiente script:



<script type=text/javascript>

$(document).ready(function () {

SP.SOD.executeFunc(sp.js, SP.ClientContext,

function () { sharePointReady(); });
});
</script>
Finalmente, en el mdulo Pages podemos aadir nuevas pginas, y usar stas para la app
de Pgina completa (que como sabemos, es la app por defecto del proyecto), modificando el
fichero AppManifest.xml, o para otras apps que incluyamos en el proyecto, ya sean de Accin
personalizada o App Part. Ms adelante, hablaremos ms en detalle sobre las pginas que
componen una SharePoint-hosted App.
Aunque no lo he mencionado explcitamente, por que en realidad es el mismo comportamiento que en SharePoint 2010, debemos fijarnos en que, en cuanto aadimos un nuevo
111
archivo a un mdulo, automticamente en el fichero Elements.xml asociado se incluye las referencias al nuevo archivo, indicando hacia dnde debe ser desplegado en SharePoint.
App.master
App.master es una nueva pgina maestra que trae SharePoint 2013, que se aplica al sitio
SharePoint que se crea para alojar la app. Es decir, si en una SharePoint-hosted App estamos
tratando en todo momento con elementos naturales de SharePoint (porque insisto, programticamente no deja de ser un objeto SPWeb donde se aloja la app), tambin es lo natural, que
se aplique una pgina maestra como las habituales. Lo cual plantea a su vez otras preguntas,
qu tiene de particular dicha pgina maestra? En realidad no tiene nada de particular, solo que
hay ciertos componentes que desaparecen en comparacin con, por ejemplo, la nueva V15.
master. Por ejemplo, la mayora de elementos de la cinta contextual (Ribbon) no estn, (como
es lgico). Es decir, es una app, no un portal. Sobre todo, no perdamos ese foco de la cabeza,
en cuanto a maquetacin y diseo se refiere, tratando de hacer cosas innecesarias.
Podemos modificar dicha pgina maestra? Como poder, en cuanto a tener la capacidad
fsica para acceder a la ruta \15\TEMPLATE\GLOBAL\ y editar el archivo app.master, s, podemos.
Ahora bien, automticamente hagamos alguna modificacin en dicho fichero, debemos ser
conscientes de tres cosas. La primera, la tpica, en cuanto haya una actualizacin de SharePoint,
puede ser que perdamos los cambios que hayamos hecho; la segunda, aun no habiendo encontrado confirmacin oficial por la documentacin de Microsoft, es de suponer, dado lo poco que
les gusta a los de Redmond que les busquen las cosquillas, que supondra perder el soporte;
y la tercera, pero no menos importante, es que cualquier cambio que hagamos, se aplicar a
todas las apps que tengamos, ya que en todas se usa la app.master. Lo cual plantea la siguiente
pregunta: podemos usar pginas maestras propias? Voy a intentar responder a esta pregunta
desde dos enfoques distintos. El primero, el del programador SharePoint que soy. Como tal,
s que aunque desde la interfaz de usuario de una app no tenga modo de cambiar la pgina
maestra (porque no lo tengo), tambin s, que mediante PowerShell, y dos cmd-lets, todo es
posible. Ahora bien, ese no es para nada el objetivo. Y aqu viene el otro enfoque, el enfoque
prctico. Como deca anteriormente, estamos hablando de desarrollar apps. Y una app no es
un portal web, ni una web pblica, ni nada parecido. Es un aadido de funcionalidad que
insertamos en un sitio SharePoint, que s puede ser una web pblica, o intranet. Por tanto, no
debemos rompernos la cabeza en ver cmo podemos modificar la pgina maestra o cosas por
el estilo. En su lugar, debemos pensar -y ese es el objetivo primordial- en cmo puedo hacer
que mi app se camufle, es decir, se adapte a los estilos de la pgina que la contiene. Y para
conseguir eso mismo, como veremos, SharePoint 2013 ofrece una serie de mecanismos para
que maquetar y disear apps sea una tarea sencilla y no un desafo.
112
Diseos de Pginas (page layouts)

Dado que acabamos de hablar de pginas maestras, y que somos unos desarrolladores/diseadores de SharePoint realmente muy curiosos Qu hay de diseos de pginas
(page layouts) en una SharePoint-hosted App? Bien, como sabemos, las pginas maestras en
SharePoint trabajan en combinacin con los diseos de pginas. A grandes rasgos, se definen
huecos en las pginas maestras, mediante los controles ContentPlaceHolders, y dichos huecos se rellenan despus desde los diseos de pginas12. Por lo tanto, si ya sabemos que tenemos una pgina maestra para las apps, por algn lado tienen que estar los diseos de pgina.
Y en realidad, ese diseo de pgina (page layout) ha estado con nosotros desde que creamos
el proyecto en Visual Studio 2012. Solo tenemos que examinar el cdigo de la pgina default.
aspx que veamos anteriormente, para comprobar que efectivamente es as.
...
...
...
<%-- The markup and script in the following Content element will be placed in
the <head> of the page --%>
<asp:Content ContentPlaceHolderId=PlaceHolderAdditionalPageHead
runat=server>
<script type=text/javascript src=../Scripts/jquery-1.6.2.min.js>
</script>

<link rel=Stylesheet type=text/css href=../Content/App.css />

<script type=text/javascript src=../Scripts/App.js></script>
...
...
...
</asp:Content>
<%-- The markup and script in the following Content element will be placed in
the <body> of the page --%>
<asp:Content ContentPlaceHolderId=PlaceHolderMain runat=server>
<div>
...
...
12
Para ms informacin sobre el funcionamiento de las pginas maestras, y diseos de pgina, consulte esta documentacin; http://msdn.microsoft.com/en-us/library/wtxbf3hh(v=vs.100).aspx#HowMasterPagesWork
113
...
</div>
</asp:Content>
Vemos qu se usan dos ContenPlaceHolder: PlaceHolderAdditionalPageHead

y PlaceHolderMain. Como se dice en los comentarios que acompaan al cdigo,
PlaceHolderAdditionalPageHead para aadir referencias en la cabecera de la pgina (etiqueta
head), y PlaceHolderMain para definir el cuerpo de la pgina (etiqueta body). Es decir, la pgina
default.aspx, gracias a las referencias que incluye, puede ser considerada a efectos de desarrollo, un diseo de pgina (page layout) de SharePoint normal y corriente. De hecho, podramos examinar la app.master en busca del resto de ContentPlaceHolder que se estn usando
para la maquetacin, para as poder rellenarlos desde nuestra pgina.
Figura 3-30. ContentPlaceHolders visibles en la app.master
En realidad los dos ContentPlaceHolder que hemos mencionado, son los nicos que realmente necesitamos para maquetar y dar estilos a una SharePoint-hosted App. Es por ello, que
cuando aadimos un nuevo elemento al proyecto, bajo la seccin de Office/SharePoint, encontramos el elemento Page (pgina).
114
Figura 3-31. Diseos de pgina en las SharePoint-hosted Apps
Por tanto, las pginas que aadimos usando la plantilla de pgina disponible para las apps
de SharePoint son pginas ASP.NET ya preparadas (incluyen las referencias) para usarse en el
contexto de una SharePoint-hosted App. Aunque tambin podemos decirle a nuestra app que
no haga uso de la app.master, y use una pgina en HTML bsico, donde nosotros debemos de
realizar absolutamente todo el desarrollo desde cero.
Ahora que hemos visto cmo se maqueta una app que se aloja en SharePoint, podemos
entender por qu una SharePoint-hosted App limpia, es decir, tal cual viene con la plantilla
de Visual Studio 2012, no se muestra como una pgina sin estilos cuando la desplegamos, si
no que visualmente se comporta como cualquier pgina dentro de SharePoint. Esto mismo
no sucede, con las Cloud-hosted Apps, ya que una Cloud-hosted App no se apoya en pginas
maestras ni diseos de pgina. En una Cloud-hosted App tenemos que maquetar y dar estilos
partiendo desde cero.
115
Figura 3-32. Comparacin entre una app limpia Cloud-hosted (1) y SharePoint-hosted
(2)
Esa es, precisamente, una de las ventajas de las SharePoint-hosted Apps. El objetivo de que
nuestra app se adapte y encaje con los estilos de SharePoint, y no parezca un postizo, se
consigue ms fcilmente con este tipo de apps. No obstante, como decamos anteriormente,
tambin podemos hacer que nuestra app use una pgina en HTML sin ninguna referencia a la
app.master. De esta forma, partiramos en las mismas condiciones que con una Cloud-hosted
App. Cmo podra hacer entonces, que mi app se adaptara a los estilos de SharePoint 2013?
Acaso no se puede conseguir que una Cloud-hosted App herede los estilos de SharePoint?
S, claro que se puede. Para ello SharePoint 2013 proporciona el Client Chrome Control, del
cual hablaremos en profundidad cuando hablemos de maquetacin y diseo para Cloudhosted Apps.
116
Apps Parts
A continuacin, vamos a hablar sobre esos mecanismos que mencionbamos anteriormente que nos van a permitir adaptar nuestra app a los estilos del entorno donde se muestra.
Concretamente, en esta ocasin vamos a centrarnos en las App Parts que se alojan en SharePoint
(SharePoint-hosted). Aunque lo que vamos a ver a continuacin, es igualmente vlido para las
Apps Parts que residen en la Nube (Cloud-hosted). El hecho de hablar ahora sobre la maquetacin y diseo de App Parts, bajo el contexto de las SharePoint-hosted Apps, se debe a que,
como ya hemos visto, las apps de Pgina completa en una SharePoint-hosted App, al emplear
la pgina maestra app.master, prcticamente ya estn en sintona con los estilos de SharePoint.
Por lo que hay poco que aadir en ese sentido en este momento. Hablaremos en profundidad
de los mecanismos que proporciona SharePoint para dar estilos a las apps de Pgina completa
en la seccin siguiente, dedicada al diseo y maquetacin de Cloud-hosted Apps. En ese caso,
s que estaremos obligados a poner de nuestra parte, ya que partiremos de un lienzo completamente en blanco.
En el caso de las App Parts, tambin conocidas como Client Web Parts, ya hemos visto
que su uso y visualizacin es muy similar al de los Elementos Web (Web Parts) tradicionales.
Pero para el caso que nos ocupa, es decir, ver la forma en la que se puede adaptar el diseo y
apariencia de una App Part con el entorno que la rodea, debemos tener presente, como vimos
anteriormente, que una App Part se visualiza mediante iFrames. Se podra equiparar la funcionalidad de una App Part, con la del Elemento Web Visor de pginas (Page Viewer WebPart)
presente en SharePoint desde versiones anteriores. Ambos realizan la tarea de mostrar el contenido de una pgina mediante un iFrame. La ventaja de las App Parts es que permiten enviar
parmetros de configuracin a la pgina a visualizar, as como establecer un contexto con el
sitio SharePoint anfitrin.
En adelante, veremos cmo podemos moldear una App Part para conseguir esa integracin con SharePoint que venimos buscando. Concretamente, analizaremos y veremos cmo
resolver los siguientes escenarios:
-- Usar los estilos de SharePoint en App Parts.
-- Acciones personalizadas, usando las ventanas modales de SharePoint.
117
Usar los estilos de SharePoint en App Parts

Partiendo de la base de que una App Part es un trozo de pgina que insertamos en
SharePoint, no tendra sentido que esa pgina que insertamos tenga a su vez elementos de
SharePoint, como la cinta contextual, men de navegacin, etc. Se podra producir una especie
de efecto Droste13.
Figura 3-33. Efecto Droste
Por lo que la pgina que usamos para mostrar en las App Parts, sern generalmente pginas HTML bsicas, sin ninguna referencia a SharePoint. Es decir, nos olvidamos de la app.master
y de los ContentPlaceHolder. Por lo tanto, de igual forma que sucede con las apps de Pgina
completa que se alojan en la Nube, no vamos a ver una concordancia entre los estilos de mi
app y los de SharePoint del sitio actual, a no ser que usemos algn mecanismo para tal fin. En
el caso de las apps en Pgina completa, veremos que tenemos el Client Chrome Control. En el
caso de las App Parts tenemos que asegurarnos de referenciar una hoja de estilos a modo de
comodn, que a su vez referencia los estilos que se estn utilizando actualmente. Vamos a ver
cmo, paso a paso.
13
http://es.wikipedia.org/wiki/Efecto_Droste
118
Paso a paso para referenciar los estilos de SharePoint en una App Part
Paso 1. Creamos un nuevo proyecto de SharePoint-hosted Apps, y le aadimos, segn la
nomenclatura que usa Visual Studio 2012, un Client Web Part (Host Web), que se corresponde
con una App Part.
Figura 3-34. Agregamos un App Part al proyecto
Paso 2. El siguiente paso es crear una nueva pgina, que constituir el contenido de nuestro App Part. Es en esta pgina donde deberemos hacer referencia a las clases CSS de SharePoint
que queramos utilizar, y en donde tambin, mediante JavaScript, haremos referencia a la hoja
de estilos comodn que nos va a permitir usar los estilos del sitio anfitrin.
Paso 3. A continuacin, tenemos que indicar a nuestro App Part, de dnde debe coger el
contenido. Es decir, hemos de modificar su archivo Elements.xml correspondiente:

<ClientWebPart Name=MiAppPart Title=MiAppPart
119
Description=MiAppPart DefaultWidth=1024
DefaultHeight=500>
<Content Src=~appWebUrl/Pages/AppPartPage.aspx?{StandardTokens}
Type=html/>
</ClientWebPart>
</Elements>
Como vemos, no estamos enviado parmetros adicionales al App Part, si no que estamos
usando el marcador14 StandarTokens, que engloba una serie de parmetros en la QueryString, sobre
el sitio actual.
Paso 4. En este paso, vamos a darle contenido a la pgina que creamos en el paso 2.
La idea es ver, que efectivamente, hay un antes y un despus referenciando la hoja de
estilos comodn y no hacindolo. Por eso en la pgina, de momento, no vamos a aadir
nada de JavaScript. Lo que s vamos a hacer es usar las clases CSS que utiliza SharePoint
2013 para dar estilos a los distintos tipos de textos que podemos tener en una pgina
dentro de SharePoint, como son ttulos, subttulos, secciones, subsecciones, etc. Por ejemplo, SharePoint 2013 utiliza la clase .ms-core-pageTitle15, para dar formato al ttulo principal de la pgina. Por ejemplo, podemos darle el siguiente contenido a la pgina:

Assembly=Microsoft.SharePoint, Version=15.0.0.0,
Culture=neutral, PublicKeyToken=71e9bce111e9429c %>
<!DOCTYPE html>
<head>
<title>Mi App Part usando estilos SharePoint</title>
</head>
<body>

<h1 class=ms-core-pageTitle>Hola Mundo!</h1>

<h1 class=ms-accentText>Usando los estilos de SharePoint...</h1>

<h2 class=ms-accentText>...para que queden las Apps bien bonitas
14
Para ms informacin y ver un listado completo de los marcadores que se pueden utilizar, consulte la siguiente pgina:
http://msdn.microsoft.com/en-us/library/ms431831(v=office.15).aspx
15
En la siguiente documentacin tenemos un listado completo de las clases CSS existentes que se usan en SharePoint, y en
qu casos se deben utilizar: http://msdn.microsoft.com/en-us/library/jj220046%28v=office.15%29.aspx#UXGuide_CSS
120
:)</h2><br />
<div>

<h2 class=ms-webpart-titleText>Usamos esta clase para el ttulo
de un WebPart</h2>

<a class=ms-commandLink href=#>este formato queda bien para
los enlaces</a>
<br />

Y para intrdocir un texto normal, si somos capaces de definir la
normalidad, no espeficamos ninguna clase CSS.
</div>
</body>
</html>
Seguidamente, depuramos desde Visual Studio para ver cmo queda nuestra App Part.
Figura 3-35. App Part sin aplicar estilos SharePoint
Como vemos, esto luce muy poco a lo SharePoint-style. Vamos a ver cmo podemos cambiar eso.
121
Paso 5. Para terminar, y hacer que nuestra App Part utilice los mismos estilos que se estn
utilizando en la pgina actual, incluimos el siguiente cdigo JavaScript en la cabecera de la pgina.
<script type=text/javascript>
var hostweburl;
(function () {
//Get the URI decoded app web URL.
hostweburl=decodeURIComponent(
getQueryStringParameter(SPHostUrl));
//La hoja css comodin que necesitamos, se encuentra bajo
//web_url/layouts/15/defaultcss.ashx
var scriptbase = hostweburl + /_layouts/15/;
var dclink =document.createElement(link);
dclink.setAttribute(rel, stylesheet);
dclink.setAttribute(href, scriptbase + defaultcss.ashx);
var head = document.getElementsByTagName(head);
//Aadimos la etiqueta link que acabamos de formar a la cabecera
//de pgina.
head[0].appendChild(dclink);
})();
// Funcin para obtener el valor de un parmetro de la Query String.
function getQueryStringParameter(paramToRetrieve) {
var strParams = ;
{
var singleParam = params[i].split(=);
if (singleParam[0] == paramToRetrieve) return singleParam[1];
}
}
</script>
122
Y el resultado es el siguiente:
Figura 3-36. Nuestra App Part una vez incluida la referencia la os estilos
Como vemos, con apenas dos funciones JavaScript, se consigue cambiar y adaptar la
apariencia de nuestra App Part completamente a los estilos del sitio actual.
Acciones Personalizadas usando las ventanas modales

Hemos hablado de las apps de Pgina completa y de las Apps Parts, por lo que solo nos
queda ver cmo personalizar el aspecto visual de las apps de Accin personalizada. Pudiera
pensar el lector por lo ledo hasta el momento en este libro, que una app del tipo Accin personalizada ofrece poco juego en cuanto a diseo y maquetacin, ya que como sabemos, a
este tipo de apps se accede desde la cinta contextual de SharePoint 2013, o en los mens de
edicin de elementos de listas o bibliotecas. Lo cierto es que estas apps son en funcionalidad
muy similares a las apps de Pgina completa, en el sentido de que son enlaces que envan al
usuario a una pgina que se encuentra en otra aplicacin web. Por lo que la personalizacin
de la app, debiera hacerse del mismo modo que para las apps en modo Pgina completa. La
salvedad, es que las apps de Accin personalizada, permiten una variante no vista hasta ahora,
y es la de visualizar apps dentro de los dilogos modales (modal dialogs) de SharePoint.
Si recordamos de SharePoint 2010, un dilogo modal es un mecanismo que se utiliza para
ofrecer una mayor interaccin con el usuario, permitiendo mostrar pginas en el mismo contexto de la pgina actual donde se encuentra el usuario.
123
Figura 3-37. Ejemplo de dilogo modal en SharePoint 2010.
Del mismo modo, podemos invocar dilogos modales, desde la app de Accin personalizada, con el objetivo de mantener al usuario en la misma pgina que se encuentra actualmente,
en vez de redirigirle a otro contexto. Resulta especialmente til esta opcin, para, por ejemplo,
el caso en el que queramos modificar propiedades de elementos de listas, o por ejemplo, crear
un editor personalizado con algunas opciones limitadas, etc. Las posibilidades son muy
amplias. Pasamos a ver cmo llevar esto a cabo.
Si recuperamos el proyecto que creamos en el captulo anterior, donde hicimos
un Hola Mundo introductorio con todos los tipos de apps, podemos volver a examinar el fichero Elements.xml que acompaa a la app de Accin personalizada, que en
aquel momento llamamos, en un acto tremendo de originalidad Accin personalizada.

<CustomAction
RegistrationId=101
Sequence=114
Title=Hola Mundo!>
<UrlAction Url=~appWebUrl/Pages/CustomAction.html?HostUrl={HostUrl}&
124
ListID={ListId}&ItemURL={ItemUrl}&ItemID={ItemId}/>
</CustomAction>
<CustomAction Id=75dd24d9-0c16-4ef5-be0a-f52ed0e620fa.CustomAction
RegistrationId=101
Location=CommandUI.Ribbon
Sequence=115
Title=Invoke custom action>
<CommandUIExtension>
<CommandUIDefinitions>
<CommandUIDefinition Location=Ribbon.Documents.Manage.Controls.
_children>
<Button
Id=Ribbon.Library.Connect.PropertyViewer
Alt=Hola Mundo!
Sequence=100
LabelText=Hola Mundo!
TemplateAlias=o1
Image32by32=/_layouts/15/1033/images/formatmap32x32.png
Image32by32Left=-137
Image32by32Top=-137/>
</CommandUIDefinition>
</CommandUIDefinitions>
<CommandUIHandlers>
<CommandUIHandler
CommandAction=~appWebUrl/Pages/CustomAction.html?HostUrl=
{HostUrl}& Source={Source}&
ListURLDir={ListUrlDir}&SelectedListID={SelectedListId}
&SelectedItemID={SelectedItemId}/>
</CommandUIHandlers>
</CommandUIExtension>
</CustomAction>
</Elements>
Vemos, que el fichero est compuesto por etiquetas CustomAction, y en las mismas definimos la accin que realizan, con la direccin de la pgina con la que enlazan, y los parmetros que se le envan a sta. Pues bien, para conseguir que la pgina que constituye la
app se abra en el mismo contexto de la pgina actual, solo hemos de aadir una propiedad
ms a la etiqueta CustomAction: la propiedad HostWebDialog. Esta propiedad indica que la
accin a realizar la debemos situar dentro de un dilogo modal. As de sencillo. Adems, podemos especificar el ancho y alto del dilogo modal, con las propiedades HostWebDialogWidth y
125
HostWebDialogHeight. Por lo tanto, la primera accin personalizada del fichero Elements.xml

anterior, quedara tal que as:
<CustomAction
RegistrationId=101
Sequence=114
Title=Hola Mundo!
HostWebDialog=TRUE
HostWebDialogWidth=500
HostWebDialogHeight=500>
<UrlAction Url=~appWebUrl/Pages/CustomAction.html?
HostUrl={HostUrl}& Source={Source}&ListURLDir={ListUrlDir}
&ListID={ListId}&
ItemURL={ItemUrl}&ItemID={ItemId}/>
</CustomAction>
Vista la teora, vamos a ir paso a paso construyendo una nueva Accin personalizada, para
ver a la misma en accin, y discutir finalmente, qu aspectos en cuanto a diseo y maquetacin
de la app debemos utilizar, segn los mecanismos vistas hasta el momento.
126
Paso a paso para usar ventanas modales en apps

Paso 1. Aadimos un nuevo elemento al proyecto que tenemos abierto en Visual Studio
2012, en este caso del tipo UI Custom Action (Host Web).
Figura 3-38. Aadimos una app de Accin Personalizada al proyecto.
Paso 2. Abrimos el fichero Elements.xml que compone la app de Accin personalizada que
acabamos de crear. Por defecto, vemos que el fichero contiene las lneas de cdigo necesarias
para crear una accin personalizada asociada al men de edicin de un elemento de lista.
Vamos a substituir todo el contenido del fichero, por el siguiente:

<CustomAction
RegistrationId=101
Sequence=114
127
Title=Click aqu!
HostWebDialog=TRUE
HostWebDialogWidth=500
HostWebDialogHeight=500>
<UrlAction Url=~appWebUrl/Pages/AppPartPage.aspx?{StandardTokens}/>
</CustomAction>
</Elements>
Donde lo que estamos haciendo es crear nuevamente una Accin personalizada asociada
al men desplegable de los elementos de una biblioteca de documentos. Dicha Accin personalizada, vemos que tiene asociada como la URL de accin (UrlAction) la misma pgina que
usamos para formar la App Part anterior. Y finalmente, usamos las propiedades que mencionbamos anteriormente, para permitir que la pgina se muestre dentro de una ventana o dilogo
modal.
El hecho de utilizar la misma pgina que utilizbamos para la App Part anterior no es una
casualidad, si no todo lo contrario. La ventana o dilogo modal con la que se muestra la app
de Accin personalizada es nuevamente un iFrame, solo que un iFrame con unos estilos propios que da automticamente el propio SharePoint mediante JavaScript y CSS que permiten
realzarlo. Por lo que siendo un iFrame como es, podemos usar los mismos mecanismos que
usamos para las App Parts, es decir, referenciar la hoja de estilos comodn default.ashx, y as
conseguir que la app de Accin personalizada, que se muestra dentro de un dilogo modal,
herede los estilos del sitio actual.
Paso 3. Solo queda depurar nuevamente el proyecto mediante Visual Studio, para comprobar cmo se comporta la app de Accin personalizada, y ver si efectivamente, como es de
esperar, obtiene los estilos del sitio actual, al estar utilizando la misma tcnica que usamos en
la App Part anterior para referenciar la hoja de estilos comodn. Para ello, una vez en modo
depuracin, accedemos a una biblioteca de documentos de SharePoint, donde tengamos al
menos un documento, y expandimos el men de edicin de un elemento.
128
Figura 3-39. Nueva opcin dentro del men de edicin
Vemos que efectivamente, contamos con la nueva opcin dentro del men de edicin del
elemento de la biblioteca de documentos. Vamos a ver a continuacin, cul es la accin que
realiza:
Figura 3-40. Resultado de la accin personalizada
Y aqu lo tenemos. Vemos que como era de esperar, mostramos el mismo contenido (la
misma pgina) que la App Part que desarrollamos anteriormente. En esta ocasin, estamos
usando una app de Accin personalizada, apoyndose en las posibilidades que ofrecen stas
en SharePoint 2013 de mostrar el contenido de las CustomAction, en ventanas modales.
129
Ejemplo prctico
A modo de resumen de todo lo visto hasta ahora, vamos a construir desde cero una
SharePoint-hosted App, donde veamos cul podra ser el proceso real de desarrollar una app
para SharePoint 2013. La idea es desarrollar una App Part que sirva para construir formularios
a medida. Es decir, nicamente configurando esta App Part, podemos aadir tantos campos
al formulario como queramos, del tipo que queramos, y en el orden que queramos. Suena
bien verdad? Para este ejemplo, y dado que estamos hablando de maquetacin y diseo, nos
vamos a centrar precisamente en eso, en maquetar y disear la app. Queda a cargo del lector,
una vez ledo el captulo siguiente donde hablaremos del Modelo de Objetos de Cliente y el
API Rest de SharePoint 2013, implementar la lgica de la app. Dicha lgica sera sencilla de
implementar; ya lo nico que tendra que hacer sera leer los valores del formulario y crear un
elemento con ellos en una lista de SharePoint. As pues, vamos paso a paso.
Paso a paso para hacer una app completa

Paso 1. El primer paso, y ms sencillo, es crear el proyecto para una SharePoint-hosted
App en Visual Studio 2012. Antes, deberamos haber creado una aplicacin web de SharePoint
desde la administracin central, usando la plantilla de Sitio del Desarrollador, tal y como
vimos en el captulo anterior.
Paso 2. En este momento ya tenemos una app de Pgina completa plenamente funcional.
El proyecto en limpio que crea Visual Studio 2012 para las SharePoint-hosted Apps, contiene
el cdigo y los archivos necesarios para crear una app a Pgina completa con el clsico Hola
Mundo. En nuestro caso vamos a construir una App Part, por lo que aadimos un nuevo elemento al proyecto del tipo Client Web Part.
Paso 3. Una vez aadido la App Part al proyecto, vamos a aadir en el mdulo Pages una
nueva pgina.
130
Figura 3-41. Aadir un elemento de tipo Pgina (Page) al Proyecto de Visual Studio
2012
Paso 4. En la pgina que acabamos de aadir al proyecto, vamos a escribir el cuerpo de la

app. Es decir, aqu es donde se maqueta la app. En este caso, podemos sustituir todo el contenido de la pgina, por el que sigue:

Assembly=Microsoft.SharePoint, Version=15.0.0.0, Culture=neutral,
PublicKeyToken=71e9bce111e9429c %>
<!DOCTYPE html>
<html>
<head>
<title>My Custom Form</title>

<script type=text/javascript src=../scripts/jquery-1.6.2.min.js>
</script>
<script type=text/javascript src=../scripts/App.js></script>

<link type=text/css rel=stylesheet href=../Content/App.css />
</head>
<body>
<form>
131

<div id=container>

<div class=title ms-core-pageTitle></div>

<div class=buttons></div>

</div>
</form>

</body>
</html>
Como vemos, usamos HTML5 bsico para maquetar la app. Nada extrao hasta aqu. Lo
nico que pudiera resultar raro es la lnea cdigo que aparece resaltada. Necesitamos incluir
el control AllowFraming (as como la referencia a la DLL que lo contiene), para poder permitir
que la pgina se visualice dentro un iFrame. De lo contrario obtendramos un error indicando,
literalmente: Este contenido no se puede mostrar en un iFrame (This contento cannot be
displayed in a frame).
Por otro lado, vemos que el cuerpo de la pgina es realmente muy sencillo. Esto es porque
realmente el contenido de la app lo vamos a generar dinmicamente mediante JavaScript.
Paso 5. En la pgina anterior tenemos la referencia al archivo App.css. En este paso vamos
a editar dicho archivo para definir los estilos que necesitamos. Por tanto, abrimos el archivo
App.css que se genera automticamente con el proyecto y se encuentra vaco, y aadimos el
siguiente contenido:
#container {
width:auto; float:left;
background-color:rgb(89, 192, 61);}
#container .register {
margin:0 0 10px 0;
padding:10px 40px 20px 40px;}
#container .register span.ms-commandLink {
width:50px;
margin-right:15px;
display:block; color:#FFF; }
#container .register input[type=text]{
width:300px;
height:25px;
color:rgb(89, 192, 61);}
#container .register select{
width:300px;}
#container .buttons {
132
margin-left:30px;
margin-bottom:30px;
margin-top:40px;}
#container .buttons button{
width:150px;
font-size:15px;
color:rgb(89, 192, 61);}
#container .title {
color:#FFF;
margin-left:40px;
margin-bottom:15px;
font-size:40pt;}
Paso 6. Ahora le toca el turno al JavaScript. Editamos el archivo App.js, y sustituimos todo
su contenido, por las siguientes funciones. Iremos comentando sobre la marcha para qu se
usa cada una.
var hostweburl;
(function () {
//Get the URI decoded app web URL.
hostweburl = decodeURIComponent(getQueryStringParameter(SPHostUrl));
var dclink = document.createElement(link);
dclink.setAttribute(rel, stylesheet);
dclink.setAttribute(href, scriptbase + defaultcss.ashx);
var head = document.getElementsByTagName(head);
head[0].appendChild(dclink);
})();


buildCustomForm();

formFocus();
}
En primer lugar, usamos el mecanismo que acabamos de ver para referenciar los estilos
de SharePoint en App Parts. A continuacin, en la funcin SharePointReady, que como ya vimos,
espera a que est cargado todo el DOM de la pgina, y tambin resto de archivos JavaScript
de SharePoint, hacemos el resto de llamadas a las funciones JavaScript.
133
function buildCustomForm() {
var order = (existsQueryStringParameter(order)) ?
getQueryStringParameter(order).split(;) : ;
var plain = (existsQueryStringParameter(plain)) ?
getQueryStringParameter(plain).split(;) : ;
var area = (existsQueryStringParameter(area)) ?
getQueryStringParameter(area).split(;) : ;
var radio = (existsQueryStringParameter(radio)) ?
getQueryStringParameter(radio).split(;) : ;
var check = (existsQueryStringParameter(check)) ?
getQueryStringParameter(check).split(;) : ;
var dropdown = (existsQueryStringParameter(dropdown)) ?
getQueryStringParameter(dropdown).split(;) : ;
var button = (existsQueryStringParameter(button)) ?
getQueryStringParameter(button).split(;) : ;
for (var i = 0; i < order.length; i++) {
//Cajas de texto plano
for (var j = 0; j < plain.length; j++) {
var label = plain[j];
if (label.toLowerCase() == order[i].toLowerCase()) {
jQuery(#container).append(<div class=register>
<span class=ms-commandLink> +
plain[j] + </span><input type=text/></div>);
break;
}
}
//Cajas de area de texto
for (var k = 0; k < area.length; k++) {
var label = area[k].substring(0, area[k].indexOf([));
if (label.toLowerCase() == order[i].toLowerCase()) {
var textArea = area[k].substring(area[k].indexOf([) + 1,
area[k].indexOf(]));
var rows = textArea.split(-)[0];
var cols = textArea.split(-)[1];
label + </span><textarea rows= + rows + cols= +
cols + /></div>);
break;
}
}
//Radio buttons
for (var m = 0; m < radio.length; m++) {
134
var name = radio[m].substring(0, radio[m].indexOf([));

if (name.toLowerCase() == order[i].toLowerCase()) {
var choices = radio[m].substring(radio[m].indexOf([) + 1,
radio[m].indexOf(])).split(-);
var result = ;
for (var n = 0; n < choices.length; n++) {
if (choices[n].charAt(0) == #) {
result += <input type=radio name= +
name.toLowerCase() + value= +
choices[n].replace(#, ).toLowerCase() +
CHECKED> + toTitleCase(choices[n].replace(#,
));
}
else {
result += <input type=radio name= +
choices[n].toLowerCase() + > +
toTitleCase(choices[n]);
}
}
toTitleCase(name) + </span> + result + </div>);
break;
}
}
//check buttons
for (var l = 0; l < check.length; l++) {
var name = check[l].substring(0, check[l].indexOf([));
var choices = check[l].substring(check[l].indexOf([) + 1,
check[l].indexOf(])).split(-);
var result = ;
for (var o = 0; o < choices.length; o++) {
if (choices[o].charAt(0) == #) {
result += <input type=checkbox name= +
choices[o].replace(#, ).toLowerCase() +
CHECKED> + toTitleCase(choices[o].replace(#,
));
}
else {
result += <input type=checkbox name= +
choices[o].toLowerCase() + > +
toTitleCase(choices[o]);
135
}
break;
}
//drop down list
for (var p = 0; p < dropdown.length; p++) {
var name = dropdown[p].substring(0, dropdown[p].indexOf([));
var choices = dropdown[p].substring(dropdown[p].indexOf([)
+ 1, dropdown[p].indexOf(])).split(-);
var result = <select>;
for (var q = 0; q < choices.length; q++) {
if (choices[q].charAt(0) == #) {
result += <option value= + choices[q].replace(#,
).toLowerCase() +
SELECTED> + toTitleCase(choices[q].replace(#,
)) + </option>;
}
else {
result += <option value= +
choices[q].toLowerCase() + > +
toTitleCase(choices[q]) + </option>;
}
}
result += </select>;
break;
}
//buttons
for (var r = 0; r < button.length; r++) {
var name = button[r].substring(0, button[r].indexOf([));
var type = button[r].substring(button[r].indexOf([) + 1,
button[r].indexOf(])).toLowerCase();
jQuery(#container > .buttons).append(<button type= +
type + > + toTitleCase(name) + </button>);
break;
}
136
}
//Aadimos el titulo
jQuery(#container > div.title.html(title.replace(%20, ));
//Movemos los botones al final del formulario
jQuery(#container).append(jQuery(#container > .buttons));
En esta funcin recae todo el peso de la lgica de la App Part. Lo que se hace en ella es nicamente consultar la QueryString en busca de una sera de parmetros concretos, y despus
formar los campos del formulario a partir de la informacin de estos parmetros. Cada uno de
estos parmetros se corresponde con campos a insertar dinmicamente en el formulario. La
clave est en que estos parmetros tienen un valor con un formato especfico, de manera que
su interpretacin da informacin acerca de cmo crear el campo en cuestin. Estos son los
nombres de los parmetros, con el tipo de campo de formulario que crean y el formato que
usan:
Cajas de texto plano: plain=Campo1;Campo2;Campo3

Donde los valores campo1 y campo2 indican el nombre de la etiqueta que da nombre
a las cajas de texto.
Cajas de reas de texto: area=Campo1[f-c];Campo2[f-c];Campo3[f-c]
Donde el valor campo1 y campo1, indican el nombre de la etiqueta que acompaa a la caja
de rea de texto, y los valores f y c se corresponden con el numero de filas y columnas con los
que crear la caja de texto.
Botones tipo radio: radio=Campo1[Valor1-Valor2];Campo2[Valor1-#Valor2]
Donde los valores campo1 y campo2, indican el nombre de la etiqueta que acompaa a la
botones de tipo radio, y los valores Valor1 y Valor2, son los posibles valores. Por ejemplo, un
uso podra ser: radio=Sexo[Hombre-Mujer]
Podemos poner el carcter almohadilla (#) delante de un valor, para especificar que sea el
valor por defecto. Por ejemplo: radio=Color[Amarillo-Rojo-#Azul]
Botones de cajas de validacin (checkboxes): check=Campo1[Valor1-Valor2];
137
Es el mismo funcionamiento que en el caso anterior, solo que el resultado se muestra

como botones de cajas de validacin.
Listas desplegables(dropodown list): dropdown=Campo1[Valor1-Valor2-Valor3];
Es el mismo funcionamiento que en el caso anterior, solo que el resultado se muestra
como una lista desplegable.
Botones: button=Boton1[Submit];Boton2[Reset]
Donde los valores Boton1 y Boton2, indican el texto dentro del botn, y el contenido dentro
de los corchetes es la funcin que realizan.
Orden de los campos: order=Campo1;Campo2;Campo3;Campo4
Por ltimo tenemos el parmetro order para indicar en qu orden queremos que aparezcan los campos en el formulario. Para ello, simplemente se escriben secuencialmente los
nombres de los campos que hemos ido poniendo, en el orden que aparezcan. Si el nombre del
algn campo no aparece, este no se mostrar.
var strParams = ;
for (var i = 0; i < params.length; i = i + 1) {
}
}
function existsQueryStringParameter(field) {
var url = window.location.href;
if (url.indexOf(? + field + =) != -1) return true;
else if (url.indexOf(& + field + =) != -1) return true;
return false;
}
function toTitleCase(str) {
return str.replace(/\w\S*/g, function (txt) { return
txt.charAt(0).toUpperCase() + txt.substr(1).toLowerCase(); });
}
function formFocus() {
var inputs = jQuery(#container > div.register > input[type=text]);
var prevColor = jQuery(#container).css(background-color);
inputs.focus(function () {
138
jQuery(this).parent(div.register).css(background-color,
rgb(79,172,55));
jQuery(this).css(background-color, #FFF);
}).blur(function () {
jQuery(this).parent(div.register).css(background-color,
prevColor);
jQuery(this).css(background-color, rgba(255, 255, 255, 0.85));
});
El resto de funciones se utilizan como herramientas para consultar la QueryString, comprobar si tiene valor algn parmetro de la QueryString, y dejar en minsculas una cadena
de texto, excepto el primer carcter. La funcin formFocus se utiliza para resaltar el campo del
formulario que est editando el usuario.
Paso 7. Ya tenemos casi todos los componentes listos. Tan solo nos falta configurar la App
Part mediante su fichero Elements.xml asociada, para indicarle qu pgina debe usar, cul es el
tamao del iFrame donde se muestra, y cules van a ser sus parmetros de configuracin. Para
ello editamos el archivo Elements.xml, y sustituimos su contenido por el siguiente:
<?xml version=1.0 encoding=UTF-8?>

<ClientWebPart Title=Custom Form Name=Custom Form
Description=My Custom Form!.
DefaultHeight=600 DefaultWidth=392>

<Content Src=~appWebUrl/Pages/CustomFormAppPartPage.aspx?titulo=_titulo_
&plain=_plain_&area=_area_&radio=_radio_&
check=_check_& dropdown=_dropdown_& button=_button_
&order=_order_&{StandardTokens}
Type=html/>
<Properties>
<Property
Name=titulo
Type=titulo
DefaultValue=Contact Us
WebCategory=Configuracin
139
WebDisplayName=Cajas de texto:>
</Property>
<Property
Name=plain
Type=string
DefaultValue=Nombre;Apellidos;Email;Website
WebCategory=Campos
WebDisplayName=Cajas de texto:>
</Property>
<Property
Name=area
Type=string
DefaultValue=Mensaje[10-41]
WebCategory=Campos
WebDisplayName=Cajas de area de texto:>
</Property>
<Property
Name=radio
Type=string
DefaultValue=Sexo[Hombre-Mujer]
WebCategory=Campos
WebDisplayName=Botones de tipo radio:>
</Property>
<Property
Name=check
Type=string
DefaultValue=Aficiones[Deporte-Viajar-Cine-Lectura-Fiesta]
WebCategory=Campos
WebDisplayName=Botones de cajas de validacin:>
</Property>
<Property

Name=dropdown
Type=string
DefaultValue=Pais[Argentina-Italia-Francia-USA-Otros]
WebCategory=Campos
WebDisplayName=Listas desplegables:>
</Property>
<Property
Name=button
Type=string
140
DefaultValue=Enviar[submit];Limpiar[reset]
WebCategory=Campos
WebDisplayName=Botones:>
</Property>
<Property
Name=order
Type=string
DefaultValue=Nombre;Apellidos;Email;Website;Limpiar;Enviar
WebCategory=Campos
WebDisplayName=Orden de los campos:>
</Property>
</Properties>
</ClientWebPart>
</Elements>
El contenido de este Elements.xml ya no nos debe pillar por sorpresa. En primer lugar
definimos el contenido del mismo, y en segundo lugar, las propiedades de configuracin, que
le sern enviadas a la App Part mediante QueryString. Es por eso que cuando especificamos
la URL de la pgina que contiene el cuerpo de la app, anidamos en ella todos los parmetros
de la QueryString que hemos definido, siguiendo un formato especificado por SharePoint. Son
estos parmetros en la QueryString, los que consultaremos y trataremos desde las funciones
JavaScript que hemos definido anteriormente.
Adems, nos debemos fijar que a los parmetros de configuracin que definimos, podemos ponerle unos valores por defecto. En este caso, estos valores por defecto estn establecidos para crear un formulario bsico de contacto. Aunque todos los parmetros tienen valor,
fijmonos en la propiedad order, donde solo incluimos algunos de ellos. El resto se quedan a
modo de ejemplo para futuros usos.
Paso 8. Ya solo queda depurar la aplicacin desde Visual Studio 2012, y comprobar cul
es el resultado de nuestra App Part. Para ello, como siempre, pulsamos [F5] y esperamos a que
se inicie una instancia del navegador que tengamos definido por defecto. A continuacin, se
nos pedir que introduzcamos las credenciales. Finalmente, accederemos al listado de apps
que hay instaladas en el Sitio del Desarrollador que hayamos especificado. Comprobamos que
efectivamente, aparece nuestra app entre ellas.
Como hemos creado una App Part, para verla en accin, accedemos a alguna pgina cualquiera, la editamos, y aadimos un Web Part en la zona que queramos. Bajo la seccin de Apps,
debemos encontrar a nuestra app. Una vez la incluyamos en la pgina, sta deber de ser el
aspecto final.
141
Figura 3-42. Resultado final de la App Part
Como vemos, hemos conseguido una app plenamente funcional, sin renunciar a un buen
diseo. En este caso, estamos aadiendo simplemente cuatro campos de caja de texto simples,
y dos botones, pero gracias a los parmetros de configuracin que se le envan mediante
QueryString, podramos adaptar la App Part segn los requisitos del momento, tanto como
quisiramos. Solo sera cuestin de editar la App Part mediante su panel de configuracin
(igual que haramos para un elemento web Web Part- clsico), y aadir nuevos campos
siguiendo los formatos que vimos anteriormente.

Y con este ejemplo, damos por terminada la seccin dedicada a hablar de cmo maquetar
y disear SharePoint-hosted Apps. Hemos visto que desarrollar apps desde cero, dista muy
poco de disear cualquier pgina de una aplicacin web, siendo ste su principal reclamo.
Pasamos ahora a ver qu tenemos que tener en cuenta si nos decidimos por las Cloud-hosted
Apps.
142
Cloud-hosted Apps
Introduccin
Una vez explicadas las apps que viven en el propio SharePoint, desde el punto de vista
ms estrictamente relacionado con diseo y la maquetacin, toca hacer lo propio con las apps
que se encuentran al otro lado de la arquitectura, es decir, aquellas que tienen su casa en la
Nube.
Dentro de esta subcategorizacin de apps (la de las Cloud-hosted Apps), tenemos a su vez
dos opciones: Autohosted Apps, y Provider-hosted Apps. A estas alturas de este libro, ya sabemos que las Autohosted se caracterizan por usar Azure como servidor en la Nube predefinido
(y por tanto, la opcin recomendada por Microsoft), mientras que con las Provider-hosted no
tenemos ninguna limitacin, en cuanto a qu tipo de hospedaje en la Nube utilizar (aunque
todo el mantenimiento, obviamente, corre por nuestra cuenta). En cualquier caso, elijamos un
mecanismo u otro para ubicar nuestras apps en la Nube, en ambos casos hay un punto muy
importante a tener en cuenta: podemos utilizar cualquier tecnologa web para desarrollar,
y por tanto, maquetar y disear nuestra SharePoint app. ste es un punto del que ya hemos
hablado anteriormente, pero que considero que merece la pena reincidir, porque es una de
las premisas en las que Microsoft ms confa para garantizar el xito de su plataforma de apps
para SharePoint. Dado que SharePoint 2013 se basa en tecnologas web que son estndares como HTML, CSS, JavaScript, OData, Rest, etc., desarrollar para SharePoint deja de ser
exclusivo para los desarrolladores afines a Microsoft. De hecho, hay una frase en la documentacin de MSDN de Microsoft que define perfectamente, de forma muy concisa, el mensaje
que se quiere transmitir:
Las apps son bsicamente aplicaciones web. Si sabes hacer una aplicacin web, sabes
hacer una app para SharePoint.
Por tanto, las Cloud-hosted Apps son una gran oportunidad de negocio, que debemos tener
muy presente, cuando vayamos a decidirnos sobre qu tipo de app basar nuestro desarrollo.
Centrndonos en el asunto que nos preocupa en este captulo, la maquetacin y diseo de
apps, es obvio que maquetar y disear Cloud-hosted Apps es mucho ms libre que en el caso
de las SharePoint-hosted Apps. Aqu no tenemos reglas que seguir, en cuanto a una pgina
maestra que se aplica por defecto, una maquetacin basada en ContentPlaceHolders, etc. Aqu,
lo que tenemos es un lienzo completamente en blanco. Partimos de cero. Lo cual tambin
tiene sus ventajas. Por ejemplo, si ya tenemos una app de Facebook en PHP, adaptarla para
que se convierta en una app de SharePoint, solo sera cuestin de modificar el acceso a datos,
ya que la presentacin nos podra valer la misma. Anteriormente, hemos hablado de centrar
nuestro foco en la maquetacin y diseo de apps, en conseguir que se adapten al entorno que
143
las contiene y parezcan un elemento ms de l, en vez de un parche. Cmo conseguimos esto

con una Cloud-hosted App, donde no tenemos ninguna conexin directa con SharePoint? Bueno,
a sta y otras preguntas, vamos a tratar de darle respuesta en esta seccin.
Estructura de un proyecto Cloud-hosted

Dado que vimos en la seccin anterior cul es la estructura de un proyecto SharePointhosted, vamos a hacer lo propio con un proyecto Cloud-hosted.
Figura 3-43. Estructura de un proyecto Cloud-hosted
La estructura de una Cloud-hosted App que se crea en Visual Studio 2012 con las correspondientes plantillas es la misma para Autohosted y Provider-hosted. En ambos casos, tenemos una solucin que contiene un proyecto para la definicin de la app, mediante el archivo
AppManifest.xml. Y otro proyecto con una aplicacin web ASP.NET clsica, con la que dar forma
a la app. Hay que tener claro, que ste es el proyecto base que ofrece Visual Studio 2010. Si no
queremos una aplicacin web basada en ASP.NET, incluso como si no queremos usar Visual
Studio, como ya hemos visto, no tenemos ninguna obligacin. Pero resulta lgico, que usando
Visual Studio como plataforma de desarrollo, se proporcione ASP.NET como tecnologa base.
As pues, analizando los componentes de la Cloud-hosted App, vemos que sta se encuentra completamente vaca, a diferencia del proyecto base de Visual Studio para la SharePointhosted App. Como vimos para las SharePoint-hosted Apps, el proyecto que crea Visual Studio
2012 ya contiene una serie de archivos por defecto, a partir de los cuales iniciar el desarrollo.
Pero en este caso, si queremos aadir archivos CSS, JavaScript o pginas HTML, tenemos que
ir a la aplicacin web y aadirlos manualmente, y seguidamente incluir las referencias que
toquen. Tenemos libertad total para desarrollar y maquetar, pero esa libertad tambin conlleva
un poco de trabajo extra por nuestra parte. La magia de Visual Studio 2012 hace que cuando
144
depuramos la app, se lance un IIS Express para ejecutar la aplicacin web, y a donde se dirigen
las solicitudes desde el sitio SharePoint anfitrin.
Antes de continuar, resulta interesante comentar que en las Cloud-hosted Apps, podemos
seguir usando componentes de SharePoint como listas, mdulos, columnas de sitios, etc. Es
decir, en el proyecto que contiene la definicin de la app, podramos aadir un nuevo elemento
de SharePoint. La pregunta entonces sera, si en este caso mi app no se aloja en SharePoint,
donde se crean esos componentes? Pues la respuesta es que SharePoint crea un nuevo sitio,
como el que se crea para una SharePoint-hosted App, para alojar dichos componentes. De esta
forma, estaramos ante un alojamiento mixto de apps.
Apps de Pgina completa

En la seccin anterior vimos qu mecanismos ofrece SharePoint 2013 para trabajar con las
App Parts, y emplazbamos a ver los mecanismos que existen para trabajar con las apps de
Pgina completa en la presente seccin de Cloud-hosted Apps. Es ahora, que sabemos que la
aplicacin web (en la tecnologa que sea) que constituye una Cloud-hosted App no presenta
ninguna conexin con SharePoint, cuando tiene sentido preguntarse, cmo puedo conseguir
que una app de Pgina completa, no parezca una pgina aislada, si no que realmente sea un
elemento ms de SharePoint? La respuesta a esa pregunta tiene un nombre que ya conocemos:
Client Chrome Control.
Client Chrome Control

El Client Chrome Control es un mecanismo que ofrece SharePoint 2013 para poder heredar el
aspecto o la apariencia (el look and feel que diran los angloparlantes) del sitio SharePoint donde
instalamos la app. Se trata de control JavaScript que aade elementos propios de SharePoint a la
cabecera de la pgina que forma la app como el ttulo, la miga de pan (breadcrumb), el logo, etc.
Y adems inyecta los estilos del sitio SharePoint anfitrin para dar el mismo aspecto en cuanto
a fuentes, tamaos, etc., al resto de elementos de la app. Pero como la mayora de las cosas en
la vida, la mejor manera de entender un concepto es aplicndolo uno mismo. As que vamos a
ello con el siguiente paso a paso.
Paso 1. Lo primero es crear un nuevo proyecto en Visual Studio 2012, partiendo de la
plantilla App for SharePoint 2013. En mi caso, he llamado al nuevo proyecto, Demo1. Cuando
llegamos a la pantalla donde debemos especificar el sitio SharePoint objetivo (recordemos
que debe ser un sitio creado con la plantilla Sitio del Desarrollador), nos aseguramos de
seleccionar la opcin Autohosted, como mecanismo para alojar nuestra app. A estas alturas
del partido, ya sabemos que con este mecanismo de aprovisionamiento de apps, las apps se
alojan en la Nube, concretamos en Azure.
145
Figura 3-44. Proyecto de Visual Studio para una app en modo Autohosted
Paso 2. Si nos fijamos en la aplicacin web ASP.NET que se incluye en la solucin (el segundo
proyecto), contiene una pgina por defecto, default.aspx. Esta pgina ser el cuerpo de nuestra
app de Pgina completa. Actualmente, como es de esperar, se encuentra completamente vaca,
por lo que en este paso es donde debemos dar contenido a dicha pgina. Por ejemplo, podemos aadir un clsico Hola Mundo!, para simplemente depurar la app y comprobar que
vamos bien hasta ahora.
<%@ Page Language=vb AutoEventWireup=false CodeBehind=Default.aspx.vb

Inherits=Demo1Web._Default %>
<!DOCTYPE html PUBLIC -//W3C//DTD XHTML 1.0 Transitional//EN
http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd>
<head runat=server>
<title>Mi App en Pgina Completa</title>
</head>
<body>
<form id=form1 runat=server>

<h1 class=ms-accentText>Hola Mundo!</h1>
146
</form>
</body>
</html>
As pues, si en este momento depuramos la aplicacin desde Visual Studio ([F5]), vemos
cmo, en primer lugar, se abre una instancia de Internet Explorer y a continuacin se nos pide
que introduzcamos las credenciales para autenticarnos en el sitio web. Acto seguido, se nos
pregunta si la app que vamos a desplegar en el sitio es de confianza. Dado que la app la hemos
hecho nosotros, y somos gente de fiar, decimos que s :).
Figura 3-45. SharePoint pregunta si la app que vamos a instalar es de

confianza
Y ste es lo que obtenemos:
Figura 3-46. Contenido de nuestra Autohosted App, antes de aplicar el Chrome

Control
147
Paso 3. Una vez definido el contenido de la pgina, es el momento de hacer uso del Client
Chrome Control. Para ello, el primer paso y el ms sencillo, es aadir a nuestra pgina una
etiqueta <div> a modo de marcador de posicin. Este <div> debe ser el primer elemento en
la pgina, con un atributo ID reconocible. Esta etiqueta sirve al Client Chrome Control, para,
mediante JavaScript, insertar en la pgina el resultado del procesamiento del control. Por lo
que el maquetado de nuestra pgina queda as:
<%@ Page Language=vb AutoEventWireup=false CodeBehind=Default.aspx.vb

Inherits=Demo1Web._Default %>
<!DOCTYPE html PUBLIC -//W3C//DTD XHTML 1.0 Transitional//EN
http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd>
<head runat=server>
<title>Mi App en Pgina Completa</title>
</head>
<body>
<form id=form1 runat=server>


<div id=chrome_control_marcador></div>

<h1 class=ms-accentText>Hola Mundo!</h1>
</form>
</body>
</html>
Paso 4. A continuacin, definimos el cdigo JavaScript necesario para hacer funcionar el

Client Chrome Control. Dicho cdigo bien pudiera ir en la propia pgina, pero para seguir las
buenas prcticas de desarrollo, creamos un fichero default.js aparte. En dicho fichero, insertamos el siguiente cdigo:
var hostweburl;
// Obtenemos los recursos de SharePoint necesarios.
jQuery(document).ready(function () {
// Obtenemos la URL decodificada del sitio SP anfitrion (Host Web), a
// partir de los parametros en la Query String.
hostweburl = decodeURIComponent(getQueryStringParameter(SPHostUrl));
// Los archivos js se encuentran todos a partir de /_layouts/15/
148

// Cargamos el fichero SP.UI.Controls.js necesario, y continuamos con la
// ejecuacion con el manejador de exito correspondiente.
jQuery.getScript(scriptbase + SP.UI.Controls.js, prepararChrome)
});
//En esta funcin se configuran las opciones y se ejecuta el control.
function prepararChrome() {
//Las URLs que definimos para las pginas de Ayuda, Cuenta, Contacto, etc
//las formamos agregando la misma Query String que la URL del sitio anfitrion.
var options = {
appIconUrl: ../images/sp.jpg,
appTitle: Ttulo de mi App,
appHelpPageUrl: Ayuda.html? +
document.URL.split(?)[1],
settingsLinks: [
{ linkUrl: cuenta.html? +
displayName: Mi Cuenta },
{ linkUrl: contactanos.html? +
displayName: Contctanos },
{ linkUrl: configuraciones.html? +
displayName: Configuraciones}
]
};
var nav = new SP.UI.Controls.Navigation(chrome_control_marcador,
options);
nav.setVisible(true);
}
// Funcin para obtener un valor de la Query String
var strParams = ;
{
}
}
149
Analizando el cdigo JavaScript, vemos que el funcionamiento del Client Chrome Control es
muy sencillo. En primer lugar, mediante jQuery, capturamos cuando el DOM de la pgina est completamente cargado, y acto seguido cargamos en la pgina el fichero JavaScript SP.UI.Controls.js.
Si el citado fichero, se carga con xito en la pgina, pasamos a ejecutar la funcin prepararChrome,
que hace las veces de callBack. Es en esta funcin donde llevamos a cabo la configuracin del
Client Chrome Control y, finalmente, procedemos a su ejecucin.
De las opciones posibles de configuracin nos debe llamar la atencin las siguientes:
appIconUrl. Especificamos la URL del icono de la app.
appTitle. Ttulo de la app, para mostrar en la miga de pan y en el cuerpo de la app.
appHelpPageUrl. Direccin para la pgina de ayuda.
settingsLinks. Direccin(es) de la(s) pgina(s) bajo la seccin de configuracin.
o linkUrl. URL de la pgina en cuestin.
o displayName. Nombre a mostrar para identificar la pgina.
Una vez tenemos lista las configuraciones, ejecutamos el control, ligando su resultado con
la etiqueta <div> que definimos al principio.
Paso 5. Finalmente, incluimos las referencias en la pgina al fichero JavaScript que acabamos de crear, as como a jQuery y a la librera de Ajax de Microsoft.
<script src=http://ajax.aspnetcdn.com/ajax/4.0/1/MicrosoftAjax.js
type=text/javascript></script>
<script type=text/javascript
src=https://ajax.aspnetcdn.com/ajax/jQuery/jquery-1.7.2.min.js>
</script>
<script type=text/javascript src=../js/default.js></script>
Solo queda ver el resultado del Client Chrome Control, para lo que pasamos a depurar
([F5]) nuevamente la app.
150
Figura 3-47. Contenido de nuestra Autohosted App, despus de aplicar el Chrome Control
Como vemos, la apariencia de la app ha cambiando por completo, adaptndose al diseo

de SharePoint. Por lo que construir aplicaciones en modo Pgina completa, no suponen ningn
problema en cuanto a respetar los estilos del sitio anfitrin o Host Web se refiere, aun tratando
con apps del tipo Cloud-hosted.
Modelo de objetos de cliente y API REST en SharePoint

2013
Empezaremos este nuevo captulo hablando de las novedades que aporta SharePoint 2013
en cuanto al modelo de objetos de cliente. Seguiremos con una breve exposicin de las distintas API disponibles de desarrollo y por ltimo nos centraremos principalmente en las novedades en cuanto a la API REST de la plataforma.
Comentar que fue en la versin 2010, cuando se introdujo dicho modelo de objetos de
cliente el cual permita interactuar de forma remota con sitios de SharePoint sin tener que
recurrir a ningn tipo de servicio web.
151
Pues bien, en la nueva versin de SharePoint mantenemos el modelo de objetos de cliente

y adems lo ampliamos permitindonos as trabajar tambin con metadatos administrados, la
bsqueda, etc
Respecto a la arquitectura, se sigue manteniendo la misma, incluyendo una nueva API
bautizada como _api como bien se dijo en el captulo 2. Dentro del modelo de objetos de
cliente, disponemos de varias vas para comunicarnos con SharePoint, mediante cdigo .NET
Framework, Silverlight, JavaScript y REST. A continuacin, un grfico explicativo de cmo funciona la arquitectura del modelo de objetos en cliente.
Figura 3-48. Arquitectura del modelo de objetos de cliente
Interfaces de desarrollo (API) disponibles

Tendremos varios conjuntos de API que podremos utilizar, lo importante ser saber cul es
la ms apropiada en cada caso. ste es un paso muy importante, ya que elegir una API equivocada nos hara perder mucho tiempo. Para elegir una API u otra, bsicamente tendremos que
tener en cuenta 3 factores:
152
Tipo de la aplicacin. Donde podemos encontrarnos con aplicaciones para SharePoint,

elementos web de pginas de SharePoint, aplicaciones ASP.NET que se han expuesto
en SharePoint con un IFrame, JavaScript que se ejecuten en pginas de sitios de
SharePoint, aplicaciones de consola para administracin de SharePoint, Timer Jobs
personalizados, etc
Habilidades del desarrollador. Unas habilidades u otras nos harn decantarnos por
el tipo de API. Entre estas habilidades encontramos JavaScript, ASP.NET, REST/OData,
.NET Framework, Silverlight, Windows Phone y Windows PowerShell.
El dispositivo en el que se ejecuta el cdigo. Servidores de SharePoint, servidores
externos, equipos cliente, dispositivos mviles, etc
Una vez comentados estos factores, vamos a definir brevemente las API que hay disponibles para SharePoint comenzando con un grfico que nos va a ayudar a agruparlas en conjuntos.
Figura 3-49. Conjuntos de API de SharePoint (este diagrama ha sido seleccionado de

MSDN)
Modelo de Objetos de Servidor

Es el conjunto de mayor tamao, en cuanto a funcionalidad disponible se refiere. Se encuentra en el modelo de objetos de servidor. La mayor parte de estas clases se encuentran en el
153
espacio de nombre Microsoft.SharePoint. Adems, la mayora de los componentes SharePoint son

extensibles al modelo de objetos de servidor.
Limitacin para las SharePoint Apps: No se puede usar el modelo de objetos de servidor
en una app para SharePoint, puesto que la idea es que se ejecute en un contexto aislado y,
adems, la mayora de las veces quedarn alojadas en servidores externos.
Modelo de Objetos de cliente (CSOM Client-side object model)

En SharePoint 2013 disponemos de varios modelos de objetos de cliente para nuestro
cdigo: .NET, JavaScript, Silverlight y Silverlight para mviles.
Modelo de objetos de cliente .NET

Este modelo se utiliza en aplicaciones de .NET Framework que se ejecutan en clientes de
Windows (que no son telfonos) como puede ser un equipo de un usuario, un servidor externo
a la granja de SharePoint, etc Un ejemplo de esto es una aplicacin de escritorio de Windows
que nos permita acceder a las listas de SharePoint para ver la informacin.
Modelo de objetos de cliente de Silverlight

Se usa en las aplicaciones de Silverlight. Es idntico al modelo de objetos de cliente de
.NET Framework. La principal diferencia est en que en la versin de Silverlight, todos los lotes
de comandos se envan al servidor de forma asncrona, por lo que la IU de la aplicacin permanece activa.
Los ensamblados del modelo de objetos de cliente de Silverlight suelen guardarse en
ProgramFiles\Common Files\Microsoft Shared\web server extensions\15\TEMPLATE\LAYOUTS\
ClientBin. Recuerda que en las apps de SharePoint no se puede utilizar el modelo de objetos
de servidor.
Modelo de objetos de mviles de Silverlight

Para este apartado existe una versin especial del modelo de objetos de cliente de Silverlight
disponible para los telfonos con Windows Phone 7. Incluye algunas API adicionales que solo
son relevantes para los telfonos, como puede ser una API que permite a una aplicacin de
mviles registrar las notificaciones sirvindose del servicio Microsoft Push Notification.
154
Los ensamblados se pueden guardar en ProgramFiles\Common Files\Microsoft Shared\

web server extensions\15\TEMPLATE\LAYOUTS\ClientBin y deben ir empaquetados en el archivo
.xap de la aplicacin.
Modelo de objetos JavaScript (JSOM)

SharePoint 2013 ofrece un modelo de objetos de JavaScript que se puede usar en archivos con extensin .js independientes, e incluye la misma funcionalidad que los modelos de
objetos de cliente de .NET Framework y Silverlight. Este modelo de objetos se puede usar para
interactuar con contenido de SharePoint desde las SharePoint apps (ya que no se permite usar
cdigo de servidor). La infraestructura del modelo de JavaScript interacta con los servidores
de forma asncrona. Se soluciona el problema de cross-domain. Este problema surge al intentar
la comunicacin entre varios dominios. El servidor devuelve los datos en formato JSON.
API REST/OData
Esta API surge de la necesidad de obtener acceso a las entidades de SharePoint desde
tecnologas de cliente que no usan JavaScript y no se encuentran integradas en las plataformas
.NET Framework o Siliverlight. Esto quiere decir, que podramos acceder a SharePoint desde
cualquier lenguaje de programacin como PHP, JSP, Action Script, Flash, Cocoa, etc Por lo
tanto, ya podis imaginar la gran potencia de esta API REST, la cual nos permite unificar el
acceso a SharePoint desde cualquier dispositivo y plataforma. Para tal fin, SharePoint 2013
ofrece la implementacin de un servicio web (REST Representational State Transfer) que usa el
protocolo OData para realizar las operaciones sobre listas SharePoint.
OData viene de las siglas Open Data Protocol. Principalmente se utiliza para exponer
datos de una forma genrica, por ejemplo, en nuestro caso, podra ser una lista. Para consultar
estos datos desde la aplicacin cliente es necesario crear una URI siguiendo el estndar OData.
Aqu es donde entra REST como protocolo de comunicacin entre los datos y la aplicacin
cliente enviando una peticin HTTP RESTful con el endpoint correspondiente. La respuesta
emitida que recibe la aplicacin cliente se encontrar en formato JSON o Atom.
Otra cosa a mencionar es que prcticamente todas las API de los modelos de objetos de
cliente cuentan con su correspondiente extremo de REST. Esto nos permite interactuar con
SharePoint a travs de cualquier tecnologa compatible con las capacidades estndar de REST.
Para usar las capacidades de REST que se encuentran integradas en SharePoint 2013, el cdigo
construye una solicitud HTTP RESTful para un extremo correspondiente a la API del modelo de
objetos de cliente que el usuario especifica. El servicio web client.svc controla la solicitud HTTP
y emite una respuesta en formato Atom o JSON.
155
A continuacin, un grfico explicativo, el cual muestra la relacin existente entre las API de
cliente y SharePoint.
Figura 3-50. Aplicaciones en el lado del cliente y API de SharePoint
API REST en SharePoint 2010
Antes de entrar en materia sobre la API REST en SharePoint 2013, deberamos hablar del
estado de esta API en la versin anterior del producto. En SharePoint 2010, ya disponamos
de esta API, aunque su funcionalidad estaba muy limitada. Al igual que en SharePoint 2013, se
serva del protocolo OData.
En SharePoint 2010 se introdujo el soporte para WCF Data Services que nos permita consultar de forma sencilla listas y bibliotecas, adems de poder realizar operaciones CRUD sobre
las mismas dentro de cualquier plataforma que soportara REST, la cual poda ser .NET o no.
Para tal fin, se utilizaba el servicio ListData.svc. A la hora de acceder a dicho servicio, la URL
quedara http://mistio/_vti_bin/ListData.svc.
156
Figura 3-51. API REST en SharePoint 2010
API REST SharePoint 2013

Una vez visto el funcionamiento de esta API bajo SharePoint 2010, ahora es el turno de
verlo bajo SharePoint 2013.
Ahora no solo vamos a poder interactuar con listas y bibliotecas de sitios, sino que tambin
podremos interactuar con sitios y servicios. SharePoint 2013 cuenta con una API REST que
se bautiza como _api. Ahora las URL sern del tipo http://misitio/_api/..., por ejemplo, para
consultar el nombre de un sitio mediante cdigo manejado la URL ser http://misitio/_api/
Web/?$select=Title. El smbolo $ es un mecanismo estndar de OData para filtrar resultados
sobre una peticin. Tambin podramos usar el navegador para consultar directamente el nombre del sitio introduciendo http://mistio/_api/Web/title Mencionar que _api es un nombre abstracto o se podra decir una abreviatura de _vti_bin/client.svc ya que las URL tienen la limitacin
de 256 caracteres.
Como hemos comentado anteriormente, la API REST nos permite interactuar con SharePoint
usando cualquier tecnologa que soporte REST. Para usar REST, se construye una peticin HTTP
usando el protocolo OData. El servicio client.svc maneja la peticin HTTP y emite la respuesta en
formato Atom o JSON. La aplicacin cliente debe entonces parsear la respuesta. En el siguiente
grfico se puede apreciar la arquitectura del servicio REST.
157
Figura 3-52. Arquitectura servicio REST de SharePoint 2013
URI del servicio REST

La mayora de las API de modelo de objetos de cliente tienen o est planificado que
tengan su correspondiente endpoint. Puedes usar REST endpoints para ejecutar peticiones
HTTP usando un servicio basado en URI, para recuperar o actualizar entidades de SharePoint.
Podramos decir que cada entidad de SharePoint est expuesta mediante un endpoint representado en formato XML o JSON. Por lo tanto, para acceder a dichas entidades se necesita
saber la URL del endpoint correspondiente. Esto nos permite, conociendo los endpoints, realizar
peticiones HTTP en cualquier lenguaje.
Resumiendo, el endpoint proporciona a las aplicaciones cliente acceso a la funcionalidad
del servicio. A continuacin, vamos a ver cmo construir estas URI empezando desde lo ms
bsico.
Para empezar, debemos tener claros los principales puntos de entrada del servicio REST
que corresponden con la coleccin de sitios y el sitio actual.
CONTEXTO
Coleccin de
sitios
Sitio actual
REST
http://myapplication/site/_api/
site
http://myapplication/site/_api/
web
SERVIDOR
CLIENTE
SPContext.Current.Site ClientContext.Site
SPContet.Current.Web
ClientContext.Web
A partir de esto, que es lo bsico, podremos construir el resto de las URI necesarias para
acceder al modelo de objetos desde REST. Mencionar tambin que da igual poner maysculas
158
y minsculas, por ejemplo, esta URI: http://myapplication/site/_api/web/lists/getbytitle(Title)

que obtiene una determinada lista, se corresponde con la funcin GetByTitle del modelo de
objetos de cliente y funcionara a la perfeccin.
Adems de acceder a la coleccin de sitios y al sitio actual, tenemos otros puntos de acceso:
REA
Coleccin de sitios
Sitio actual
Perfil de usuario
Bsqueda
Publicacin
PUNTO DE ACCESO
http://myapplication/site/_api/site
http://myapplication/site/_api/web
http://myapplication/site/_api/SP.UserProfiles.PeopleManager
http://myapplication/site/_api/search
http://myapplication/site/_api/publishing
Utilizar parmetros con alias

A la hora de pasar parmetros por REST, les podemos poner los identificadores que queramos,
es decir, les podemos poner un alias. En el siguiente ejemplo vemos que asigna el alias @template al ttulo y posteriormente le da valor.
http://myapplication/site/api/web/appyWebTemplate(title=@template)?@template=STS#0
Parmetros en la query string

Tambin podemos pasar parmetros en la query string en la llamada REST.
http://myapplication/site/_api/web/applyWebTemplate?template=STS#0
Mtodos especficos y propiedades

Tambin es posible construir URI mediante mtodos estticos o propiedades. Estas URI tienen
su equivalencia en mtodos o propiedades estticas en las cuales se utiliza la sentencia equivalente del modelo de objetos ECMAScript. La pega que tienen estas propiedades es que tienen que
ser accesibles directamente.
http://myapplication/site/_api/SP.Utilities.Utility.getImageUrl(imageName)
159
Consultar elementos
Para consultar elementos mediante llamadas REST, tenemos el parmetro $select. Este
parmetro especifica qu campos sern devueltos. El comodn * indica que se devuelve todo
el conjunto de campos; por defecto es la opcin que se ejecuta.
http://myapplication/site/_api/web/lists/getbytitle(nombreLista)?$select=Title
Filtrar elementos
Para obtener un conjunto de elementos filtrados utilizaremos la clusula $filter.
http://myapplication/site/_api/web/lists/getbytitle(Customers)/items?$filter=
Country eq UK
Operadores que podemos utilizar

COMPARACIONES NUMRICAS
Lt, Le, Gt, Ge, Eq, Ne
COMPARACIONES DE CADENAS
startsWidth, substringof, Eq, Ne
FUNCIONES DE FECHAS
day(), month(), year(), Hour(),
minute(),
second()
Ordenar elementos
Para ordenar elementos que nos ha devuelto la query utilizamos la clusula $orderby. Para
ordenar por varios campos estos irn separados por ,. Tambin se puede especificar si queremos dicho orden en ascendente o descendente con asc y desc.
http://myapplication/site/_api/web/lists/getbytitle(Customers)/items?$orderby=Name
Clusula top
Esta opcin permite traernos los n primeros elementos.
http://myapplication/site/_api/web/lists/getbytitle(Customers)/items?$top=10
160
Errores y excepciones
En caso de errores o excepciones, el endpoint del servicio REST devuelve el error HTTP
correspondiente, los cuales citamos a continuacin:

400
- Peticiones mal hechas
404
- Endpoints que no existen
500
- Errores internos del servidor
Cross-domain library
En las apps para SharePoint es comn acceder a datos de varios orgenes. Como bien
sabemos, este acceso es bloqueado, ya que existen mecanismos para prevenir la comunicacin
con ms de un dominio. Este problema nos lo soluciona la cross-domain library. Al utilizarla las
apps sern capaces de acceder a datos bajo un dominio remoto y tambin al dominio dnde
se encuentre nuestro SharePoint.
Entrando un poco ms en detalle, la cross-domain library es una librera del lado del cliente.
Para poder utilizarla necesitaremos cargar el script SP.RequestExecutor.js que se encuentra
almacenado en SharePoint bajo la ruta /_layouts/15/
Es una muy buena opcin si quieres o necesitas que tu cdigo se ejecute en el lado del
cliente. Tambin nos permite esquivar barreras e incluso temas como el firewall entre SharePoint
y un servidor remoto.
En el siguiente enlace podris encontrar documentacin ms detallada sobre la crossdomain library:
http://msdn.microsoft.com/en-us/library/fp179927(v=office.15).aspx
161
Ejemplos de uso de las API

Ejemplo 1 Modelo de objetos cliente JavaScript
En este ejemplo, vamos a interactuar con social feeds desde una app mediante el modelo
de objetos de cliente JavaScript. En concreto, publicaremos comentarios y respuestas.
1. Lo primero de todo es tener configurado My Site bajo el sitio que vamos a que
vamos a desplegar la app.
2. Creamos un proyecto del tipo App for SharePoint 2013 y elegimos la opcin
SharePoint-Hosted para alojarla en nuestro SharePoint.
3. De la pgina que se crea por defecto Default.aspx borraremos el bloque de cdigo
JavaScript encargado de llamar a la funcin sharePointReady(), puesto que para este ejemplo
no haremos uso de ella. Dentro del ContentPlaceHolder PlaceHolderMain, borraremos el
contenido e incluiremos las siguientes lneas. Estas cuatro lneas a incluir, la primera representa
el mensaje que muestra el resultado de la insercin del comentario. Las dos siguientes referencian a los archivos necesarios para utilizar el modelo de objetos de cliente de JavaScript para el
tema de social feeds. La ltima lnea es la encargada de generar un mensaje sobre la seguridad
cuando sea requerido; suele ser usado en operaciones que actualizan contenido. Por lo tanto,
el PlaceHolderMain quedara as.

<span id=spanMessage style=color: #FF0000;></span>

<SharePoint:ScriptLink ID=ScriptLink1 name=SP.js runat=server

ondemand=false localizable=false

loadafterui=true />

<SharePoint:ScriptLink ID=ScriptLink2 name=SP.UserProfiles.js

runat=server ondemand=false

localizable=false loadafterui=true />

<SharePoint:FormDigest id=FormDigest runat=server/>
</asp:Content>
4. El siguiente archivo a modificar ser el App.js, el archivo que se crea por defecto al
elegir este tipo de proyecto, en el cual ira el cdigo JavaScript nuestro personalizado. Por
lo tanto, borramos todo el contenido que tiene actualmente para introducir nuestro cdigo.
162
5. Lo primero que haremos en el archivo App.js, ser llamar a la funcin excuteOrDelayUntilScriptLoaded, la cual llamar a la funcin PublishPost despus de haber cargado
el archivo SP.UserProfiles.js.
SP.SOD.executeOrDelayUntilScriptLoaded(PublishPost, SP.UserProfiles.js);
6. La funcin principal de nuestra demostracin es PublishPost, en esta funcin tendremos diferenciados 4 bloques.
Crearemos una instancia de la clase SocialFeedManager pasndole el contexto actual.
Esta clase es la que nos permite acceder a los social feeds. Nos proporcionar mtodos
para crear, actualizar, borrar y leer comentarios.
clientContext = SP.ClientContext.get_current();
feedManager = new SP.Social.SocialFeedManager(clientContext);
En el comentario que queremos introducir, vamos a aadirle un link. Para ello necesitamos hacer uso de la clase SP.Social.SocialDataItem y sus propiedades.
var linkDataItem = new SP.Social.SocialDataItem();

linkDataItem.set_itemType(SP.Social.SocialDataItemType.link);
linkDataItem.set_text(link);
linkDataItem.set_uri(http://www.solidq.com);
var socialDataItems = [linkDataItem];
El siguiente paso es crear el comentario, meterle texto y aadirle el link creado

previamente. Para ello, hacemos uso de la clase SP.Social.SocialPostCreationData y sus
propiedades.
163
var postCreationData = new SP.Social.SocialPostCreationData();

postCreationData.set_contentText(Este es el texto del comentario, el
cual contiene un {0}.);
postCreationData.set_contentItems(socialDataItems);
Publicamos el post, si todo va bien ir a la funcin PublishReply y si va mal ir

PostFailed
resultThread = feedManager.createPost(null, postCreationData);

clientContext.executeQueryAsync(PublishReply, PostFailed);
7. La siguiente funcin a comentar es la de PublishReply. Si el comentario se introdujo

correctamente, se introducir una respuesta en consecuencia. Para insertar la respuesta al
comentario introducido, esta vez cogemos el id de dicho comentario introducido y le insertamos el comentario respuesta.
var postCreationData = new SP.Social.SocialPostCreationData();

postCreationData.set_contentText(Este texto es la respuesta.);
resultThread = feedManager.createPost(resultThread.get_id(),
postCreationData);
clientContext.executeQueryAsync(PostSucceeded, PostFailed);
8. Las ltimas dos funciones que nos informan de si fue bien la operacin o no. Estas
funciones bsicamente rellenan un span indicando el resultado de la operacin.
164
function

}
function

}
PostSucceeded(sender, args) {
$get(spanMessage).innerText =
El comentario y la respuesta fueron publicados.;
PostFailed(sender, args) {
$get(spanMessage).innerText = La peticin fall: +
args.get_message();
9. El ltimo paso del desarrollo es dotar a nuestra app de los permisos necesarios a la
hora de interactuar con los social feeds. Para leer y escribir en los social feeds nos harn falta
dos tipos de permisos a nivel de app. Para ello accedemos al AppManifest.xml y ponemos
los permisos de la siguiente imagen.
Figura 3-53. Permisos para social feeds a nivel de app
165
10. Tan solo nos queda visualizar el resultado. En la siguiente imagen puedes ver el
comentario con el link y la respuesta al comentario.
Figura 3-54. Resultado demostracin 1: Comentario y Respuesta
Ejemplo 2 Modelo de objetos cliente .NET

En este ejemplo, usaremos el servicio de bsqueda de SharePoint mediante el modelo de
objetos de cliente .NET.
Con las novedades que ha trado consigo el modelo de objetos de cliente, ahora desde
el lado del cliente, vamos a poder hacer uso tambin del servicio de bsquedas. Para ello,
vamos a realizar una pequea aplicacin de consola que se encargue de buscar la palabra clave
SolidQ utilizando el motor de bsquedas de SharePoint 2013. Previamente habremos subido
un documento llamado SolidQDocument y realizado un full Crawl.
1. Creamos un proyecto tipo Aplicacin de consola.
2. Aadimos las libreras necesarias al proyecto

Microsoft.SharePoint.Client.dll
Microsoft.SharePoint.Client.Runtime.dll
Microsoft.SharePoint.Client.Search.dll
3. Aadimos las referencias al proyecto:
using Microsoft.SharePoint.Client;
using Microsoft.SharePoint.Client.Search;
using Microsoft.SharePoint.Client.Search.Query;
166
4. En este paso ya nos metemos a programar. Desde la aplicacin cliente necesitaremos recuperar el contexto, para ello le pasamos la URL de nuestro sitio.
using (ClientContext clientContext = new ClientContext(http://mydevelopersite))
5. Tendremos que declararnos un objeto KeywordQuery pasndole el contexto. Este

objeto ser el encargado de representar la consulta a realizar a SharePoint. Su parmetro
QueryText ser el texto a buscar.
Nota. El lenguaje de consultas SQL para bsquedas lo han quitado en
esta versin, quedando solamente el KQL (Keyword Query Language) y
FQL (FAST Query Language). Concretamente en este ejemplo utilizamos
el KQL.
KeywordQuery keywordQuery = new KeywordQuery(clientContext);

keywordQuery.QueryText = SolidQ;
6. A diferencia del modelo de objetos de servidor, nos har falta declararnos otro
objeto llamado SearchExecutor, encargado de mandar las consultas al motor de bsquedas. A
este objeto ser necesario que pasemos tambin el contexto.
SearchExecutor searchExecutor = new SearchExecutor(clientContext);
7. Para obtener los resultados de la bsqueda llamaremos a una funcin del

SearchExecutor llamada ExecuteQuery pasndole el objeto KeywordQuery que habamos
167
declarado previamente. Este mtodo devuelve los resultados del tipo ClientResult<Result
TableCollection>.
ClientResult<ResultTableCollection> resultado = searchExecutor.

ExecuteQuery(keywordQuery);
8. Este paso es muy importante, ya que podemos creer que se ha ejecutado la consulta
y ya tenemos el trabajo hecho. Pues bien, hasta que no hagamos el ExecuteQuery del contexto
no tendr efecto la consulta.
clientContext.ExecuteQuery();
9. Tan solo quedara mostrar el resultado por pantalla que tendramos almacenado
en resultado. Aqu, podemos apreciar que hemos consultado el archivo que previamente
subimos desde SharePoint.
10. El cdigo al completo

namespace SharePoint2013_3_3_2
{
class Program
{
static void Main(string[] args)
{
using (ClientContext clientContext = new
ClientContext(http://mydevelopersite))
{
KeywordQuery keywordQuery = new
KeywordQuery(clientContext);
keywordQuery.QueryText = SolidQ;
SearchExecutor searchExecutor = new
SearchExecutor(clientContext);
168
ClientResult<ResultTableCollection> resultado =
searchExecutor.ExecuteQuery(keywordQuery);
clientContext.ExecuteQuery();
foreach (var resultRow in resultado.Value[0].ResultRows)

{
Console.WriteLine(resultRow[Title] + - +
resultRow[Path] + -);
}
Console.ReadLine();
Ejemplo 3 Modelo de objetos cliente JavaScript + REST

En este ejemplo accederemos a una lista para consultar los datos mediante REST + JavaScript.
Una vez vistos todos los apartados necesarios para comprender cmo funciona la API
REST, vamos a proceder a realizar una demostracin. El escenario que presento trata de crear
un SharePoint-hosted App, la cual crea y despliega una lista cuyos datos son consultados va
REST. Cuando digo que despliega una lista me refiero a que crea una lista, pero en lugar de
ser una lista dentro de un sitio de SharePoint, crea la lista dentro del subsitio que se crea para
la propia app (vase el captulo 2 para comprender funcionamiento interno de las apps segn
donde estn alojadas). Mencionar tambin, que en este ejemplo podramos hacerlo sin problemas ya que la app estar alojada en SharePoint, es decir, en el mismo servidor que nuestros
datos. Si hubiramos elegido Provider-hosted o Autohosted tendramos que haber utilizado la
cross-domain library, la cual ha sido explicada anteriormente.
Antes de empezar con el ejemplo, sera importante tener claros ciertos conceptos sobre el
despliegue de la lista desde un proyecto SharePoint-hosted.
Para empezar, por el hecho de tener esta lista en la app web (subsitio creado para albergar
la app), sta no ser accesible desde la interfaz, a menos que pongamos nosotros la URL adecuada en el navegador o desarrollemos cdigo personalizado que nos permita modificar la lista.
Otra forma de consultarla es mediante PowerShell. Hay que tener en cuenta que al desplegar
la lista como parte de nuestro proyecto SharePoint-Hosted dicha lista depender de la app, es
decir, cuando se borre la app esta lista desaparecer. A raz de esto surge la pregunta, de si es
mejor tener la lista dentro de la app o creada en nuestro SharePoint. Pues depende mucho de
nuestros intereses, si es una lista global en la cual varios recursos o aplicaciones van a tirar de
ella, entonces debera estar en SharePoint. En cambio, si es una lista de mbito local, utilizada
169
solamente por la app que me estoy instalando, como la del ejemplo, es decir, que nicamente
se usa para dar servicio a la app, lgicamente debera estar embebida en dicha app.
A continuacin, vemos un ejemplo del escenario previamente comentado. En el primer
bloque vemos una lista que se encuentra en SharePoint y en el segundo vemos una lista que
se despliega mediante una SharePoint-hosted App en la cual, al borrar el sitio que crea consigo
la app, se elimina tambin la lista.
Figura 3-55. Alojamiento de una lista en una

SharePoint App
Dicho esto comencemos con el ejemplo.

1. Empezaremos creando un proyecto SharePoint-hosted App.
2. Aadiremos la lista al proyecto la cual llamaremos Customers utilizando una de las
tantas plantillas que tenemos, en concreto la de Contacts
170
Figura 3-56. Aadir lista Customers a una SharePoint app
3. El siguiente paso es meterle contenido a esta lista. Para ello nos vamos al Elements.
xml y aadimos los datos necesarios dentro de a etiqueta<ListInstance>. El archivo en
cuestin quedara de la siguiente forma:


<ListInstance Title=Customers
OnQuickLaunch=TRUE
TemplateType=105
FeatureId=00bfea71-7e6d-4186-9ba8-c047ac750105
Url=Lists/Customers
Description=My List Instance>
<Data>
<Rows>
<Row>
<Field Name=FirstName>Jose</Field>
<Field Name=Title>Quinto</Field>
<Field Name=WorkPhone>11111</Field>
</Row>
<Row>
<Field Name=FirstName>Guillermo</Field>
171
<Field
<Field
</Row>
<Row>
<Field
<Field
<Field
</Row>
<Row>
<Field
<Field
<Field

</Row>

</Rows>

</Data>
</ListInstance>
</Elements>
Name=Title>Bas</Field>
Name=WorkPhone>22222</Field>
Name=FirstName>Cristian</Field>
Name=Title>Zaragoza</Field>
Name=FirstName>Roberto</Field>
Name=Title>Ramon</Field>
4. Una vez construida la lista a consultar, necesitamos aadir el cdigo necesario para
consultarla mediante REST y obtener todos sus datos. Para ello, utilizaremos el archivo App.
js, que es el archivo que viene por defecto bajo la carpeta Scripts/App.js y se utiliza para
meter cdigo JavaScript personalizado. En este archivo vienen introducidas unas funciones
las cuales se ejecutan por defecto y de las que podemos borrar todas menos una, sharePointReady(); si borramos sta nos dar un error JavaScript. Esta funcin acta como
.ready() de jQuery, es decir, cada vez que se recarga la pgina esta funcin se lanza.
A continuacin, vamos a realizar un estudio sobre este archivo que es el ms importante,
empezando -como no- por la funcin sharePointReady(). En concreto, consultaremos la lista
desplegada, seleccionaremos los campos FirstName,Title,WorkPhone y terminaremos ordenando con FirstName,Title. La variable _spPageContextInfo.webAbsoluteUrl nos proporciona
el contexto en el cual se encuentra nuestra app, necesario para hacer la llamada REST. Una vez
formada la cadena, llamamos a la funcin getJSON pasndole la direccin y la funcin a la que
accede. Si todo ha ido bien, entra en la funcin onSuccess mandndole por parmetro los datos
devueltos en formato JSON; si no ha ido bien, pasa de lnea y entra en la funcin onFail.
var requestUri = _spPageContextInfo.webAbsoluteUrl +
/_api/Web/Lists/getByTitle(Customers)/items/ +
?$select=FirstName,Title,WorkPhone +

&$orderby=FirstName,Title;
172
jqhxr = $.getJSON(requestUri, null, onSuccess);

jqhxr.error(onFail);
5. La siguiente funcin a comentar es onSuccess. sta recibe por parmetro los datos
devueltos por la llamada REST. Mediante jQuery creamos una plantilla, a los datos le asignaremos esa plantilla y, por ltimo, lo meteremos todo bajo un <ul> de HTML con id=results
que tendramos ya previamente definido.
function onSuccess(data) {
var odataResults = data.d.results;

var markup = <li><b>${FirstName}</b> <b>${Title}</b>
<b>${WorkPhone}</b></li>;
$.template(dataCustomers, markup);
$.tmpl(dataCustomers, odataResults).appendTo(#results);
}
6. La ltima funcin del archivo a comentar ser onFail(). A sta llegaremos si la peticin va REST ha fallado. Lo nico que har esta funcin ser mostrar el error producido.
function onFail(errorObject, errorMessage) {

$(#results).text(Error: + errorMessage);
}
7. Utilizaremos la pgina que viene por defecto en SharePoint, default.aspx. En esta

pgina necesitaremos incluir la cabecera necesaria para aplicar plantillas de jQuery.
<script src=http://ajax.microsoft.com/ajax/jquery.templates/beta1/
jquery.tmpl.min.js></script>
173
8. El siguiente cambio a realizar en el archivo default.aspx ser en el PlaceHolderMain

en el que habr que incluir el <ul> con id=results en el cual metamos los datos, quedando
as:

<ul id=results></ul>
</asp:Content>
9. El aspecto final del proyecto quedara as:
Figura 3-57. Estructura del proyecto de una SharePoint app
174
10. El resultado del ejercicio sera el siguiente:
Figura 3-58. Resultado API REST + JavaScript
175
Qu modelo de objetos usar en cada caso?

En este ltimo apartado, vamos a representar en una tabla, algunos de los escenarios ms
interesantes que podemos encontrar respecto a SharePoint 2013 y vamos ha indicar el modelo
de objetos ms apropiado para cada caso.
N
1
2
3
4
5
6
7
8
10
11
12
13
14
ESCENARIO
Desarrollo de WebPart personalizado
Desarrollo de aplicacin de pginas personalizada
Desarrollo de un control de usuario
Desarrollo de un Workflow personalizado
Desarrollo de un Timer Job personalizado
Desarrollo de manejadores de eventos
personalizados(Events Receivers)
Desarrollo de una Windows Phone app para implementar operaciones CRUD en SharePoint
Desarrollo de una Windows Phone app para implementar notificaciones en el mvil producidas por
eventos de SharePoint
Desarrollo de una aplicacin LAMP(Linux-ApacheMySql-PHP) que realice operaciones CRUD en
SharePoint
Desarrollo de una aplicacin iOS o Android que permita realizar operaciones CRUD sobre SharePoint
Desarrollo de una aplicacin ASP.NET que permita
realizar operaciones CRUD sobre SharePoint fuera
del firewall
Desarrollo de una aplicacin HTML/JavaScript que permita realizar operaciones CRUD sobre SharePoint
Desarrollo de una aplicacin ASP.NET que permita realizar
operaciones CRUD dentro del firewall
Desarrollo de una aplicacin .NET en cliente que
permita realizar operaciones sobre SharePoint
MODELO DE OBJETOS
Modelo de objetos de servidor
Modelo de objetos de cliente en
mvil
Modelo de objetos de cliente en
mvil
REST/OData endpoints
REST/OData endpoints
Modelo de objetos de cliente JavaScript
Modelo de objetos de cliente JavaScript
Cliente .NET Framework, cliente
Silverlight, REST/OData endpoints
Cliente .NET Framework
176
Conclusiones
Hemos empezado este captulo profundizando sobre el desarrollo de las SharePoint apps.
Hemos visto que uno de los puntos ms importantes en cuanto a lo que se pretende conseguir
con las apps es que vivan de manera aislada al entorno donde est instalado SharePoint. De
esta manera, se consigue que las apps no roben recursos a SharePoint, y por tanto, evitar
problemas de rendimiento. Al mismo tiempo, con esto mismo se consigue dar libertad a los
desarrolladores en cuanto a qu lenguaje utilizar para desarrollar apps. No estamos sujetos a
usar tecnologas de Microsoft, si no que es posible utilizar desde PHP a HTML bsico.
Por otro lado, se ha visto que con las apps uno de los peligros que corremos es dar la
sensacin al usuario de que le estamos sacando fuera del contexto de SharePoint, y esto es
precisamente lo que debemos evitar a toda costa. Para ello SharePoint 2013 cuenta con una
serie de mecanismos que permiten maquetar y disear apps con el fin de que stas se adapten
al entorno donde se muestran, heredando los estilos de la pgina o sitio en cuestin.
Hemos hecho un intensivo recorrido sobre el conjunto de las API disponibles que tiene
para utilizar el desarrollador. Una vez vistas las distintas API, hemos centrado nuestra atencin
principalmente en aquellas que estn en el lado del cliente, bsicamente porque en este libro
estamos tratando todo lo relacionado con las apps y desde stas, recuerda que no est permitido utilizar cdigo de servidor.
Tambin hemos hecho mucho hincapi en las novedades que trae consigo la API REST, a
la que se le ampla mucho su funcionalidad en la nueva versin del producto. Con esta API
REST y su extendida funcionalidad, seremos capaces que acceder a SharePoint desde cualquier
dispositivo que soporte REST. Por lo tanto, acabamos con esta limitacin que tantos dolores de
cabeza haba producido. Para trabajar con REST y no tener problemas del cross domain (que
tengamos nuestra aplicacin y nuestro SharePoint en servidores distintos), en este captulo se
explica el uso de la cross-domain library la cual nos permitir resolver esta problemtica. Por lo
tanto, es fundamental conocerla y aplicarla, ya que casi siempre necesitaremos hacer uso de
ella. Desde esta API tambin es posible hacer uso de los servicios disponibles en SharePoint,
como puede ser por ejemplo el servicio de bsqueda. Por lo tanto, podemos concluir que la
API REST es una candidata muy firme para ser utilizada siempre que se pueda en nuestros
desarrollos, ya que una vez aprendamos a manejarnos con ella, seremos capaces de desarrollar
en distintos dispositivos con la misma base de lo que ya sabemos.
Por ltimo, una vez visto todo esto, es importante saber qu modelo de objetos utilizar en
cada escenario. Para ello, incluimos una tabla en la que el desarrollador puede orientarse sobre
qu API elegir, ya que la eleccin de la misma es el paso ms importante.
177
Captulo4:InstalacinyadministracindeSharePointApps
Hasta este punto de este libro nos hemos sumergido en el universo de las SharePoint apps
desde su concepcin hasta su desarrollo pasando por un amplio abanico de posibilidades en
lo que se refiere a la implementacin de las mismas. Sin embargo, nos queda uno de los apartados ms importantes, la gestin de las apps en nuestra granja, desde su instalacin hasta la
gestin de permisos y autorizacin de las mismas en nuestros servidores. Esto es lo que vamos
estudiar en este captulo; empezaremos por el acceso al Office Store y la instalacin de aplicaciones expuestas pblicamente.
Instalando aplicaciones desde el Office Store

Para revisar el proceso de instalacin de aplicaciones para SharePoint desde el Office Store,
vamos a utilizar una cuenta de Office 365 Preview en su versin Enterprise. En este punto, cabe
recordar que la plataforma de SharePoint apps est diseada para que estas funcionen exactamente igual tanto en SharePoint Online como en la versin de servidor local. Para este proceso
estoy utilizando un usuario que tiene el rol de administrador global de la cuenta de Office 365,
cuyos permisos equivalentes en una granja local seran los de administrador de la granja.
Desde nuestro sitio principal de SharePoint Online podemos hacer clic sobre los tres puntos
de la barra de opciones superior y acceder desde ah al Office Store pblico ver Figura 4-1. Barra
superior de opciones.
178
Captulo 4: Instalacin y administracin de SharePoint Apps
Figura 4-1. Barra superior de opciones
Es posible que encontremos un mensaje similar a este Lo sentimos, pero no hay ninguna
aplicacin de Office o SharePoint disponible para su pas o regin en este momento. Visite el
sitio de EE.UU. para ver las ltimas aplicaciones.. Dado que estamos an en una fase temprana
de publicacin de SharePoint apps, aceptaremos la invitacin de visitar el Office Store de los
Estados Unidos para nuestro ejemplo.
Una vez situados sobre el Office Store de Estados Unidos podemos acceder a las aplicaciones de SharePoint filtrando desde el men principal donde pone Apps for SharePoint (ver
Figura 4-2. Filtros en el Office Store).
Figura 4-2. Filtros en el Office Store
All seleccionamos la aplicacin que deseamos instalar para ver su pgina de descripcin
completa. En este caso, vamos a hacerlo sobre la aplicacin de integracin con Facebook de
Microsoft (Facebook Integration).
179
Una vez lleguemos a la pgina de descripcin de la aplicacin veremos algo parecido a la

Figura 4-3. Pgina de detalle de la aplicacin Facebook Integration.
Figura 4-3. Pgina de detalle de la aplicacin Facebook Integration
En la Figura 4-3 podemos observar cmo se nos presenta la descripcin de la aplicacin,

una imagen descriptiva de su funcionamiento y lo ms importante el botn verde Add (Aadir),
que nos permitir ver lo que tenemos que hacer para aadir dicha aplicacin a nuestro sitio.
As pues hacemos clic en dicho botn y llegamos a una pgina de instrucciones en la que se
nos invita a copiar un cdigo a travs del cual podremos encontrar y aadir la aplicacin directamente en el sitio que deseemos (ver Figura 4-4. Instrucciones para obtener la aplicacin).
180
Figura 4-4. Instrucciones para obtener la aplicacin
181
Siguiendo las instrucciones, copiamos dicho cdigo y volvemos a nuestro sitio (aquel en el
que deseemos instalar la aplicacin), y accedemos al men de agregar aplicaciones a travs del
men de configuracin que hay arriba a la derecha en la barra superior de opciones de nuestro
sitio (ver Figura 4-5. Acceso al men de agregar aplicaciones).
Figura 4-5. Acceso al men de agregar
aplicaciones
Una vez estamos en el sitio donde aparecen todas nuestra aplicaciones disponibles podemos buscar la aplicacin de Facebook Integration a travs del cdigo proporcionado anteriormente por el Office Store, poniendo este cdigo en el buscador no encontrar resultados
locales para aplicaciones instaladas pero s nos avisar de que hay un resultado coincidente en
el Office Store (ver Figura 4-6. Bsqueda de aplicaciones por cdigo.
Figura 4-6. Bsqueda de aplicaciones por cdigo
182
As pues, hacemos clic en el link Almacn de SharePoint que nos llevar de nuevo al Office
Store, pero esta vez con un formato diferente asociado de alguna forma a nuestro sitio. Aqu
de nuevo tendremos que seleccionar la regin como Estados Unidos para poder acceder a la
aplicacin. Finalmente, haremos clic sobre el icono de la aplicacin (ver Figura 4-7. Almacn de
SharePoint) para acceder de nuevo a su pgina de detalles.
Figura 4-7. Almacn de SharePoint
Esta vez, antes de hacer clic sobre el botn Agregar observamos que debajo del mismo
tenemos detallados los permisos que necesita la aplicacin (y que debemos aceptar para instalarla) (ver Figura 4-8. Permisos de aplicacin).
Figura 4-8. Permisos de aplicacin
183
Una vez revisados los permisos, cerramos la ventana emergente y pulsamos sobre el botn
Agregar. En este punto es posible que nos solicite volver a autenticarnos con una cuenta
Microsoft y no con la cuenta de la organizacin16.
Una vez hecho esto, nos mostrar un mensaje en el que nos confirma que hemos obtenido esta aplicacin para todas las personas de nuestra organizacin y adems nos muestra
la posibilidad, mediante una casilla de verificacin, de agregarla directamente al sitio en el
que estbamos; en este caso, como era un sitio pblico vaco nos muestra el ttulo Ttulo de
pgina web que es el texto por defecto que lleva este tipo de plantilla en el nombre del sitio
(ver Figura 4-9. Pantalla de obtencin de aplicacin).
Figura 4-9. Pantalla de obtencin de aplicacin
16
Esto significa que tenemos que autenticarnos con la cuenta de correo a travs de la cual creamos
esta subscripcin de Office 365 y que necesariamente est asociada a Microsoft (lo que antes era conocido como
Live ID).
184
Una vez pulsamos el botn volver al sitio, nos pide confirmacin de los permisos otorgados a la aplicacin y nos permite leer los trminos y condiciones (ver Figura 4-10. Confirmacin
de confianza en la aplicacin). Pulsamos en Confiar y continuamos hasta nuestro sitio.
Figura 4-10. Confirmacin de confianza en la aplicacin
Una vez hayamos vuelto a nuestro sitio ya veremos la aplicacin agregada en el mismo,
junto con el resto de aplicaciones existentes (ver Figura 4-11. Aplicaciones disponibles en un
sitio).
Figura 4-11. Aplicaciones disponibles en un sitio
185
Ahora ya podemos hacer uso de la aplicacin haciendo clic en ella. En este punto, no vamos
a seguir profundizando en el funcionamiento de la aplicacin Facebook Integration ya que a
partir del momento en que hacemos clic en la aplicacin ya agregada a nuestro sitio, la experiencia depender del desarrollador de la misma, qu opciones haya agregado, qu interfaz de
usuario, etc Pero no por eso hemos terminado con la administracin de nuestra aplicacin.
Administracin de aplicaciones instaladas

Vamos a continuar administrando nuestras aplicaciones instaladas y viendo qu opciones
tenemos disponibles para su gestin una vez las hemos adquirido y agregado a nuestros sitios.
Continuando con el ejemplo anterior, en el que instalamos la aplicacin Facebook Integration
en un sitio pblico, vamos a ver qu informacin y opciones de administracin nos ofrece el
sistema respecto a esta aplicacin. Al situarnos encima de la aplicacin, arriba a la derecha,
observamos que aparecen tres puntos que nos indican que hay opciones ocultas, al hacer clic
en los mismos se muestra un pequeo globo con informacin y opciones sobre la aplicacin
y de nuevo otros tres puntos a la derecha a travs de los cuales podemos acceder a otras tres
opciones adicionales (ver Figura 4-12. Men contextual de aplicacin).
Figura 4-12. Men contextual de aplicacin
Aqu las opciones ms interesantes son precisamente las ltimas tres:

-- Detalles. Esta opcin nos lleva a una pgina de detalles sobre la aplicacin, con informacin muy relevante sobre su utilizacin: estadstica de errores, quin instal la aplicacin,
estadstica de uso y otras opciones muy interesantes de monitorizacin.
186
-- Permisos. Aqu podemos volver a confiar en la aplicacin reconociendo de nuevo los

permisos que necesita la misma, bien sea porque se los hemos denegado en algn momento
o por cualquier otra razn.
-- Quitar. Como bien indica el nombre de esta opcin, nos servir para quitar la aplicacin
de este sitio, con lo que dejar de estar disponible. Si queremos volver a utilizarla en el futuro,
tendremos que volver a agregarla desde el men Agregar una aplicacin.
Por ltimo, podemos administrar los permisos de cada aplicacin instalada tanto a nivel
de sitio como de coleccin de sitios. Para administrar los permisos de aplicacin a este nivel
tenemos que acceder a la configuracin del sitio desde el men de configuracin de la barra
superior de opciones (ver Figura 4-13. Acceso a configuracin del sitio).Desde la configuracin del sitio podemos restringir el uso de cualquier aplicacin instalada tanto a nivel de sitio
Permisos de aplicaciones del sitio como a nivel de coleccin de sitios Permisos de aplicacin
de coleccin de sitios (ver Figura 4-14. Opciones de configuracin de permisos).
Figura 4-13. Acceso a configuracin del sitio
Figura 4-14. Opciones de

configuracin de permisos
187
La interfaz para eliminar los permisos de una aplicacin es muy sencilla e idntica en
ambos casos, tan solo aparecer un listado de aplicaciones instaladas y una cruz a la izquierda
para eliminar los permisos de dicha aplicacin (ver Figura 4-15. Gestin de permisos de la
aplicacin).
Figura 4-15. Gestin de permisos de la aplicacin
El catlogo de aplicaciones (App Catalog)

En este captulo solo hemos revisado en profundidad el proceso de instalacin para
SharePoint Online en la plataforma Office 365 Preview. Para entornos de servidor local en nuestra propia red corporativa, adems de utilizar este sistema para instalar aplicaciones externas,
existe un catlogo local de aplicaciones, lo que vendra a ser un Office Store local controlado
por nosotros. Las opciones de configuracin del mismo las podemos encontrar en la administracin central17 de SharePoint 2013. En la Figura 4-16 podemos observar como dentro de la
Administracin Central existe un rea nueva dedicada a las SharePoint apps. Justamente desde
esta rea podremos crear la coleccin de sitios de tipo Catalog App Host que nos permitir
utilizar nuestro SharePoint como catlogo de apps (ver Figura 4-17. Creacin y configuracin
del Catlogo de apps dentro de SharePoint 2013.).
Figura 4-16. Seccin dedicada a las SharePoint apps

dentro de la Administracin
Central de SharePoint 2013.
17
Ms informacin sobre la configuracin del App Catalog aqu http://msdn.microsoft.com/en-us/
library/fp123530(v=office.15).aspx (En ingls)
188
Figura 4-17. Creacin y configuracin del Catlogo de apps dentro de SharePoint 2013.
Este catlogo de aplicaciones nos permite instalar aplicaciones creadas por terceros sin
pasar por el Office Store, de forma que siguiendo las mismas reglas de seguridad y aislamiento
podamos proveer o contratar dependiendo de la situacin aplicaciones personalizadas, realizadas por terceros.
189
Conclusiones
Hemos seguido el ciclo de instalacin y administracin completo de una aplicacin obtenida desde el Office Store para un entorno de SharePoint Online sobre Office 365 Enterprise
Preview.
El proceso de instalacin queda todava relativamente complejo dada la necesidad de
navegar el Office Store para obtener el cdigo nico de la aplicacin que deseamos instalar
antes de poder encontrarla con facilidad desde nuestro entorno. Suponemos que en prximas actualizaciones, quizs la RTM del producto, este proceso ser ms intuitivo y sencillo. En
cambio, no podemos decir lo mismo del proceso de gestin de permisos y desinstalacin de
aplicaciones, ya que se ha demostrado que es un proceso realmente sencillo y que nos proporciona la informacin necesaria para saber qu uso se est haciendo de cada aplicacin en
nuestros sitios con las mtricas de uso del detalle de las aplicaciones.
Con todo esto, podemos concluir que la administracin del nuevo modelo aplicaciones se
muestra slido para ser su primera versin y ms que suficiente para las necesidades de monitorizacin que acostumbran a utilizarse en la mayora de entornos de TI empresariales.
190
Captulo5:NovedadesinfluenciadasporlasSharePointApps
El nuevo modelo de desarrollo que concierne a las SharePoint Apps, ha propiciado una
serie de novedades necesarias que vienen a complementar dicho modelo. En este captulo trataremos temas muy interesantes como Napa (el entorno de desarrollo de SharePoint y Office
Apps en la Nube), los nuevos eventos remotos que pueden complementar la funcionalidad
de las apps y un ltimo apartado referido a los flujos de trabajo donde veremos que toda la
infraestructura ya no es guardada bajo SharePoint.
Plataforma de desarrollo en la Nube Introduccin a Microsoft Napa

Una de las grandes bazas de la nueva versin de SharePoint, y en especial su nuevo modelo
de desarrollo de aplicaciones, es que no haya diferencias entre lo que se puede hacer en la Nube
y en nuestros propios servidores locales. En este contexto de empeo por parte de Microsoft
de equiparar los servicios en la Nube a los servicios locales, nace una plataforma de desarrollo
de SharePoint y Office apps cuyo nombre en clave es Napa. Este nombre, para aquellos que no
somos naturales de Estados Unidos, nos suena ms bien pintoresco (a los autores de este libro
personalmente nos recuerda a un personaje del mismo nombre en la serie de dibujos Dragon
Ball), pero en realidad no tiene mucho misterio, es el nombre de una regin llamada Valle de
Napa (Napa Valley) situada en el estado de California, en los Estados Unidos, que es famoso
por sus viedos y la produccin de vino (ver Figura 5-1. Foto tomada por Brocken Inaglory
(extrada de Wikipedia.org)).
191
Captulo 5: Novedades influenciadas por las SharePoint Apps
Figura 5-1. Foto tomada por Brocken Inaglory (extrada de Wikipedia.org)
Pero ms all de nombres curiosos y paisajes idlicos, Napa es una plataforma de desarrollo que hace posible el desarrollo de aplicaciones para SharePoint y Office desde la Nube, s, lo
mismo que Visual Studio, pero directamente desde nuestro navegador sin necesidad de instalar absolutamente nada en nuestra mquina local.
Por supuesto, Napa, en su versin actual, marcada en el Office Store como beta, no nos
ofrece todas las posibilidades que podemos encontrar en herramientas de escritorio como
Visual Studio. Por eso, a continuacin vamos a detallar qu tipos de aplicacin nos permitir
desarrollar Napa y en qu condiciones.
-- Aplicaciones para SharePoint. Solo podremos desarrollar aplicaciones para SharePoint
del tipo SharePoint-hosted, ni las Provider-hosted ni las Autohosted estarn soportadas.
-- Aplicaciones para Word. Solo podremos crear aplicaciones de tipo Panel de tareas
lateral (Task Pane). En este caso se requiere Office 2013 para desplegar la aplicacin.
-- Aplicaciones para Excel. Podremos crear dos tipos de aplicaciones para Excel, por una
parte los mismos Paneles de tareas laterales (Task Pane) de Word nos servirn para Excel, y por
otra parte tambin podremos desarrollar aplicaciones de contenido para Excel (Content Apps)
que son aquellas que se despliegan directamente sobre el contenido de una hoja de clculo de
192
Excel. En este segundo caso, s funcionaran sobre la Excel Web App directamente sin necesidad de tener Excel 2013 instalado en el escritorio.
-- Aplicaciones para Outlook. Podremos crear las tambin llamadas Mail Apps sin
problemas.
Dado el contexto del libro en este captulo solo desarrollaremos una pequea aplicacin
para SharePoint haciendo uso de Napa.
Navegadores soportados
El lema principal de Napa es que puedas desarrollar tus aplicaciones desde cualquier parte
y en cualquier momento, con este objetivo Napa est soportado para los tres navegadores ms
utilizados en sus versiones ms recientes, Internet Explorer 9 o superior, Firefox 15 o superior
y Google Chrome 21 o superior. Adems, como no se utiliza ningn tipo de plugin externo al
propio navegador, tambin es compatible con la versin tctil de Internet Explorer 10 (accesible desde la parte Metro de Windows 8) (ver Figura 5-2. Napa funcionando sobre IE10 versin
metro)
Figura 5-2. Napa funcionando sobre IE10 versin metro
Con esto podemos dar por sentado que funcionar tambin en tabletas con Windows 8 RT,
lo que resulta bastante impresionante.
Lamentablemente, no todo son buenas noticias en este sentido ya que en esta fase de desarrollo, Napa no es compatible con ninguna versin de Safari, ni Windows ni Mac ni iOS, es decir,
193
no es posible ejecutarlo desde dispositivos iPad, por ejemplo. Si lo intentamos, obtendremos un

mensaje diciendo que el navegador que estamos utilizando no est soportado.
Instalando y ejecutando NAPA por primera vez

Para utilizar Napa necesitamos obtenerlo e instalarlo en forma de aplicacin para SharePoint
desde el Office Store. Para la instalacin de la aplicacin seguiremos los siguientes pasos.
En primer lugar, para poder instalar Napa vamos a necesitar una coleccin de sitios creada
a partir de la plantilla Sitio de desarrollador (ver Figura 5-3. Seleccin de plantilla).
Figura 5-3. Seleccin de plantilla
Una vez creado nuestro sitio de desarrollador, desde la pgina principal tenemos un enlace
directo a la aplicacin de Napa para instalarla (ver Figura 5-4. Acceso directo a la creacin de
aplicaciones).
Figura 5-4.
Acceso directo
a la creacin de
aplicaciones
Una vez agregada la aplicacin, solo tenemos que hacer clic sobre el icono de la misma
para acceder a ella y comenzar un nuevo proyecto de aplicacin para SharePoint. En la primera
pantalla de la aplicacin, sta nos ofrece comenzar un tipo de aplicacin (de los mencionados
194
anteriormente en este mismo captulo) y ponerle un nombre al proyecto (ver Figura 5-5. Tipos
de aplicacin posibles con Napa). En nuestro caso, vamos a crear la aplicacin ejemplo
SharePoint_5_1_1.
Figura 5-5. Tipos de aplicacin posibles con Napa
Una vez le hemos dado nombre a nuestro proyecto y pulsamos en el botn Crear (Create),
la aplicacin nos trasladar directamente al entorno integrado de desarrollo en el navegador.
Este entorno consta de cuatro partes bien diferenciadas.
195
En la ver Figura 5-6 se presentan todos los componentes de la interfaz principal de Napa
etiquetados para referencia del lector.
Figura 5-6. La interfaz de Napa etiquetada parte por parte
Por un lado, est la zona de edicin del cdigo fuente, en la que podemos escribir nuestro
cdigo y editar los distintos ficheros que componen la aplicacin que estamos desarrollando;
esta zona queda situada en la zona central de la pantalla a la derecha del navegador de contenidos del proyecto. En esta parte, adems, disponemos de un Intellisense avanzado, similar al
de Visual Studio (ver Figura 5-7. Intellisense en Napa).
Figura 5-7. Intellisense en Napa
El navegador de contenidos queda situado en la columna derecha agrupando los tipos de

fichero por tipos: Contenido (Content), Imgenes (Images), Pginas (Pages) y Cdigo (Scripts).
Adems de mostrar los ficheros que componen nuestra aplicacin, nos permite su administra-
196
cin a travs de un men contextual a nivel de grupo (crear o subir nuevos ficheros) y a nivel
particular de fichero (renombrar o eliminar el fichero) (ver Figura 5-8. Menu contextual para
objetos).
Figura 5-8. Menu contextual

para objetos
Una de las partes ms importantes es la barra inferior de opciones. En ella podemos encontrar
las herramientas para ejecutar, borrar, configurar y compartir nuestra aplicacin y nuestro cdigo.
Adems, existe una opcin muy interesante para abrir nuestro cdigo en Visual Studio y no quedar
permanentemente limitados a esta interfaz de desarrollo, pudiendo empezar una aplicacin en
Napa y llegado a un punto de complejidad en el que necesitemos una herramienta ms completa
podamos pasar a Visual Studio para continuar con el desarrollo.
Vale la pena detenernos a comentar el men de Propiedades (Properties) de la barra inferior.
Mediante este botn se accede a una ventana de propiedades en la que podemos configurar desde
las propiedades ms importantes del manifest de nuestra aplicacin hasta los endpoints y permisos
que necesitar la misma para llevar a cabo su funcionalidad (ver Figura 5-9. Men de propiedades).
197
Figura 5-9. Men de propiedades
Otra de las opciones interesantes que cabe destacar de la barra inferior de opciones es el
botn para continuar nuestro desarrollo en Visual Studio. Cuando hacemos clic por primera vez
en este botn nos muestra una advertencia de que se lanzar el Web Platform Installer. Para
asegurarnos de que los componentes necesarios para el desarrollo de aplicaciones estn instalados, obviamente, necesitamos tener previamente instalado nuestro propio Visual Studio 2012.
En la ver Figura 5-10 se puede ver cmo es la apariencia del instalador.
198
Figura 5-10. Proceso de instalacin de Web Platform Installer
Una vez abierto el proyecto en Visual Studio 2012, tendremos toda la estructura del mismo
disponible y cuando intentemos modificar cualquier cosa del proyecto el propio Visual Studio
nos pedir las credenciales de Office 365 Preview necesarias para mantener el cdigo conectado
a la Nube, de forma que se mantenga sincronizado con lo que tenemos en Napa.
Por ltimo, tenemos la barra superior en la que podemos encontrar, por una parte la miga
de pan contextual, que nos muestra el nombre del proyecto en el que estamos y nos permite
volver al men principal de Napa, y por otra parte, a la derecha encontramos un men de
opciones que nos da acceso a un perfil de configuracin que nos permite configurar el tipo
de proyecto en caso de abrirlo en Visual Studio (Visual Basic o C#) y la direccin de correo
electrnico que utilizaremos para las pruebas con aplicaciones para Outlook. En nuestro perfil,
tambin encontraremos un botn para eliminar toda la informacin de los proyectos y dejar
de utilizar la aplicacin completamente en este entorno, de forma que borremos todo rastro
de su uso (ver Figura 5-11. Pantalla de perfil de desarrollo).
199
Figura 5-11. Pantalla de perfil de desarrollo
Una vez tenemos claro todo el entorno de desarrollo de Napa ya estamos listos para ejecutar nuestra primera aplicacin desde la Nube. Por quedar fuera del objeto de este captulo
no desarrollaremos una aplicacin nueva para probar la funcionalidad de Napa, utilizaremos el
cdigo base que viene incluido de serie en la plantilla de aplicacin para SharePoint del mismo
entorno, que muestra el nombre del usuario actual por pantalla al ejecutar la aplicacin. As
pues, pulsamos sobre el botn Ejecutar (Run Project) de la barra de opciones inferior y
aparecer una ventana de carga que nos muestra el proceso de subida, compilacin y despliegue de la aplicacin para terminar ofrecindonos acceder a nuestra aplicacin en una nueva
ventana.
Una vez salgamos de la ejecucin de la aplicacin y volvamos a nuestro sitio de desarrollador,
en este sitio nos aparecer un listado con las aplicaciones que hemos creado bajo el subttulo
Aplicaciones en fase de prueba (ver Figura 5-12. Aplicaciones disponibles).
200
Figura 5-12. Aplicaciones disponibles
Desde este listado podemos ejecutar las aplicaciones que hemos ejecutado anteriormente
desde Napa, haciendo muy sencillo el acceso a estas aplicaciones para las pruebas con usuarios en este entorno de desarrollo.
La prxima vez que queramos continuar nuestro desarrollo desde Napa debemos entrar
de nuevo en nuestro sitio de desarrollador y desde el mismo men que instalamos Napa (el de
Crear una aplicacin en la pgina principal de nuestro sitio) ahora accederemos directamente
a Napa viendo las aplicaciones que tenemos guardadas de veces anteriores y pudiendo tambin comenzar nuevos desarrollos (ver Figura 5-13. Aplicaciones creadas anteriormente).
Figura 5-13. Aplicaciones creadas anteriormente
201
Conclusiones
La plataforma de desarrollo en la Nube para Office 365 Preview, Napa, ha sido posiblemente una de las ms gratas sorpresas que nos ha deparado a los desarrolladores la nueva
plataforma de desarrollo de aplicaciones para SharePoint y Office. Con Napa Microsoft llega un
paso ms lejos en la batalla por llevar todo y a todos a la Nube iniciando un camino que posiblemente acabe en un Visual Studio para la Nube mucho ms completo en futuras versiones.
Obviamente, en su versin actual, Napa no remplaza por completo, en ningn caso a Visual
Studio 2012, pero s lo complementa, tal y como hacen las Office Web Apps con el Office de
escritorio, flexibilizando la edicin y ejecucin de nuestro cdigo desde prcticamente cualquier parte en la que tengamos acceso a Internet y a un navegador soportado. Con todo esto
podemos concluir que Napa es el germen de algo mucho ms grande, adems de enriquecer
la actual plataforma de desarrollo de que disponemos los desarrolladores que hacemos aplicaciones para SharePoint y Office.
Eventos en SharePoint 2013

En este captulo vamos a tratar todo lo relacionado con eventos que trae consigo la nueva
versin de SharePoint.
Novedades en Event Receivers

Para comenzar, vamos a definir qu es un Event Receiver. Por Event Receiver entendemos
pequeos trozos de cdigo que se ejecutan como reaccin a ciertos factores desencadenantes que se producen en SharePoint, como puede ser aadir un nuevo tem, actualizar un tem,
borrar un tem, etc A la hora de encontrar una similitud, podramos compararlos con los
eventos que se producen en C# (Click, ItemDataBound, etc). Resumiendo, el resultado es que
un usuario realiza una accin que hace que se ejecute cierto bloque de cdigo. Este tipo de
eventos, en SharePoint se bautizan como Event Receivers. Existe ya una extensa lista de eventos
para la cual los Events Receivers pueden saltar. En SharePoint 2013 esta lista crece para incluir
nuevos eventos relacionados con grupos, permisos y administracin de roles.
Antes de nada comentar la diferencia que existe en los eventos terminados con sufijo -ing
y -ed. Los eventos que terminan con el sufijo -ing son conocidos tambin como Before
Events y son los de tipo sncrono. Por Before Events entendemos eventos que se lanzan antes
de que los datos sean escritos en base de datos. En este tipo de eventos, la operacin todava
no ha sido completada, por lo tanto, nos permitiran cancelar el evento. En cambio, los eventos
202
que terminan con el sufijo -ed son conocidos como After Events y son de tipo asncrono. Por
After Events entendemos eventos que se lanzan a la respuesta de una accin del usuario y no
son guardadas en base de datos hasta que esta accin ha terminado. En este tipo de eventos
no se puede cancelar la operacin la cual provoc el evento. A continuacin, vamos a ver una
lista en la que aparecen todos los eventos disponibles en SharePoint 2013.
NUEVOS EVENTOS EN SHAREPOINT 2013

Before Events (antes de la accin)
GroupAdding
After Events (despus de la accin)

GroupAdded
GroupUpdating
GroupUpdated
GroupDeleting
GroupUserAdding
GroupUserDeleting
RoleDefinitionAdding
RoleDefinitionUpdating
RoleDefinitionDeleting
RoleAssignmentAdding
RoleAssignmentDeleting
InheritanceBreaking
InheritanceRestoring
GroupDeleted
GroupUserAdded
GroupUserDeleted
RoleDefinitionAdded
RoleDefinitionUpdated
RoleDefinitionDeleted
RoleAssignmentAdded
RoleAssignmentDeleted
InheritanceBroken
InheritanceRestored
ItemVersionDeleted
Adems de estos nuevos eventos, vamos a poder utilizar Events Receivers Remotos para
las apps de SharePoint y otro tipo de evento que quizs es ms peculiar, al que llamaremos
App Event Receiver, tambin para las apps de SharePoint. Como podis ver, los dos nuevos
tipos de eventos estn aplicados a las apps.
De estos dos nuevos tipos de eventos, los Events Receivers Remotos son los ms parecidos
a los eventos tradicionales, ya que son eventos que ocurren sobre un objeto de SharePoint,
como puede ser una lista, un tem de la lista, un campo de una lista, un sitio, etc. La mayor
diferencia de los Events Receivers Remotos frente a los tradicionales, es que este nuevo tipo
de eventos pueden trabajar con componentes remotos de las apps de SharePoint 2013, es
decir, pueden reaccionar ante los eventos que se producen, por ejemplo, en una lista que est
alojada en la propia app de SharePoint. Otra de las ventajas que nos ofrece es poder ejecutar
eventos sobre Listas externas (BCS). Por ejemplo, imaginemos que tenemos una fuente de
datos externa, sobre la que nos declaramos una Lista externa, mediante los Events Receivers
tradicionales no podramos capturar los eventos que se produjeran sobre esta lista, ya que
en SharePoint 2010 no est soportado. En cambio, en SharePoint 2013, mediante los Events
Receivers Remotos ya seremos capaces de capturar esos eventos. Es importante no confundir
los trminos de componentes SharePoint (listas, workflows, pginas, etc) con componentes
remotos (fuentes de datos externas, lista en una SharePoint-hosted App, etc). En el siguiente
203
grfico podemos apreciar la app1 trabajando con componentes remotos y la app2 trabajando
con componentes SharePoint.
Figura 5-14. Diferenciacin entre componentes SharePoint y componentes remotos
A continuacin, vamos a entrar ms en detalle en cada uno de los nuevos tipos de eventos,
permitiendo as al usuario ser capaz de crearlos y manejarlos.
Events Receivers Remotos

ste es el nuevo tipo de evento ms parecido a lo que ya conocamos. Los Events Receivers
Remotos pueden ser sncronos o asncronos y sern implementados mediante un servicio web.
Es decir, el cdigo que se ejecutar cuando se produzca el evento ser servido por un servicio
web. Que sea un servicio web, nos aporta mucha versatilidad ya que podramos tenerlo desplegado en un servidor y consumirlo entre distintas aplicaciones. Cuando aadamos un Event
Receiver Remoto, se aade en el proyecto web un servicio WCF que implemente el cdigo
personalizado de nuestro Event Receiver Remoto. Las dos funciones que aparecern a rellenar
en el servicio sern:
Al aadir un Event Receiver Remoto, nuestro proyecto SharePoint tambin ser ver afectado. En concreto, el archivo AppManifest.xml, que ser el encargado de enlazar entre el proyecto que define al Event Receiver Remoto y el proyecto que almacena el servicio WCF que
implementa la lgica del evento. A continuacin, un ejemplo del archivo AppManifest.xml al
crear un Event Receiver Remoto en el que se ha escogido el evento ItemAdding e ItemUpdating.
En este ejemplo, se especifica tambin el tipo de plantilla de lista para la cual se va a utilizar, el
204
nombre del manejador escogido, tipo de evento a controlar y la URL del servicio WCF bajo la
cual se encuentra la lgica.
<Receivers ListTemplateId=100>
<Receiver>
<Name>RemoteEventReceiverItemAdding</Name>
<Type>ItemAdding</Type>
<SequenceNumber>10000</SequenceNumber>
<Url>~remoteAppUrl/RemoteEventReceiver.svc</Url>
</Receiver>
<Receiver>
<Name>RemoteEventReceiverItemUpdating</Name>
<Type>ItemUpdating</Type>
<SequenceNumber>10000</SequenceNumber>
<Url>~remoteAppUrl/RemoteEventReceiver.svc</Url>
</Receiver>
</Receivers>
</Elements>
Una vez vista la forma de implementar la lgica que hay detrs de un Event Receiver
Remoto, vamos a explicar el ciclo de ejecucin que sigue (para este ejemplo usaremos un
evento Before Event, es decir, se lanza antes de que se guarden los datos en BD):
Figura 5-15. Ciclo de ejecucin de un Event Receiver Remoto
205
Antes de comenzar a redactar los puntos vistos en la imagen, es imprescindible entender

el concepto de ACS (Access Control Service). Por ACS entendemos un servicio que est en
la Nube, que nos proporciona una manera fcil de autenticar y autorizar usuarios a nuestras
aplicaciones web.
Una vez entendido esto, vamos a pasar a redactar los puntos ms en detalle:
1. sta es la interaccin inicial, un usuario actualiza una lista, es decir, aade, edita o
borra un tem, etc
2. SharePoint recibe la orden.
3. SharePoint realiza peticiones al ACS para obtener informacin sobre el contexto y
para obtener un cdigo de autorizacin.
4. En este paso se genera la respuesta con dicha informacin junto cdigo de autorizacin. Esta informacin es secreta entre nuestro SharePoint y el ACS.
5. Si la respuesta es positiva, el siguiente paso ser llamar al Event Receiver Remoto
que bsicamente ser un servicio WCF, el cual contendr la lgica del usuario.
6. ste es el ltimo paso, en el cual el Event Receiver Remoto ataca a un sistema de datos
externo realizando las modificaciones oportunas con el fin que fue programado.
A continuacin, la tabla con los eventos (en ingls) que podemos elegir en la creacin de
un Event Receiver Remoto (sern menos, por ejemplo, no estn los manejadores de eventos
para flujos de trabajo):
NOMBRE DEL EVENTO
Sincrona
Eventos Web
A siting deleted
A site is being deleted
A site is being moved
A site is being provisioned
A site collection was deleted
No
A site was deleted
No
A site was moved
No
206
A site was provisioned
No
Eventos en listas
A field was added
No
A field is being added
A field was removed
No
A field is being removed
A field was updated
No
A field is being updated
A list is being added
A list is being deleted
A list was added
No
A list was deleted
No
Eventos en elementos de la lista

A file was moved
No
A file was converted
No
An attachment is being added to the item
An attachment is being removed from the item
A file is being moved
No
An item was added
No
An item was updated
No
An item was deleted
No
An item was checked in
No
An item was checked out
No
An item was unchecked out
No
An attachment was added to the item
No
207
An attachment was removed from the item
No
A file was moved
No
A file was converted
No
Para cerrar este apartado, respecto a casos de usos, podramos decir que utilizaramos
Events Receivers Remotos si quieres controlar desde tu app quien aade cierto elemento en
cierta lista. Otro ejemplo de uso sera querer prever que los usuarios no eliminen un elemento
de la lista desde tu app.
App Event Receivers

Este tipo de eventos son un tanto ms peculiares. Estn dedicados a capturar los eventos
que se producen en la propia app de SharePoint, es decir, cuando es instalada, actualizada o
borrada. Como puedes apreciar, pueden llegar a ser muy tiles para automatizar procesos referidos al despliegue de las apps. Un caso de uso de este tipo de evento, sera por ejemplo que
queremos registrar en el fichero de log al usuario que ha desinstalado nuestra app o mandar
email cuando un usuario instale nuestra app; con este tipo de evento lo podramos llevar a
cabo. Otro ejemplo podra ser que necesitemos de crear cierta estructura de listas dentro de
un sitio de propio SharePoint donde estamos instalando la app.
A la hora de crear una app, explorando en las propiedades de ventana de la app, nos aparecen 3 tipos de eventos, los cuales podemos instanciar a True o False. Estas propiedades son
a nivel de proyecto de Visual Studio, en concreto para un proyecto de una app para SharePoint,
los eventos que podemos apreciar son los siguientes:
Figura 5-16. Eventos en la propia

App
-- Handle App Installed - Evento que se lanzar al instalar la app.

-- Handle App Unistalling - Evento que se lanzar al desinstalar la app.
-- Handle App Upgraded - Evento que se lanzar al actualizar la app.
208
Al instanciar el valor de uno de los tres eventos a True, tambin se aade una nueva
entrada en el apartado Properties del archivo AppManifest.xml. Esta entrada es la encargada de relacionar el App Event receiver con el servicio WCF. Para terminar, vamos a ver el
cdigo que contiene el AppManifest.xml con los 3 tipos de eventos que vimos en el punto
anterior instanciados a True. Estos eventos se lanzarn al instalar, actualizar o borrar una app.
<?xml version=1.0 encoding=utf-8 ?>

<App xmlns=http://schemas.microsoft.com/sharepoint/2012/app/manifest
Name=SharePointApp3
ProductID={d2ddcb2e-9be2-40c5-a744-eaa95d3d88e4}
Version=1.0.0.0
SharePointMinVersion=15.0.0.0>
<Properties>
<Title>SharePointApp3</Title>
<StartPage>~remoteAppUrl/Pages/Default.aspx?{StandardTokens}</StartPage>
<InstalledEventEndpoint>~remoteAppUrl/AppEventReceiver.svc</InstalledEventEndpoint>
<UninstallingEventEndpoint>~remoteAppUrl/AppEventReceiver.svc</UninstallingEventEndpoint>
<UpgradedEventEndpoint>~remoteAppUrl/AppEventReceiver.svc</UpgradedEventEndpoint>
</Properties>
<AppPrincipal>
<RemoteWebApplication ClientId=* />
</AppPrincipal>
</App>
Conclusiones
En este captulo hemos visto qu novedades trae consigo la nueva versin de SharePoint
en cuanto a eventos. Principalmente, esta novedad viene determinada por los dos nuevos tipos
de eventos que nos vamos a encontrar en cuanto a apps, los Events Receivers Remotos y los
App Events Receivers. Con estos nuevos tipos de eventos, no solo podremos ya manejar eventos que se produzcan en listas externas, sino que tambin podremos tener controlados eventos
que se produzcan en las propias apps.
209
Novedades de flujos de trabajo para SharePoint 2013

Como habrs ledo hasta este punto SharePoint 2013 viene cargado de novedades y cambios de filosofa en muchos aspectos. En lo que respecta a flujos de trabajo, tambin se han
hecho cambios significativos y en este punto no se libra nadie; desde el usuario de negocio
que disea procesos sencillos, pasando por el desarrollador que crea aplicaciones o flujos de
trabajo complejos, hasta el responsable de IT encargado de instalar, configurar y mantener la
granja de SharePoint.
Estos cambios y novedades tambin estn orientados a igualar el modelo de ejecucin
de flujos de trabajo entre SharePoint 2013 y SharePoint Online facilitando as la migracin o
reutilizacin de un flujo de trabajo entre los dos entornos.
Para el diseador
Entendiendo como diseador a aquellos usuarios de negocio o analistas de procesos que
participan en el proceso de creacin de flujos de trabajo, ste tendr a su disposicin un
entorno intuitivo con el que crear flujos de trabajo ms potentes, de forma ms sencilla y
empleando menos tiempo.
Para conseguir esta optimizacin, el diseador tendr a su disposicin nuevos eventos,
acciones y estructuras clsicas de programacin. Tambin podr configurar llamadas a servicios
de forma grfica, algo para lo que hasta el momento era necesario acudir a programacin.
En cuanto a las herramientas a utilizar por el diseador no habr cambios; estas sern
Visio 2013 para modelado de procesos y SharePoint Designer para configuracin del flujo de
trabajo.
Para el desarrollador
La novedad ms importante es que el desarrollador ya no escribir cdigo para programar
sus flujos de trabajo ya que estos pasan a ser puramente declarativos. Dentro de Visual Studio
2012, el desarrollador dispone de la herramienta, Workflow Designer, con la que crea el flujo
de trabajo grficamente. Internamente el flujo de trabajo es cdigo XAML que se interpreta en
tiempo de ejecucin.
Adems, el nuevo motor de ejecucin de flujos de trabajo permite controlar el ciclo de
ejecucin de estos desde cualquier sistema externo, con el objetivo de que el desarrollador
pueda integrarlos como parte de la capa de negocio de sus aplicaciones, ya sean aplicaciones
de SharePoint o cualquier otro tipo de aplicacin.
210
Para el responsable de IT
La novedad ms importante para el responsable de IT es que el motor de ejecucin de
flujos de trabajo de SharePoint 2013 es un componente externo a la plataforma y su instalacin
y configuracin tiene que hacerse por separado. El administrador podr crear una granja de
servidores dedicados a este propsito y asociarlos con su granja de SharePoint obteniendo as
una arquitectura robusta y escalable.
Arquitectura
Workflow Manager Client 1.0 es el nombre del nuevo motor de ejecucin de flujos de trabajo en SharePoint 2013. Usa como framework la versin 4 de Windows Workflow Foundation
y como API de mensajera Windows Communication Foundation.
Windows Workflow Foundation 4 define un flujo de trabajo como un conjunto de actividades, representando cada una de ellas un componente funcional del proceso. SharePoint
2013 introduce una capa superior sobre este modelo que permite crear flujos de trabajo no
secuenciales similares a flujos de estado de mquina (este modelo se define como state-gate
model).
No debemos de confundir Actividad con Accin. Una Actividad representa un objeto administrado (una clase); es lo que ve y maneja el motor de ejecucin. Una Accin es un contenedor
que encapsula una actividad; es lo que se muestra al usuario en las herramientas de diseo de
flujos de trabajo.
211
Figura 5-17. Nueva arquitctura de los flujos de trabajo para SharePoint 2013
Workflow Manager Client 1.0

Se encarga de administrar las definiciones de flujos de trabajo y tambin aloja los procesos
de ejecucin de cada instancia de los mismos.
Workflow Manager Service Application Proxy

Workflow Manager Client 1.0 est representado dentro de SharePoint como Workflow
Manager Service Application Proxy, componente con el que se comunica autenticndose
mediante OAuth.
Windows Azure Service Bus

Es el encargado de escuchar los eventos generados desde SharePoint para trasladrselos
al motor de ejecucin. Por ejemplo, cuando se crea un nuevo elemento en una lista que tiene
asociada un flujo de trabajo para este evento, Azure Service Bus recoge el evento itemCreated
y lo notifica a Workflow Manager Client 1.0 para que inicie una instancia nueva de ese flujo de
trabajo.
212
Workflow Service Manager

Es la parte del modelo de objetos de SharePoint que proporciona funcionalidad para administrar flujos de trabajo y controlar su ejecucin. Esta funcionalidad incluye el despliegue de los
mismos, funciones de mensajera, control de instancias activas y gestin de flujos de trabajo de
SharePoint 2010.
Cuando comentbamos anteriormente que los desarrolladores podrn trasladar funcionalidad de capa de negocio de sus aplicaciones al motor de ejecucin de flujos de trabajo nos
referamos al uso de este componente.
SharePoint 2013
SharePoint 2013 se encarga de proporcionar la parte del framework que no tiene Windows
Workflow Foundation 4 para trabajar con objetos de SharePoint, es decir, contenido (listas,
usuarios, tareas, etc.) y eventos.
SharePoint 2010 Workflow Host

Se trata de un componente de interoperabilidad que permite ejecutar flujos de trabajo
de SharePoint 2010 y llamar a actividades o usar caractersticas todava no implementadas en
SharePoint 2013.
Si en tu organizacin actualmente se encuentran en produccin desarrollos a medida que
incluyen actividades personalizadas no ser un problema migrar a SharePoint 2013 gracias a
este componente.
Instalacin y configuracin del entorno

A da de hoy, SharePoint 2013 cuenta con 3 tipos de plataforma de flujos de trabajo:
-- SharePoint 2010
-- SharePoint 2013 (requiere Workflow Manager)
-- Project Server 2013 (requiere Project Server 2013)
Una vez realizada la instalacin inicial de SharePoint 2013, solamente se encontrar disponible SharePoint 2010 como plataforma de destino. Como hemos dicho anteriormente, el
213
motor de ejecucin de flujos de trabajo en SharePoint 2013 es un componente externo y es

necesario instalarlo por separado.
Es importante tener que cuenta que Workflow Manager no est disponible en SharePoint
Foundation 2013.
Podemos planear la instalacin de nuestra granja de Workflow Manager con tipologas
diversas, pero creemos que no es objetivo de este libro abarcar este asunto. En esta direccin
puedes consultar toda la informacin al respecto: http://technet.microsoft.com/en-us/library/
jj658586(v=office.15).aspx.
Lo que vamos a ver es cmo realizar una configuracin bsica de Workflow Manager para
un entorno de desarrollo. En este caso, se trata de un servidor Windows Server 2012 que es
controlador de dominio en el que se encuentra instalado SQL Server 2012 y SharePoint 2013.
Planificacin
A continuacin, veremos cules son algunos de los requisitos necesarios para el tipo de
instalacin que nos ocupa. Para ampliar la informacin al respecto vlida para el resto de implementaciones puede ir a la siguiente direccin: http://technet.microsoft.com/en-us/library/
jj193466
Los pre-requisitos se instalan automticamente desde Web Platform Installer, pero hay
varias configuraciones que tendremos que realizar antes de ejecutar el asistente de configuracin de Workflow Manager:
SQL Server: habilitar conexiones TCP/IP y canalizaciones con nombre
Firewall de Windows: habilitado
Puertos 4446 y 5112: habilitados
Adems, dado que este servidor es tambin controlador de dominio, el usuario que va a
configurar Workflow Manager debe ser administrador de dominio y tener permisos de sysAdmin en SQL Server.
214
Instalacin
La instalacin se realizar mediante el asistente de instalacin de plataformas web Microsoft
Web Platform Installer. Si no se encuentra instalado en el servidor se puede descargar desde la
siguiente direccin: http://www.microsoft.com/web/downloads/platform.aspx
1. Abrir el navegador con la siguiente direccin:
http://go.microsoft.com/fwlink/?LinkID=252092
2. Abrir el archivo.
Figura 5-18. Descarga del Workflow Manager
3. Web Platform Installer se iniciar mostrndonos los datos del componente que se
va a instalar.
Figura 5-19. Descargando el Workflow 1.0 Beta desde Web Platform

Installer
215
4. En este momento se inicia la instalacin de los pre-requisitos y de Workflow Manager

Client 1.0.
Figura 5-20. Instalando pre-requisitos de Workflow Manager

Client 1.0
Configuracin
Una vez instalado, y si no hubo ninguna incidencia, procederemos a iniciar el asistente de
configuracin de Workflow Manager. Esta configuracin consta de dos pasos, primero configuraremos la granja de Workflow Manager con el asistente de configuracin y despus asociaremos esta granja a nuestro servidor de SharePoint.
Configurar Workflow Manager

1. Iniciar el asistente de configuracin.
2. Crear una nueva granja: seleccionar Create a New Farm Using Default Settings
216
Figura 5-21. Creacin de granja de Workflow para SharePoint 2013
3. Introducir los datos solicitados y pulsar Siguiente.

SQL Server Instance: nombre del servidor SQL (probar la conexin).
USER ID: nombre del usuario que ejecutar el proceso. Es muy importante poner
el nombre fqnd completo si no, el proceso fallar (ejemplo: administrator@dominio.com).
PASSWORD: contrasea del usuario.
Allow workflow management over http: al tratarse de un entorno de desarrollo
marcamos esta opcin para no tener problemas con certificados.
CERTIFICATE GENERATION KEY: escribir una clave cualquiera para que se genere
el certificado.
4. En la pgina siguiente del asistente vemos los valores de configuracin seleccionados. Tambin tenemos la opcin de obtener el cdigo PowerShell para realizar esa configuracin, lo que puede ser muy til para entornos de produccin. Verificamos para continuar.
5. Esperamos a que se completen todos los procesos y si todo ha ido bien pasamos al
paso siguiente.
217
Configurar SharePoint 2013

Ya tenemos configurada nuestra granja de Workflow Manager a la que hemos aadido un
servidor. Ahora solamente nos queda configurar nuestra granja de SharePoint 2013 para establecer la comunicacin entre ambas. Para ello, simplemente tenemos que ejecutar el siguiente
comando de PowerShell:
Register-SPWorkflowService SPSite http://SPSiteURL WorkflowHostUri
http://ServerName:XXX -AllowOAuthHttp
Interfaces de programacin
SharePoint 2013 incluye una interfaz de programacin para que el desarrollador pueda
aprovechar toda la potencia del nuevo motor de ejecucin de flujos de trabajo. Este nuevo
modelo de objetos permite automatizar el despliegue de flujos de trabajo y administrar instancias de los mismos. Dependiendo del tipo de alojamiento de nuestra SharePoint App accederemos a la API de la forma ms adecuada:
Modelo de objetos de servidor.
Modelo de objetos de cliente (CSOM).
Modelo de objetos de JavaScript (JSOM).
REST API.
En la siguiente direccin, puedes descargar un ejemplo completo de cmo interactuar con
la plataforma de flujos de trabajo desde una SharePoint App: http://code.msdn.microsoft.com/
SharePoint-2013-workflow-050f5211
218
Autores
Jos Quinto Zamora
Jos es SharePoint and Search Specialist en SolidQ. Complet
sus estudios de Ingeniera Informtica Superior por la Universidad de
Alicante en 2008. Fue galardonado con el premio especial al mejor
expediente de su promocin (20032008). Actualmente combina su
trabajo en SolidQ con la realizacin de su tesis doctoral en el campo
de Bsqueda Empresarial y Contextual tambin en la Universidad
de Alicante en el departamento DLSI. Tiene ms de 4 aos de experiencia en SharePoint. Concretamente, ha trabajado con SharePoint
desde su versin 2007, pasando por la versin de 2010 y actualmente
est trabajando ya con la versin 2013, especializado en las reas:
gestin, instalacin, configuracin, branding, inteligencia de negocios,
bsqueda empresarial, localizacin, internacionalizacin y desarrollo.
Adems, ha impartido varias sesiones tcnicas para Microsoft Ibrica
y en los eventos SQLU Summit 2009, 2010, 2011 y 2012, CEUS 2012,
SQLServer12. Tiene publicaciones en dNM+ (antes dotNetMana),
CodePlex y CompartiMOSS. Adems, Jos es escritor habitual en los
blogs de SolidQ de SharePoint y PowerPivot. Tambin es MCP, MCTS,
MCITP y MCPD en SharePoint 2010. Es bastante activo en las redes
sociales, compartiendo conocimiento de SharePoint, principalmente.
Sigue a Jos en Twitter: @jquintozamora
Cristian Zaragoza
Cristian cuenta con ms de dos aos de experiencia de trabajo
con SharePoint. Desde que comenz a trabajar en el departamento
de colaboracin y bsqueda de SolidQ, ha estado presente en distintos proyectos de desarrollo para distintas empresas, siempre con
SharePoint como denominador comn. Es colaborador activo en el
blog del equipo de SharePoint de SolidQ, as como ponente habitual
en las jornadas anuales de ponencias de SolidQ en Madrid, SolidQ
Summit Madrid. Por otro lado, Cristian cuenta con un Mster concluido con xito en Desarrollo de Aplicaciones y Servicios Web en
la Universidad de Alicante, as como diversas certificaciones oficiales
de Microsoft. En la actualidad, Cristian sigue trabajando en distintos
proyectos con SharePoint, habindose especializado en la maquetacin, diseo y aplicacin de estilos corporativos (Branding).
Sigue a Cristian en Twitter: @cmzaragoza
219
Guillermo Bas
Guillermo tiene ms de cuatro aos de experiencia con SharePoint,
comenz trabajando con la versin 2007 en varias empresas y actualmente trabaja con las versiones 2010 y 2013 en SolidQ. Adems
posee los ttulos MCTS en desarrollo para WSS 3.0, Administracin de
SharePoint 2010 y MCPD SharePoint Developer 2010. Actualmente
trabaja activamente con SharePoint Server 2010, 2013 y Office 365
adems de ser colaborador habitual en los foros de desarrollo de
SharePoint en MSDN (en ingls) y en el blog del SharePoint Team de
SolidQ.
Sigue a Guillermo en Twitter: @guillebas
Roberto Ramn
Roberto trabaja en SolidQ como SharePoint Developer. Titulado
en Ingeniera Tcnica en Informtica de Sistemas por la Universidad
de Alicante. Al acabar sus estudios compagin el mster de
Desarrollo de Aplicaciones y Servicios Web con una beca de trabajo
en la Universidad de Alicante. Miembro del equipo de SharePoint de
SolidQ, trabajando en proyectos tanto en la versin online como en
la versin on premise. A su vez, colabora en el blog del equipo de
SharePoint de SolidQ. Fue ponente en SolidQ Summit Madrid 2012.
Sigue a Roberto en Twitter: @Rober_Ramon
Ivn Paredes
Ivn cuenta con un bagaje de 10 aos por varios sectores realizando principalmente proyectos de desarrollo de software a medida
sobre tecnologa Microsoft. Actualmente trabaja como desarrollador
en el departamento de colaboracin de SolidQ. Colabora activamente
con la comunidad de Office 365, servicio sobre el que ha desarrollado diversos proyectos de instalacin y configuracin. Tambin es
colaborador habitual en el blog de SharePoint de SolidQ.
Sigue a Ivn en Twitter: @ivanparedes_
220
SolidQ es el proveedor global confiable de servicios de formacin y soluciones avanzadas

para las aplicaciones de misin crtica, inteligencia de negocio, alta disponibilidad, colaboracin, bsqueda y soluciones de tecnologa avanzada para plataformas de nube.
SolidQ combina una amplia experiencia tcnica y de implementacin en el mundo real,
con un compromiso firme en la transferencia de conocimiento, dada la combinacin nica
de dotes lectivas y experiencia profesional que nuestros mentores ofrecen. De este modo,
no solamente ayudamos a nuestros clientes a solventar sus necesidades tecnolgicas, sino
que somos capaces de incrementar la capacidad tcnica de sus profesionales, dndoles una
ventaja competitiva en el mercado. Por eso llamamos Mentores a nuestros expertos: por su
compromiso en asegurar el xito de su empresa y de sus equipos profesionales a largo pla-zo.
Nuestros expertos son profesionales reconocidos en el mercado, con ms de 100 premios
MVP (Most Valuable Professional) obtenidos hasta la fecha. Se trata de autores y ponentes en
las conferencias ms importantes del sector, con varios centenares de ponencias presenta-das
en conferencias internacionales durante los ltimos aos. Sirva como ejemplo que nuestros
expertos han tenido el honor de impartir cursos de formacin a empleados de Microsoft en
todo el mundo. Adems, han participado en ms de 20 libros de Microsoft Press en todas las
reas de las plataformas de acceso a datos de Microsoft. Vase un listado completo aqu
Nuestra misin es la de transmitir todo el conocimiento adquirido resolviendo problemas
del mundo real para miles de clientes, escribiendo artculos y libros, publicando whitepapers,
creando contenidos educativos y formando a decenas de miles de trabajadores de TI en todo
el mundo, para que los proyectos de nuestros clientes obtengan los mayores xitos. Esta transferencia de conocimiento la realizamos fundamentalmente con dos tipos de servicios:
-- Formacin. Ofreciendo cursos privados presenciales y online, sesiones tcnicas, webcasts, y los recientes Masters en SharePoint, en Inteligencia de Negocio y en Relacional.
-- Mentoring y consultoras. Servicios de consultora de alto valor y corta duracin.
-- SolidQ Journal y Blogs. Ofreciendo a travs de nuestra web una revista digital totalmente gratuita llamada The SolidQ Journal, as como ms de 1000 post en nuestros blogs.
En SolidQ, todos los expertos tienen en mente este lema: comparte lo que sepas, aprende
lo que no conozcas.
Da un giro a tu carrera profesional.
Mster en BI
SolidQ
http://www.solidq.com/es/MasterBI
Mster SQL Server DBA

http://www.solidq.com/es/MasterSQLServerDBA
POR
MASTERS CERTIFICADOS
Es tiempo de oportunidades.
Mster en SharePoint
http://www.solidq.com/es/MasterSharePoint
Infrmate Ya!
Convirtete en un profesional altamente
especializado
en tecnologas Microsoft.
Para ms informacin llama al 800.300.800 o +34 91 414 8950 o bien manda un e-mail a: ventasib@solidq.com

SharePoint 2013 Apps Nuevo Modelo Desarrollo

Uploaded by

Document Information

Copyright

Available Formats

Share this document

Share or Embed Document

Sharing Options

Did you find this document useful?

Is this content inappropriate?

Copyright:

Available Formats

SharePoint 2013 Apps Nuevo Modelo Desarrollo

Uploaded by

Copyright:

Available Formats

SharePoint 2013 Apps:

el nuevo modelo de desarrollo

El editor prohbe cualquier tipo de fijacin, reproduccin, transformacin o distribucin de esta

SolidQTM Press, 2012

SharePoint 2013 Apps: el nuevo modelo de desarrollo

Apartado de correos 202

Captulo 2. Introduccin a las SharePoint

Pgina completa (Immersive Full Page)

Captulo 3. Desarrollo de SharePoint

Captulo 4. Instalacin y administracin

Captulo 5. Novedades influenciadas

Novedades de flujos de trabajo para SharePoint 2013

Organizacin del libro

Captulo 1. Novedades en SharePoint 2013 Preview

Paralelamente al equipo de SharePoint exista el equipo de Microsoft Content

Captulo 1. Novedades en SharePoint 2013 Preview

Captulo 1. Novedades en SharePoint 2013 Preview

SharePoint 2013 Preview. Adems, el da 24 de Octubre de 2012 sali la versin RTM en el

Captulo 1. Novedades en SharePoint 2013 Preview

Cloud App Model

Figura 1-1. Opciones de desarrollo en SharePoint 2013

Figura 1-2. Plantillas de desarrollo para SharePoint 2013

Captulo 1. Novedades en SharePoint 2013 Preview

Captulo 1. Novedades en SharePoint 2013 Preview

Captulo 1. Novedades en SharePoint 2013 Preview

Figura 1-4. Men de formas (shapes)

Captulo 1. Novedades en SharePoint 2013 Preview

SharePoint Designer 2013

Figura 1-5. Logo de

Captulo 1. Novedades en SharePoint 2013 Preview

Nota. Si no ves la opcin de SharePoint 2013 Workflow al crear un nuevo

3. Integracin con Etapas (mquinas de estados)

Captulo 1. Novedades en SharePoint 2013 Preview

4. Visual Designer (Integrado en SPD 2013)

5. Invocar HTTP (REST) Web Services

Captulo 1. Novedades en SharePoint 2013 Preview

6. Soporte a copiar y pegar

Captulo 1. Novedades en SharePoint 2013 Preview

Visual Studio 2012

Figura 1-8. Diseador de listas y tipos de contenido en SharePoint 2013.

2. Crear columnas de sitio

Captulo 1. Novedades en SharePoint 2013 Preview

4. Publicar soluciones SharePoint en servidores remotos

Captulo 1. Novedades en SharePoint 2013 Preview

Captulo 1. Novedades en SharePoint 2013 Preview

Figura 1-10, Proyecto NAPA. Entorno de desarrollo en la Nube.

Captulo 1. Novedades en SharePoint 2013 Preview

Mayor uso de los estndares web

Figura 1-11. Posibilidades de desarrollo de aplicaciones cliente en SharePoint 2013.

Ahora no entraremos ms en detalle en las tecnologas mencionadas, pues al tratarse de

Captulo 1. Novedades en SharePoint 2013 Preview

Captulo 1. Novedades en SharePoint 2013 Preview

Representacin del lado del cliente (Client-side rendering)

Figura 1-12. Caracterstica de Client-side rendering.

Captulo 1. Novedades en SharePoint 2013 Preview

Novedades en las API

Integracin de mapas y geolocalizacin

Figura 1-13. Caracterstica de Mapas en SharePoint 2013. Imagen obtenida de M;SDN.

Concretamente en un campo de tipo Geolocation podemos introducir coordenadas como

Captulo 1. Novedades en SharePoint 2013 Preview

2. Representacin grfica de mapas:

Captulo 1. Novedades en SharePoint 2013 Preview

Captulo 1. Novedades en SharePoint 2013 Preview

Figura 1-14. Community Site en SharePoint.

Pgina completa (Immersive Full Page)