Freigeben über


ASP.NET MVC based Apps for SharePoint 2013 (on-premises)

Recently I was asked the following question: "Can we use ASP.NET MVC 4 for an App for SharePoint?" My answer was "Yes, you can." This blog post will walk you through creating and deploying on-premises provider-hosted app for SharePoint. We will utilize the server-to-server (S2S) protocol to create a high-trust app. Typically apps that use the server-to-server protocol run behind a firewall.

Please read the following How to: Create high-trust apps for SharePoint 2013 using the server-to-server protocol (advanced topic). This how to will walk you through the steps of configuring your IIS and SharePoint 2013 servers for S2S High Trust. Once you have completed the steps listed in the article, come back here and follow the steps below.

[Note]: In the instructions that configures your machine for server-to-server protocol, you create a Guid to be used for the Issuer ID. Copy that value and keep it handy. You will need it in later on in the exercise. As a practice that I use, I copy the output from PowerShell after the command "New-SPTrustedSecurityTokenIssuer" so that I can reference it if I need to.

Prerequisites

  • Visual Studio 2012
  • Microsoft Office Developer Tools for Visual Studio 2012 – Preview 2
  • SharePoint 2013 Server

Create the SharePoint App

In Visual Studio 2012, choose File, New, Project.

In the New Project wizard, expand the Visual C# node, and then expand the Office/SharePoint node.

Choose Apps, and then choose to create an App for SharePoint 2013 project.

Name the project HighTrustSampleApp.

Save the project in a location you choose, and then choose OK.

Select the Provider-hosted hosting option, and then choose the Next button.

Under How do you want your app to authenticate? , choose Use a certificate.

Click the Browse button next to the Certificate location box and navigate to the location of the self-signed certificate (.pfx file) that you created. Type the password for this certificate in the Password box. Type the issuer ID in the Issuer ID box.

In the wizard, choose Finish. Much of the configuration is done when the solution opens. Two projects are created in the Visual Studio 2012 solution, one for the app for SharePoint and the other for the ASP.NET web application.

ASP.NET Forms project type is the default web project that is created when building an App for SharePoint 2013 using Provider-hosted option. This is not what we want. So, we need to create an ASP.NET MVC 4 project in the solution.

Right click on the solution in Solution Explorer.

Select New Project from the context menu.

In the Visual C# node, select the Web node.

Choose ASP.NET MVC 4 Web Application project type.

Name the project SPAppMvcWeb.

Save the project in a location you choose, typically in the same location as you previously saved the projects that were created in the above steps, and then choose OK.

Choose Basic in the Select a template section of the New ASP.NET MVC 4 Project dialog.

Click the OK button.

Once the project pulls down all the NuGet packages that the template needs, you should have three projects in your solution. Now we need to tell the SharePoint App to use the ASP.NET MVC project instead of the ASP.NET Web Application project.

Click the SharePoint App project in Solution Explorer.

Find the property Web Project in the Properties window. If the properties window is not open, use Ctrl+W,P to bring it up.

Click on the dropdown to select the different web application projects in the solution.

Select the MVC project that you just created.

Visual Studio will now prompt you, asking if you want Microsoft to help setup and configure the new Web Application to support the App for SharePoint. Click on the OK button in the dialog. Visual Studio will add all the necessary references to your project and include the TokenHelper.cs class. Also, the web.config file is modified to include entries for the Client ID and Client Secret. We will come back to this later. For now, just know that your web.config was modified for you.

     

So now we need to create some MVC artifacts so that we can use our application.

Right click on the Controllers folder in the MVC project and add a new controller.

Name the controller HomeController and for the Template, choose Empty MVC controller. Click the Add button.

Add the following code to the controller.

     

     

Within the Views folder, create a new sub folder called Home.

Right click on the folder and choose to Add, View.

Give the view a name of Index.

If the Use a layout of master page is not selected, select the option.

Add the following code to the view.

     

We need to set the start page of our application to this view. To do this you have to switch to the code view of AppManifest.xml in the SharePoint App in Solution Explorer.

Find the <StartPage> xml tag and replace the contents with ~remoteAppUrl/Home?{StandardTokens}.

Remember what I said earlier about the web.config modifications. Well it is time to talk about those. If you would have looked at the ASP.NET Web Forms project's web.config, you would have seen a few extra <appSettings> tags. The ClientId will be filled in by Visual Studio when you run the application for the first time. So you do not need to worry about that app setting. You will need the ClientSigningCertificatePath, ClientSigningCertificatePassword, and the IssuerId. Here is a screenshot of what I have on my machine. It will be slightly different on your machine.

Now we can deploy and verify our app starts as expected. To do so, just press F5. SharePoint will prompt you to trust the app.

Click the Trust it button. Congratulations! You have just created your first ASP.NET MVC 4.0 Web Application based SharePoint App. When everything works as expected, you can delete the ASP.NET Forms project from the solution. You will no longer need that project.

     

