Deep Dive on building apps like a SharePoint ECM dev Pablo BarvoSenior Developer – SharePoint ECMMicrosoft

SPC067

ObjectivesDive into the app model from ECM perspectiveDocument management scenarioLook at common full trust functionality from the app model perspectiveExplore the new opportunities available on the cloud (also available on-prem)

What you’ll learnRemote event receiversClient Web PartsIn the context of custom apps for the App Catalog

What we’ll coverExtend a Document Management scenarioExisting in-use solution and functionality extended by an app

Building a Provider Hosted appControl on where/how the app is deployed, including inside the corporate firewallUse remote event receivers, client web parts, CSOM (taxonomy, user profile, etc)

For the App CatalogLearn about some app model features and extensions more targeted towards App Catalog apps

Using cloud services & VS 2012SharePoint Online + Azure + Team Foundation Service (on the cloud)All of these are possible on-prem

A recap on the app modelApps can contain SP elements (content types, lists, etc)These elements are deployed into a separate App Web

An app can request permissions to interact with the host web, or host site collection, using the Client Object Model/REST

Host web

App web

ScenarioContoso Electronics development teamIn charge of developing new functionality into their website

SharePoint Online for document managementExisting solution for handling specs, documents, designs and collaterals for new features

TFS for dev code/work/task managementTacking the dev work and task progress. Using Team Foundation Service on the cloud.

SP TFS

Before we start…

Scenario

ScenarioOur app will do 2 things:1. ItemAdded event receiver to populate fields2. Client web part to display data from TFS

Will be hosted in AzureNote however that provider hosted apps can be hosted anywhere

All of this, directly in the existing host web list

Azure

SP TFS

Part #1

Remote Event ReceiversWeb service basedA remote end point that SharePoint will invoke when the event happens

Available in Autohosted or Provider Hosted appsReceives an OAuth context token to talk back to SPSupported everywhere regular event receivers areBoth sync and async

App Serv

er

SP

Remote Event Receivers flow - OAuth1. Something happens in SharePoint

App Serv

er

SP

ACS

2

3

4

512. SharePoint calls ACS to get a context token for the current user (signed)

3. SharePoint invokes the remote event receiver with the context token

4. The remote server calls ACS with the context token and obtains an access token (signed)

5. The remote server can now use the access token to call SharePoint back and perform operations against it

What we’ll do next (1/2)1. When an item is added to the Spec

Library

2. Receive the async event in Azure

3. Populate the “Feature Owner” field with the current user

4. Get the user profile properties of the user

5. Find or create the Term for the area, and set the “Feature Area” field

6. Create a TFS Back Log item for the element

7. Populate the “TFS Work Item Id” field with it

8. Save the values out

Azure

SP TFS

What we’ll do next (2/2)Cannot use the WSP elements.xml to deploy itWe’ll use the App installed and uninstalled events to add the receiver in the host web

1. When the app is installed

2. Get the Spec Library and register the remote event receiver for “Item Added”

Azure

SP

TFS

1. When the app is uninstalled

2. Get the Spec Library and remove the remote event receiver

Demo

App + Remote Event Receivers

Remote Event Receivers recapWeb service based, support for sync and async

New app events (installed/uninstalled)Sync only -- Install/Uninstall will fail if these fail

