In this lab, you will create apps that use different approaches for OAuth security management and examine the process flow.
- You must have an Office 365 tenant and Windows Azure subscription to complete this lab. If you do not have one, the lab for O3651-7 Setting up your Developer environment in Office 365 shows you how to obtain a trial.
- You must have [Fiddler] (http://www.telerik.com/fiddler) installed.
In this exercise you create a new provider-hosted app and examine the OAuth flow.
- Create the new solution in Visual Studio 2013:
- Launch Visual Studio 2013 as administrator.
- In Visual Studio select File/New/Project.
- In the New Project dialog:
1. Select Templates/Visual C#/Office/SharePoint/Apps.
2. Click App for SharePoint 2013.
3. Name the new project ProviderHostedOAuth and click OK.
- In the New App for SharePoint wizard:
1. Enter the address of a SharePoint site to use for testing the app (NOTE: The targeted site must be based on a Developer Site template)
2. Select Provider-Hosted as the hosting model.
3. Click Next.
4. Select ASP.NET MVC Web Application. 5. Click Next.
6. Select the option labeled Use Windows Azure Access Control Service (for SharePoint cloud apps). 7. Click Finish.
8. When prompted, log in using your O365 administrator credentials. 9. After the new project is created, set breaskpoints in HomeController.cs as shown.
- Start Fiddler to capture web traffic from your app.
- In Fiddler click Tools/Fiddler Options.
- Click HTTPS.
- Check the box entitled Decrypt HTTPS Traffic.
- When warned, click Yes to trust the Fiddler root certificate.
- Confirm any additional dialog boxes to install the certificate.
- Click OK to close the options dialog.
- Debug the app by pressing F5 in Visual Studio 2013.
- When prompted, sign into Office 365.
- When prompted, click Trust It.
- When the first breakpoint is hit, look for the session in Fiddler near the bottom of the list.
- Right click the session and select View in New Window.
- Click the Web Forms tab.
- Notice that SharePoint has included the SPHostUrl, SPLanguage, SPClientTag, and SPProductNumber query string parameters in the initial call. These are known as the Standard Tokens.
- Notice that the context token is included in the body as SPAppToken
. - Close the window.
- Return to Visual Studio, and press F5 to continue debugging.
- When the second breakpoint is hit, look for the session in Fiddler near the bottom of the list.
- Right click the session and select View in New Window.
- Click the Headers tab and examine the access token in the Cookies/Login section
- Return to Visual Studio, and press F5 to continue debugging.
- With the app still running, open a new browser window to /_layouts/15/AppPrincipals.aspx.
- Look for ProviderHostedOAuth in the list of registered apps to confirm that the app was registered during debugging.
- Stop debugging.
In this exercise you create a new web applicvation and examine the OAuth flow.
- Create the new solution in Visual Studio 2013:
- Launch Visual Studio 2013 as administrator.
- In Visual Studio select File/New/Project.
- In the New Project dialog:
1. Select Templates/Visual C#/Web.
2. Click ASP.NET Web Application.
3. Name the new project OfficeOAuth and click OK.
- In the New ASP.NET Project dialog, select Web API.
- Check Host in the Cloud.
- Click Change Authentication.
- In the Change Authentication dialog: 1. Click No Authentication. 2. Click OK.
- Click OK.
- If prompted, sign into Windows Azure.
- When the Configure Windows Azure Sites Settings dialog appears, make appropriate selectgions for your project.
- Click OK.
- If you do not have the Office 365 API Tools installed:
- Click Tools/Extensions and Updates.
- In the **Extensions and Updates" dialog, click Online.
- Click Visual Studio Gallery.
- Type Office 365 in the search box.
- Click Office 365 API Tools - Preview.
- Click Install.
- Add an O365 connection
- Right click the OfficeOAuth project and select Add/Connected Service.
- In the Services Manager dialog, click Sign In.
- Sign in with your managed account.
- Click Calendar.
- Click Permissions.
- Check Read user's calendar.
- Click **Apply.
- Click OK.
- Update the Home Controller.
- Expand the Controllers folder and open HomeController.cs.
- Replace the Index method with the following code
public async Task<ActionResult> Index()
{
IOrderedEnumerable<IEvent> events = await CalendarAPISample.GetCalendarEvents();
ViewBag.Events = events;
return View();
}
- Update the Index View.
- Expand the Views/Home folders and open Index.cshtml.
- Replace all of tyhe code with the following
<div style="margin:25px;">
<table>
<tr>
<th>Start</th>
<th>End</th>
<th>Subject</th>
<th>Location</th>
</</tr>
@foreach (var Event in ViewBag.Events)
{
<tr>
<td>
<div style="width:200px;">@Event.Start.ToString()</div>
</td>
<td>
<div style="width:200px;">@Event.End.ToString()</div>
</td>
<td>
<div style="width:200px;">@Event.Subject</div>
</td>
<td>
<div style="width:200px;">@Event.Location.DisplayName</div>
</td>
</tr>
}
</table>
</div>
````
6. Debug the app.
1. Start **Fiddler**.
2. Press **F5** in Visual Studio 2013 to debug the application.
3. When prompted, login to Office 365 with your managed account.
4. Verify that the application displays your calendar information.
5. In **Fiddler**, locate the session entry containing the query string parameter **code**. This is the Authorization Code returned from Azure Access Control Services.<br/>
![](Images/16.png?raw=true "Figure 16")
6. Right click the session and select **Inspect in New Window**.
7. In the session window, click the **Web Forms** tab.
8. Examine the authorization code.<br/>
![](Images/17.png?raw=true "Figure 17")
9. Close the window.
10. Stop debugging.
7. Examine the Windows Azure configurtation.
1. Log into the [Windows Azure Portal](https://manage.windowsazure.com)
2. Click **Active Directory**.
3. Select your Azure Active Directory instance.
4. Click on the app entitled **OfficeOAuth.Office365App**. This entry was made for you by the Office 365 tools in Visual Studio.
5. Click **Configure**.
6. Scroll to the section entitled **Permissions to Other Applications**.
7. Examine the **Office 365 Exchange Online** permissions. These are the permissions you granted in Visual Studio.<br/>
![](Images/18.png?raw=true "Figure 18")
**Congratulations! You have completed investigation OAuth in Office 365.**