Logo
Windows XP
Windows Vista
Windows 7
Windows Azure
Windows Server
Windows Phone
PREGNANCY
 
 
Windows Server

Sharepoint 2013 : Integrating Apps for Office with SharePoint (part 2) - Apps for Office Integrated with an App for SharePoint

8/17/2014 4:38:16 AM

Apps for Office Integrated with an App for SharePoint

For standalone Apps for Office, SharePoint provides a nice platform for IT to govern these apps within the enterprise. However, integrating Apps for Office into an app for SharePoint solution also makes a lot of sense. In all of these cases, irrespective of the hosting platform, one or more Apps for Office can be included within the app for SharePoint. Also, as mentioned earlier, the caveat is that these Apps for Office are not discoverable via the Office client UI as with the Apps for Office that are registered in the SharePoint Apps for Office catalog. These Apps for Office are available and usable only by the users who have access to the SharePoint site where the app for SharePoint was added.

From the developer’s perspective, the Apps for Office artifacts are deployed in the app for SharePoint AppWeb infrastructure and the back-end Web application/services are deployed to their appropriate hosting environment. However, as integrated parts of the solution, the Apps for Office are available then to the user where the app for Office can interact directly with the APIs and services exposed by the back-end application. This coupling of one or more Apps for Office with an app for SharePoint opens an opportunity for developers to build a whole new class of point productivity solutions, delivered worldwide as a single unit through the Office Store, to anyone using SharePoint 2013 on-premises and/or Office 365 SharePoint Online. This all speaks to the potential market for the distribution of your app, but in terms of the breadth of opportunity for building composite app solutions, these can be point solutions that target small niche companies to solutions that meet specific needs within any of the broader vertical markets spanning both the private and public sectors. Wow, that’s developer opportunity!

Let’s examine how to couple an app for Office with an app for SharePoint. In the following example you work an Autohosted exercise.


TRY IT OUT: Integrating an App for Office with an App for SharePoint (CompositeOSPAutoHosted.zip)

An app for SharePoint can be either SharePoint-hosted, provider-hosted or autohosted. In all of these cases, you can incorporate one or more Apps for Office into the app for SharePoint to be delivered as part of a rich composite productivity solution. This exercise shows the basics for how to build such an app; follow these steps:

1. Run Visual Studio 2012 as Administrator. Select New Project.

2. In the New Project dialog, expand the Templates ⇒ Visual C# ⇒ Office/SharePoint ⇒ Apps nodes. Select App for SharePoint 2013 and provide the Name: CompositeOSPAutoHosted. Click OK.

3. In the Specify the App for SharePoint settings dialog, provide the URL to your Office 365 developer site and click the Validate button to confirm connectivity to the site.

4. For the question, “How do you want to host your app for SharePoint?” select Autohosted, and click Finish.

5. Open the Default.aspx file from the Pages folder and replace everything between the <body>...</body> elements with the following:
<form id="form1" runat="server">
<div>
<asp:ScriptManager ID="ScriptManager1" runat="server"
EnablePartialRendering="true" />
<asp:UpdatePanel ID="PopulateData" runat="server" UpdateMode="Conditional">
<ContentTemplate>

<table border="1" cellpadding="10">
<tr><th> App for Office in an app for SharePoint</th></tr>
<tr><td>
<h2>SharePoint Site Accessed</h2>
<asp:Label runat="server" ID="WebTitleLabel"/>
<h2>SharePoint AppWeb, right-click and Open in new tab</h2>
<asp:HyperLink ID="HyperLink1" runat="server">SPAppURL</asp:HyperLink>
<h2>Current logged-in User:</h2>
<asp:Label runat="server" ID="CurrentUserLabel" />
<h2>Users of the Site</h2>
<asp:ListView ID="UserList" runat="server">
<ItemTemplate ><asp:Label ID="UserItem" runat="server"
Text="<%# Container.DataItem.ToString() %>"></asp:Label><br />
</ItemTemplate>
</asp:ListView>
<h2>Lists available on the Host Web</h2>
<asp:ListView ID="ListList" runat="server">
<ItemTemplate ><asp:Label ID="ListItem" runat="server"
Text="<%# Container.DataItem.ToString() %>"></asp:Label><br />
</ItemTemplate>
</asp:ListView>
</td>

</tr>
</table>
</ContentTemplate>
</asp:UpdatePanel>
</div>
</form>
6. Right-click on the Default.aspx file from the Pages folder and choose View Code.

7. Add the following variables just before the Page_ Load method:
string siteName;
string currentUser;
List<string> listOfUsers = new List<string>();
List<string> listOfLists = new List<string>();
8. Inside the Page_ Load method replace all the code with the following:
// The following code gets the client context and site information 
// by using TokenHelper.

var contextToken = TokenHelper.GetContextTokenFromRequest(Page.Request);
var hostWeb = Page.Request["SPHostUrl"];
var spAppWeb = Page.Request["SPAppWebUrl"];