public class DocSetEventReceiver : IRemoteEventService{ public SPRemoteEventResult ProcessEvent(SPRemoteEventProperties properties) { //sync }

public void ProcessOneWayEvent(SPRemoteEventProperties properties) { //async }}

Remote Event Receivers recapCan be deployed to the host web via CSOM

No F5 debugging when working against the cloudF5 debug is supported with SharePoint server running locally

//Add the remote event receiverlist.EventReceivers.Add(new EventReceiverDefinitionCreationInformation(); { EventType = EventReceiverType.ItemAdded, ReceiverName = "AppWorkItemEventReceiver", ReceiverUrl = "https://devcontoso.azurewebsites.net/DocSetEventReceiver.svc", SequenceNumber = 10 });

Part #2

Client Web Parts<iframe> to a remote pageCan be a page hosted in the app web, or in the remote app server

Includes a context token to call SP back

Includes a set of standard tokens:

• SPHostUrl: Host web url

• SPLanguage: Current language

• SPAppWebUrl: App web url

Exposed in the host web

App Serv

er

SP

For our scenarioWe need the Item ID from the document setThis information is not included in the tokens OOB

We cannot use client web part propertiesWhy? These property values are set per page.

The parent page knows them: postMessage approachAsk for the details of the item from the client web part page to the parent pageRequires JS in the parent page, next to the client web part (ok for the App Catalog scenario)

Page

iframe

postMessage('getItemDetails‘…)

postMessage(‘{ listId: …, docSetId: … }‘…)

What we’ll do next (1/2)1. The page renders with the client web part

on it

2. The <iframe> is redirected to the client web part page, with a context token

3. The page renders back and the JS code to get the items details from the parent page is executed

4. The item details and context token are then used to call a WebAPI service

5. The WebAPI service calls SharePoint to get the value of the TFS Work Item Id field for the item

6. TFS is queried for the details and returned as JSON

7. A client side template is used to render the UI

Azure

SP

TFS

Page

iframe

1

23

4

5

6

What we’ll do next (2/2)1. When the app is installed

2. Get the Document Set home page in the Spec Library and add:

1. Client Web Part

2. Script Editor Web Part, with the JS to handle the postMessage request

Azure

SP

TFS

1. When the app is uninstalled

2. Get the Document Set home page in the Spec Library and remove the web parts

Demo

Client Web Part & Deployment

Client Web Part recapExposed in the host web<iframe> to a remote page (url)+ tokensCan be inserted using CSOM

Can inherit host site stylespostMessage approach to obtain info from the pageMainly for App Catalog apps

//Get the webpart manager for the page and insert the web partFile homepage = ctx.Web.GetFileByServerRelativeUrl(pageUrl);LimitedWebPartManager manager = homepage.GetLimitedWebPartManager(PersonalizationScope.Shared); WebPartDefinition scriptEditorDef = manager.ImportWebPart(ClientWebPartXml);ctx.Load(scriptEditorDef.WebPart);manager.AddWebPart(scriptEditorDef.WebPart, "WebPartZone_Top", 1);

Deployment recapappregnew.aspx for Client ID and Client SecretThese will be valid for this tenant onlyYou can use a Microsoft Seller ID to register an app for all tenantsThere are also PowerShell commands available

App server needs to know these valuesWeb.config setting for .NET solutionsThese values are used when talking to ACS (TokenHelper)

App Catalog deploymentAdd you .app file into the app catalog to make the app available to the tenant sites

There is more

Closing…App model opens new opportunitiesCustomize SharePoint with custom appsA lot of new scenarios now possible both in the cloud and on premMuch expanded Client Side Object ModelComplete scenarios with SharePoint and Office appsCreate apps for sale in the marketplace

Leverage cross-platform standardsRun your app in any technology backend, deploy anywhereLeverage web standards

Opportunities for Corporate appsHigher integration with the host web content

Other talks of interestSPC018: Best Practices for ECM in the Cloud, and how large organizations can get the most out of Office 365SPC262: What's New with Enterprise Content Management in SharePoint 2013SPC068: Deep Dive on Integrating SharePoint Metadata with other Metadata Stores

SPC241: Understanding authentication for apps for SharePointSPC002: 10 Tips for building Great Apps SPC032: Building out a great app UI SPC010: An overview of developing SharePoint-hosted apps

SPC212: SharePoint 2013 Workflow Development for Apps and Solutions for SharePoint 2013 with VS 2012SPC213: SharePoint 2013 Workflow: Architecture and Configuration

Thank you!

Q&A

Evaluate this session now on MySPC using your laptop or mobile device: http://myspc.sharepointconference.com

MySPC

© 2012 Microsoft Corporation. All rights reserved. Microsoft, Windows, Windows Vista and other product names are or may be registered trademarks and/or trademarks in the U.S. and/or other countries.The information herein is for informational purposes only and represents the current view of Microsoft Corporation as of the date of this presentation. Because Microsoft must respond to changing market conditions, it should not be interpreted to be a commitment on the part of Microsoft, and Microsoft cannot guarantee the accuracy of any information provided after the date of this presentation. MICROSOFT MAKES NO WARRANTIES, EXPRESS, IMPLIED OR STATUTORY, AS TO THE INFORMATION IN THIS PRESENTATION.