Add SharePoint Look and Feel to the App

We are now going to add the SharePoint Chrome to our MVC application.

Under Views, Shared – modify the _layouts.cshtml as follows:

 

When you are finished, press F5. Your app should look similar to this.

Comments

  • Anonymous
    March 11, 2013
    Thanks bspann,That's very cool - how about the cloud?Does this approach support Office 365 SharePoint Online?Cheers,Jim
  • Anonymous
    March 11, 2013
    Hi,Please i wish to know if i can replicate this tutorial using Sharepoint foundation 2013.
  • Anonymous
    May 08, 2013
    Hi All,I create a sample with SharePoint Provider Hosted and it runs ok with ASP web application. However, I gets "SharePoint 2013 - The parameter 'token' cannot be a null or empty string " error when replace by MVC project although I went step by step as this post.Can you help me?Thanks,
  • Anonymous
    May 08, 2013
    The comment has been removed
  • Anonymous
    May 17, 2013
    Great Help : thankx
  • Anonymous
    September 07, 2013
    Very good, thanks.
  • Anonymous
    September 07, 2013
    Very good. Thanks.
  • Anonymous
    October 17, 2013
    msdn.microsoft.com/.../fp179901.aspx
  • Anonymous
    October 24, 2013
    Is it possible to retrive lists from SharePoint 2013 in a asp.net mvc 4 app (which is deployed using provider-hosted model) and replicate all list features  (add new Item, edit ,...) ? and also keep the permissions for the list ?
  • Anonymous
    January 11, 2014
    Joshua Oguche,This tutorial is not working on Sharepoint Foundation 2013 because on premises apps requires User Profile Service which is not enable in this wersion of SPCheers
  • Anonymous
    January 14, 2014
    Brian, thanks for the informative post.Could you share your project sample for us?I keep hitting a deployment error 'Apps are disabled on this site' once I attempt to deploy the app with mvc site. If i deploy it with the default Winforms Site it all works lovely, but not so with the replacement site.
  • Anonymous
    February 03, 2014
    Thanks for your tutorial,I already create app with visual studio and  deploy successfully, but after click "Trust iti have the next errorUnknown User: Unable to determine your identity. Please try again by launching the App installed on your site.Could you help me? thanks
  • Anonymous
    March 19, 2014
    Thanks for this tutorial, however I am not getting to work properly.If I create a basic ASP.NET it will work well. However, when adding tthe MVC site it comes back with an error:Object reference not set to an instance of an object.on the entry added in index.cshtml. Any help on this?
  • Anonymous
    April 14, 2014
    Hi All.I want to migrate .net application to sharepoint2013.Can i use this .Please give me some suggestions.Thank you,Sowjanya.
  • Anonymous
    November 28, 2014
    hello.My Visual Studio 2013 show the follow error:Error occurred in deployment step 'Install app for SharePoint': Apps cannot be added to Site Collections in compatibility mode.ideas on how I can solve the problem?I am running a website in 2010 in compatibility mode with sharepoint 2013?
  • Anonymous
    November 28, 2014
    Leandro,Please read the answer to your question at the following Q&A post here: social.msdn.microsoft.com/.../apps-cannot-be-added-to-site-collections-in-compatibility-modeThank you,Brian
  • Anonymous
    December 04, 2014
    Really understood my problem and fixed it already.Now what happens when I have run my sample application is as follows:Error 1 Error occurred in deployment step 'Install app for SharePoint': The System Account cannot perform this action.I've read many blogs and websites, I made various settings and does not work yet.I am logged in as Administrator, the whole environment was installed with this account (unique account on the computer) and still does not work.I have a Win Server 2012 with sharepoint 2013.And I'm trying to run the application only on the micro-site to perform some tests.Can someone help me please?
  • Anonymous
    December 10, 2014
    I have this errrorError: Unknown SharePoint version: 16.0 Parameter name: versionI followed all the tutorial to the letter, and set up my certificate.Ideas??I can talk in private with skype.Just add me: lisura
  • Anonymous
    December 11, 2014
    It works. TKSBut now... How can I install on sharepoint?
  • Anonymous
    December 11, 2014
    Hi bspann,Could you please provide the source code or update the images ?I'm not able to view the images above.Thanks,Pandiarajan
  • Anonymous
    December 12, 2014
    Can we add  sharepoint calendar  to the mVC APP  or we need to do something custom?
  • Anonymous
    February 15, 2015
    Hello.. can i know if MVC 5 with Entity Framework 6 can create apps for Sharepoint 2013 (on premises)?
  • Anonymous
    June 20, 2016
    How to obtain the Issuer ID for the certificate? Can we just generate a unique GUID for it?
  • Anonymous
    March 27, 2017
    This is a cool stuff. is there a way i can render SharePoint document/ document set/ folder and display on ASP.NET page using MVC