using (var clientContext =
TokenHelper.GetClientContextWithContextToken(hostWeb, contextToken,
Request.Url.Authority))
{
//Load the properties for the web object.
var web = clientContext.Web;
clientContext.Load(web);
clientContext.ExecuteQuery();

//Get the site name.
siteName = web.Title;

//Get the current user.
clientContext.Load(web.CurrentUser);
clientContext.ExecuteQuery();
currentUser = clientContext.Web.CurrentUser.LoginName;

//Load the lists from the Web object.
ListCollection lists = web.Lists;
clientContext.Load<ListCollection>(lists);
clientContext.ExecuteQuery();

//Load the current users from the Web object.
UserCollection users = web.SiteUsers;
clientContext.Load<UserCollection>(users);
clientContext.ExecuteQuery();

foreach (User siteUser in users)
{
listOfUsers.Add(siteUser.LoginName);
}

foreach (List list in lists)
{
listOfLists.Add(list.Title);
}

// Display on page
HyperLink1.Text = spAppWeb.ToString()
+ "/Lists/AppCompositeDocLibrary/";
HyperLink1.NavigateUrl = spAppWeb.ToString()
+ "/Lists/AppCompositeDocLibrary/";
WebTitleLabel.Text = siteName;
CurrentUserLabel.Text = currentUser;
UserList.DataSource = listOfUsers;
UserList.DataBind();
ListList.DataSource = listOfLists;
ListList.DataBind();

}
9. Right-click ListCollection and select Resolve using Microsoft.SharePoint.Client. This also fixes the syntax error for UserCollection.

10. To set the permissions being requested of SharePoint by the app, double-click the AppManifest.xml node in the Solution Explorer. In the manifest designer click the Permissions tab. Under Permission requests, click just under Scope to drop down the list, and then select Web. Select Read under Permission.

11. At this point you just have a standard Autohosted app, but press F5 to make sure everything debugs correctly.

12. Provide your credentials at the various prompts, and when prompted for whether or not for SharePoint to trust this app, click Trust It.

13. Close the browser to stop debugging.

14. To add a TaskPaneApp to the solution, right-click the CompositeOSPAutoHosted node in the Solution Explorer and select Add ⇒ New Item.

15. In the Add New Item dialog, select App for Office and provide the name AutoHostedTaskPaneApp.

16. In the Create App for Office dialog, select Excel only as the TaskPaneApp and click Finish.

Visual Studio has added all the components of the TaskPaneApp that you used earlier when building an app for Office, but has placed them appropriately in either the Web portion of the solution that will be deployed to the Web server or within the part of the app that will be deployed as SharePoint artifacts in your remote site. Notice the AutoHostedTaskPaneApp .html, .js, and .png files are all placed nicely in the web structure and the app for Office manifest .xml file is within the SharePoint structure for deployment. Visual Studio also added an OfficeDocuments folder to the SharePoint project that contains a base Excel document that has a TaskPaneApp associated with it.

17. To create a document library for the Excel file, right-click the CompositeOSPAutoHosted node and select Add ⇒ New Item.

18. Select List, name it AppCompositeDocLibrary, and click Add.

19. In the Choose List Settings dialog, click “Create a non-customizable list based on an existing list type of:” and in the drop-down list select Document Library. Click Finish.

20. When the list designer opens, click the ... button under Use this template as the default to browse for a template. In the dialog open the OfficeDocuments folder and select the Excel AutoHostedTaskPaneApp.xlsx file, click Open.

21. Click Content Types, and in the Content Type Settings click to highlight the entire Document row, then right-click and select Delete, and click OK.

22. Press F5, and respond appropriately to all the prompts as the app for SharePoint deploys. After your web page appears, right-click the link to the AppWeb document library and select Open in new tab. Navigate to the newly opened tab in your browser to see the document library.

23. In the AppCompositeDocLibrary, click the Files tab ⇒ New Document ⇒ AppCompositeDocLibraryContentType1.

24. Excel will open with its TaskPaneApp, but the AutoHostedTaskPaneApp.html web page is now being served up from the Pages directory on your remote server!

How It Works

A number of steps in creating an app for SharePoint contain one or more Apps for Office. Here you simply created an out-of-the-box Autohosted app for SharePoint. You then added a standard TaskPaneApp to the solution and its web components, CSS, image, JavaScript and HTML, were added to the web project and the manifest file was added to the SharePoint project by Visual Studio. These, too, are then deployed to the Autohosted website. You set permissions in the Autohosted app’s manifest file so it could be trusted to read the Host Web. Your app automatically has full permissions on the AppWeb, but if you want your app to do anything outside the scope of the AppWeb, then permission must be granted to the app when it is installed the first time.
Lastly, you ran the app and navigated from its landing page to the AppWeb document library and opened the Excel document deployed in your AppWeb that contained an app for Office. The app for Office, because it is hosted in your AppWeb context, can reach back into SharePoint and out to the Web to bring together any mixture of content needed for your business solution. This is an example of nesting an app for Office inside an autoprovisioned app for SharePoint. It can also be done coupled with a SharePoint-hosted or Provider-hosted app.

