How To Use Microsoft Graph Provider In Visual Studio Connected Services

In this article, I am introducing the newly added Microsoft Graph Provider in Visual Studio 15.3.1. This article demonstrates how a developer can use this feature to work with Microsoft Graph API.

If you don’t know anything about Microsoft Graph API, then I suggest you read something about it hereTo make this article meaningful, I am explaining it using a new Excel add-in project. There is no coding involved though.

Prerequisites

There are some prerequisites if you want to follow the exercise I have shown in this article. If you just want to read and don’t want to follow any steps by yourself, then please jump to the "Let’s Start" section in this article.

Visual Studio 15.3.1 with Office Development Tools

On August 18, 2017, Microsoft has released Visual Studio 2017 version 15.3.1. For more on this release, see release notes here.

This article assumes that you have already installed Visual Studio 15.3.1; if not, then you can download it here. For more specific content on how to install Visual Studio, please read my article here.

You will also need to have Office Development Tools installed while you install Visual Studio. Please read my article on that here.

Office 365 Developer account

You may have access to Office 365 through your corporate account provided by your employer. But it is strongly advised that you don’t use that account. Instead of that, get an Office 365 developer account here for free and enjoy 365 days of Office 365! 

For more info on that, please read my article on Office 365 developer program here

Before moving further, let’s make sure that you are using the correct version of Visual Studio for following instructions in this article, otherwise, it will not work. Multiple versions of Visual Studio can be installed side by side, including preview version, so it’s necessary to make sure of the correct version you are working with.

In Visual Studio, open the menu Help -> About Visual Studio.

Microsoft Graph Provider

Please make sure 15.3.1 is the version of your VS.

Microsoft Graph Provider

If that’s the version of your Visual Studio, then let’s start.

Let’s Start

Open Visual Studio 15.3.1 and click on “Create New Project…”.

In the “New Project” window, Select “Visual C#“ -> “Office/SharePoint” -> “Add-ins” -> “Excel Web Add-in”.

Microsoft Graph Provider

Click on “OK” to create a new project. 

In the next window that appears, select the option “Insert content into Excel spreadsheets”, then click “Next”.

Microsoft Graph Provider

Select “Basic Add-in”, then click “Finish”.

Microsoft Graph Provider

Visual Studio will create a new Excel add-in project for you.

Once Visual Studio is ready, open Solution Explorer, find “Connected Services” under your project, and double click on it.

Microsoft Graph Provider

You will see the following screen.

Microsoft Graph Provider

Click on “Access Office 365 Services with Microsoft Graph” which is the core of this article.

You will be shown a window to configure access to your Office 365 services.

Microsoft Graph Provider

If you have your Office 365 developer account, then enter the domain name you selected in the “Domain” textbox. Don’t forget to add “.onmicrosoft.com” too.

Microsoft Graph Provider

I have entered my developer account domain but masked it for security.

If that was the correct domain you entered, you will be shown a sign-in window where you will enter the details you used while registering for Office 365 developer account.

Microsoft Graph Provider

If your login information is correct, you will be shown “Configure Application” section,

Microsoft Graph Provider

Let it be “Create a new Azure AD application”, and click “Next”.

Now, the wizard will ask you for permission to different Office 365 sections. It’s up to you what permissions you want to assign. You can change it later.

Microsoft Graph Provider

Following are the permissions I selected under “User” tab.

Microsoft Graph Provider

Similarly, I also selected some permissions in other tabs.

Once you are done selecting permissions, then click “Finish”.

Microsoft Graph Provider

It will take some time for Visual Studio to configure the access. Meanwhile, you will see a window like below.

Microsoft Graph Provider

Once Visual Studio is done with configuring access to Office 365, that window will close automatically. If there was any error, it will be reported to you. Otherwise, you will see a success message in the output window.

Microsoft Graph Provider

Also, if you note – under “Connected Services” in Visual Studio, Office 365 Services will have a green tick mark,

Microsoft Graph Provider

There is also something more which happened.

Go to Solution Explorer. Do you see under “Connected Services” a new folder of “Office365” has been added?

Microsoft Graph Provider

Those two files under Office365 folder are not too important programmatically. One is a link to Microsoft Graph documentation, another is a JSON file with a link to getting started documents. But we will leave those untouched as of now.

Open the Web.config file and see what’s changed here. You will see under the appSettings tag, Visual Studio has added some configuration details.

Microsoft Graph Provider

You will see client id, client secret, tenant id and domain are automatically inserted in this file based on the information you provided while configuring access to Office 365.

Visual Studio also created an application under Microsoft Azure Application Registration for you.

To check that, log in to portal.azure.com with the same account as you used for configuring access to Office 365 above.

Once logged-in to Azure, under search type “app reg”,

Microsoft Graph Provider

Click on “App registrations” link.

Under “app Registrations” you will see an app with the same name as your project in Visual Studio,

Microsoft Graph Provider

The GUID under application id is what you will see in your web.config file. You will not see the client secret anywhere though.

Also, if you note under package manager, Visual Studio has already added references to MS Graph SDK,

Microsoft Graph Provider

See how easy it has been made by Visual Studio now to kick start your Office 365 development using Microsoft Graph?

This article’s purpose was only to make developers aware of the addition of Microsoft Graph under connected services in Visual Studio. I will cover the actual code to be written in a project to call Microsoft Graph API in another article sometime later.

Meanwhile, if you want to see by yourself how you can call Microsoft Graph using Visual Studio, please go to this link. You can also read my other articles on MS Graph API here.

Next Recommended Readings