In this post we will look into the various steps for creating and deploying a Provider-hosted add-in for SharePoint Online using Azure ACS. We will use Visual Studio 2015 for developing and deploying the solutions.
Pre-requisites
1) Office 365 Enterprise subscription and SharePoint Online should be provisioned using Office 365 Enterprise subscription and App Catalog site must be created for publishing the add-in. See detailed steps here.
2) Microsoft Azure account for creating web apps. You can create\manage the azure portal here.
2) MS Office Developer Tools for Visual Studio 2015 must be installed else the project templates for add-ins will not be visible. You can download it here.
3) Visual Studio 2015 must be opened in "run as administrator" mode.
4) The user account used for deploying the solution should not be "System Account".
Steps for creating Provider Hosted Add-ins:
We shall analyze the following steps to get a better understanding about Provider hosted Add-ins:-
1) Create an Azure Web App.
2) Register Azure Web App with SharePoint Online
3) Create the Provider Hosted Add-in
4) Deploy the Add-in to SharePoint Online
5) Add the Provider-Hosted Add-in to your site
1) Create an Azure Web App
Following are the steps for creating an empty Azure Web Application. Once the web app is created we will download a publish profile which will be used to publish the asp.net site in the add-in.
Once you have subscribed, open the Azure portal.
Select the Web Apps link on the left pane and click on Create a Web App button.
Enter the desired name and other details for your Web App. Click Create Web App button.
The new empty web app will be created as follows. Click on the web app url to open it in browser.
Now we have to download the publish profile for this web app in order to publish the Asp.Net web application in Provider hosted Add-in to this newly create azure web app. Following are the steps:
Click on Download the publish profile link to download the .publishsettings file.
You can import the .publishsettings file for a publishing destination web site to this web app.
2) Register Azure Web App with SharePoint Online
Go to the App Catalog site in SharePoint Online. See the detailed steps for provisioning SharePoint Online sites in Office 365 Trial version here.
Append "/_layouts/15/appregnew.aspx" to the App Catalog site url for registering the Azure Web App with SharePoint Online and click Create to continue
Client Id: It is the GUID for the add-in. Click "Generate" to create new Client ID.
Client Secret: It is the password for the add-in. Click "Generate" create new client secret.
Title: Display name of the add-in that is used on the consent page where the user is prompted to trust the add-in.
App Domain: It is URL for the domain where the remote add-in is hosted. Enter the domain of the Azure web app that we created in the above steps.
(Example: sptechbytesproviderhostedapps.azurewebsites.net).
Redirect Url : It is the endpoint in your remote application or service to which ACS sends an authentication code. Enter the url of the Azure web app that we created in the above steps.
(Example: https://sptechbytesproviderhostedapps.azurewebsites.net/)
Once the Add-in is registered a summary page will be shown. Copy these details and save in a notepad since we will be using these details in the upcoming steps.
3) Create the Provider Hosted Add-in
First of all, create a new project in visual studio 2015 selecting SharePoint Add-in located in Office/SharePoint->Web Add-ins as show in the following image.
Specify the SharePoint Online App Catalog Site url where the add-in should be deployed and hosting method as Provider-hosted. Click Next to continue.
Specify the version of SharePoint that will host the add-in. Click Finish to continue.
Choose the type of asp.net web application project that will be used.
Since we are using Azure ACS, choose the first option "Use Windows Azure Access Control Srevice (For SharePoint cloud add-ins)".
The project will be created and the add-in is ready for customization and deployment.
Open AppManifest.xml which consists of all the configuration and deployment information related to the add-in. In General tab, Enter the Azure Web App URL in the Start Page textbox.
(Example: https://sptechbytesproviderhostedapps.azurewebsites.net/)
In the Permission tab, choose the Scope as "Web" and Permission as "FullControl".
Now, open the AppManifest.xml in View Code mode.
Update the ClientID with the Client ID that we generate in the above steps.
4) Deploy the Add-in to SharePoint Online
Publish the solution as follows
Select "New" option for creating a new publish profile.
In the Import publishing profile section, upload the .publishsettings file that we created for the Azure Web App in the above steps. Click "Next" button to continue.
Example: (SpTechbytesProviderHostedApps.azurewebsites.net.PublishSettings)
Enter the Client ID and Client Secret that we generated while registering the add-in in the above steps. Click "Finish" button to close the wizard.
Click on Deploy your web project option to publish the asp.net site in the Add-in to the empty Azure Web App.
You can either go head will default configurations or make changes before publishing. Click Publish button to start publishing.
Output window will display the completion status as shown below.
Click on the Package the add-in option to create the deployment package for the Provider hosted Add-in (.app)
Provide the details of the Azure Web App URL and the Client ID that we created in the above steps.
The .app file will be created as follows.
Go to the SharePoint Online App Catalog site where we registered the Add-in
Upload the Provider Hosted Add-in (.app) file in the Apps for SharePoint library.
Once uploaded the add-in will be displayed as follows.
5) Add the Provider-Hosted Add-in to your site
Go to any site collection and click add an app.
Choose From Your Organization section and click on the newly deployed Add-in.
Select the Trust It option to authenticate the Add-in.
The Add-in will be added to your site and displayed as shown below.
Click on the Add-in and you will be redirected to the Azure Web App url. You will notice that Asp.Net web application in the Add-in is displayed in this URL.
For customizing the app you can use the same procedure that is used for any other normal Asp.Net (MVC\Web Forms) project. You can use CSOM or JSOM communication with SharePoint.
Pre-requisites
1) Office 365 Enterprise subscription and SharePoint Online should be provisioned using Office 365 Enterprise subscription and App Catalog site must be created for publishing the add-in. See detailed steps here.
2) Microsoft Azure account for creating web apps. You can create\manage the azure portal here.
2) MS Office Developer Tools for Visual Studio 2015 must be installed else the project templates for add-ins will not be visible. You can download it here.
3) Visual Studio 2015 must be opened in "run as administrator" mode.
4) The user account used for deploying the solution should not be "System Account".
Steps for creating Provider Hosted Add-ins:
We shall analyze the following steps to get a better understanding about Provider hosted Add-ins:-
1) Create an Azure Web App.
2) Register Azure Web App with SharePoint Online
3) Create the Provider Hosted Add-in
4) Deploy the Add-in to SharePoint Online
5) Add the Provider-Hosted Add-in to your site
1) Create an Azure Web App
Following are the steps for creating an empty Azure Web Application. Once the web app is created we will download a publish profile which will be used to publish the asp.net site in the add-in.
Go to Microsoft Azure management portal https://manage.windowsazure.com
Note: If you do not have an azure account, you can create a 30 days trial subscription using your office 365 account.
Once you have subscribed, open the Azure portal.
Select the Web Apps link on the left pane and click on Create a Web App button.
Enter the desired name and other details for your Web App. Click Create Web App button.
The new empty web app will be created as follows. Click on the web app url to open it in browser.
In our example the new web app is https://sptechbytesproviderhostedapps.azurewebsites.net/
Now we have to download the publish profile for this web app in order to publish the Asp.Net web application in Provider hosted Add-in to this newly create azure web app. Following are the steps:
Click on the web app name to open the properties page.
Click on Download the publish profile link to download the .publishsettings file.
You can import the .publishsettings file for a publishing destination web site to this web app.
2) Register Azure Web App with SharePoint Online
Go to the App Catalog site in SharePoint Online. See the detailed steps for provisioning SharePoint Online sites in Office 365 Trial version here.
Append "/_layouts/15/appregnew.aspx" to the App Catalog site url for registering the Azure Web App with SharePoint Online and click Create to continue
Client Secret: It is the password for the add-in. Click "Generate" create new client secret.
Title: Display name of the add-in that is used on the consent page where the user is prompted to trust the add-in.
App Domain: It is URL for the domain where the remote add-in is hosted. Enter the domain of the Azure web app that we created in the above steps.
(Example: sptechbytesproviderhostedapps.azurewebsites.net).
Redirect Url : It is the endpoint in your remote application or service to which ACS sends an authentication code. Enter the url of the Azure web app that we created in the above steps.
(Example: https://sptechbytesproviderhostedapps.azurewebsites.net/)
Once the Add-in is registered a summary page will be shown. Copy these details and save in a notepad since we will be using these details in the upcoming steps.
3) Create the Provider Hosted Add-in
First of all, create a new project in visual studio 2015 selecting SharePoint Add-in located in Office/SharePoint->Web Add-ins as show in the following image.
Specify the SharePoint Online App Catalog Site url where the add-in should be deployed and hosting method as Provider-hosted. Click Next to continue.
Specify the version of SharePoint that will host the add-in. Click Finish to continue.
Choose the type of asp.net web application project that will be used.
Since we are using Azure ACS, choose the first option "Use Windows Azure Access Control Srevice (For SharePoint cloud add-ins)".
The project will be created and the add-in is ready for customization and deployment.
Open AppManifest.xml which consists of all the configuration and deployment information related to the add-in. In General tab, Enter the Azure Web App URL in the Start Page textbox.
(Example: https://sptechbytesproviderhostedapps.azurewebsites.net/)
In the Permission tab, choose the Scope as "Web" and Permission as "FullControl".
Update the ClientID with the Client ID that we generate in the above steps.
4) Deploy the Add-in to SharePoint Online
Publish the solution as follows
Select "New" option for creating a new publish profile.
In the Import publishing profile section, upload the .publishsettings file that we created for the Azure Web App in the above steps. Click "Next" button to continue.
Example: (SpTechbytesProviderHostedApps.azurewebsites.net.PublishSettings)
Enter the Client ID and Client Secret that we generated while registering the add-in in the above steps. Click "Finish" button to close the wizard.
Click on Deploy your web project option to publish the asp.net site in the Add-in to the empty Azure Web App.
You can either go head will default configurations or make changes before publishing. Click Publish button to start publishing.
Output window will display the completion status as shown below.
Click on the Package the add-in option to create the deployment package for the Provider hosted Add-in (.app)
Provide the details of the Azure Web App URL and the Client ID that we created in the above steps.
The .app file will be created as follows.
Go to the SharePoint Online App Catalog site where we registered the Add-in
Once uploaded the add-in will be displayed as follows.
5) Add the Provider-Hosted Add-in to your site
Go to any site collection and click add an app.
Choose From Your Organization section and click on the newly deployed Add-in.
Select the Trust It option to authenticate the Add-in.
The Add-in will be added to your site and displayed as shown below.
Click on the Add-in and you will be redirected to the Azure Web App url. You will notice that Asp.Net web application in the Add-in is displayed in this URL.
For customizing the app you can use the same procedure that is used for any other normal Asp.Net (MVC\Web Forms) project. You can use CSOM or JSOM communication with SharePoint.
Hope you like this post! We will discuss more about programming with add-ins in the upcoming posts!
This blog is very nice with informative content thanks for sharing such like of information Buy Home Loan
ReplyDeleteDocuments
Online Document Providers
Buy Online Official Passports in US
Buy Online Fake Resident Permit