The number of ways to stitch these composite apps together to create innovative solutions for end users is possibly as broad as our collective creativity. Also, the joy in building productivity software is to somehow empower users to do something a bit better, easier, and faster than they could before they had the solution. Building rich integrated Apps for Office and SharePoint can be just such solutions in the hands of end users.

Other -----------------
- Sharepoint 2013 : The Office JavaScript Object Model (part 3) - App Security
- Sharepoint 2013 : The Office JavaScript Object Model (part 2) - Functional Capabilities by Office Client,Mailbox-based Apps
- Sharepoint 2013 : The Office JavaScript Object Model (part 1) - Document-based Apps
- SQL Server 2012 : Understanding Latches and Spinlocks (part 3) - Latching Example - With Latching
- SQL Server 2012 : Understanding Latches and Spinlocks (part 2) - Latching Example - Without Latching
- SQL Server 2012 : Understanding Latches and Spinlocks (part 1) - Latching Example
- SQL Server 2012 : Latches and Spinlocks - Symptoms (part 2) - Measuring Latch Contention, Measuring Spinlock Contention , Contention Indicators
- SQL Server 2012 : Latches and Spinlocks - Symptoms (part 1) - Recognizing Symptoms
- Integrating SharePoint 2013 with the Office Applications (part 10) - Microsoft Outlook - Lists and Libraries
- Integrating SharePoint 2013 with the Office Applications (part 9) - Microsoft InfoPath - Customizing the Document Information Panel and List Forms
- Integrating SharePoint 2013 with the Office Applications (part 8) - Microsoft InfoPath -Deploying a Form Via Central Administration, Rendering a Form Using the InfoPath Form Web Part
- Integrating SharePoint 2013 with the Office Applications (part 7) - Microsoft Access - Access Services
- Integrating SharePoint 2013 with the Office Applications (part 6) - Microsoft Access
- Integrating SharePoint 2013 with the Office Applications (part 5) - Microsoft OneNote
- Integrating SharePoint 2013 with the Office Applications (part 3) - Microsoft Excel
- Integrating SharePoint 2013 with the Office Applications (part 3) - Microsoft Excel
- Integrating SharePoint 2013 with the Office Applications (part 2) - Microsoft Word - Compare Document Versions, Quick Parts
- Integrating SharePoint 2013 with the Office Applications (part 1) - Microsoft Word - Writing Blog Posts
- BizTalk 2006 : Creating More Complex Pipeline Components (part 4) - Custom Disassemblers
- BizTalk 2006 : Creating More Complex Pipeline Components (part 3) - Validating and Storing Properties in the Designer
 
 
Most view of day
- Microsoft Excel 2010 : SUBTOTAL Function, Subtotal Tool
- Tracking Change in Vista : Turning on the audit policy, Exploring the Vista Event Log
- Windows Server 2012 : File Services and Storage - Configuring iSCSI storage (part 1) - Understanding iSCSI storage
- SQL Server 2008 R2 : Performance Monitoring Tools (part 10) - Creating an Extended Events Session
- Securing Your SharePoint and Windows Azure Solutions : Configuring BCS Security - Create an Application ID, Assess Permissions on the ECT
- Windows Server 2008 R2 : High Availability, Live Migration, and Snapshots
- Deploying Applications (part 1) - Preparing the Lab, Planning Deployment, Choosing a Deployment Strategy
- Windows Server 2008 : Configuring Server Core after Installation (part 3) - Logging Off, Shutting Down, and Rebooting
- Microsoft Lync Server 2010 : Planning for Voice Deployment - Devices, Response Groups
- Microsoft Exchange Server 2007 : Consolidating a Windows 2000 Domain to a Windows Server 2003 Domain Using ADMT (part 2) - Installing a Password Migration DLL on the Source Domain
Top 10
- Windows Server 2012 : Administering Active Directory using Windows PowerShell (part 3) - Performing an advanced Active Directory administration task
- Windows Server 2012 : Administering Active Directory using Windows PowerShell (part 2) - Finding Active Directory administration cmdlets
- Windows Server 2012 : Administering Active Directory using Windows PowerShell (part 1) - Managing user accounts with Windows PowerShell
- Windows Server 2012 : Enabling advanced features using ADAC (part 3) - Creating fine-grained password policies
- Windows Server 2012 : Enabling advanced features using ADAC (part 2) - Configuring fine-grained password policies
- Windows Server 2012 : Enabling advanced features using ADAC (part 1) - Enabling and using the Active Directory Recycle Bin
- Microsoft Excel 2010 : Protecting and Securing a Workbook - Marking a Workbook as Read-Only
- Microsoft Excel 2010 : Protecting and Securing a Workbook - Working with Office Safe Modes
- Microsoft Excel 2010 : Protecting and Securing a Workbook - Setting External Content Security Options
- Microsoft Excel 2010 : Protecting and Securing a Workbook - Setting Privacy Options - Set Parental Controls for Online Research
 
 
Windows XP
Windows Vista
Windows 7
Windows Azure
Windows Server
Windows Phone
2015 Camaro