前言

這篇文章最早寫于2017年5月2日，當時的想法是從最簡單的方式來寫如何在一個ASP.NET MVC應用程序中集成Microsoft Graph，但實際上還真不是那么簡單，至少我是不滿意的，加上這一兩周都比較忙，所以這一篇就一直擱置。直到上周的一個契機，讓我看到了一個全新的方式，而且可以極大地改變我們在Web應用程序中集成Microsoft Graph，所以抓緊做了實踐，寫出來給大家參考。

在今年3月份Visual Studio 2017進行發布的時候，我已經發現它新增了一個很重要的功能，名稱叫Connected Services，它提供了連接Azure AD，Office 365等云端服務的能力，這讓我大喜過外，因為這確實是我們一直需要的東西。但仔細看下來，卻發現這個第一版的功能，并不是最新的Microsoft Graph集成，而是Office 365傳統的每個服務單獨的RestAPI的接口。

由于我正好在寫這個系列文章，對Microsoft Graph有些研究，對其重要性深有感觸，所以我當即給公司內部負責Visual Studio的最高領導（Julia Liuson —— 潘正磊女士）發了郵件提出意見，希望她能盡快考慮直接集成Microsoft Graph。沒想到Julia很快就回了郵件，在表示親切慰問的同時明確表態會盡快考慮這個需求，而就在前不久舉辦的Build 2017大會上，我們就看到了這個組件的更新，包含在最新的Visual Studio 2017 Preview中。

我將這個有意思的小插曲寫出來，當然不是天真地認為這個更新的快速推出有我什么功勞。但從這里可以看出微軟的產品組是很重視一線（包括客戶，用戶以及內部員工等）反饋的聲音，而且他們的響應速度是非常快的。我必須為他們點個贊！

Visual Studio 2017 Preview是一個特殊的版本，可以單獨安裝，并且可以與現存的Visual Studio其他版本共存。它的下載地址在?https://www.visualstudio.com/vs/preview/?.

與此同時，Microsoft Graph的官方網站也提供了一篇專門的文章介紹如何使用這個Connected Service來實現與Graph的集成，請參考?https://developer.microsoft.com/en-us/graph/docs/concepts/office_365_connected_services

根據范例快速體驗

我非常推薦你根據官方文檔的說明，下載它的那個范例代碼來快速實踐。

在Visual Studio 2017 Preview中打開上面這個解決方案，并且打開Connected Services的界面?

選擇“Access Office 365 Services with Microsoft Graph”,輸入或者選擇你的Office 365 租戶信息。請注意，這里目前還只支持國際版?

點擊“Next”進行Application的配置，如果是第一次操作，則選擇“Create a new Azure AD Application”?

接下來，按照文檔要求， 選擇以下幾個權限

For the File APIs, set permissions to Have full access to your files For the Mail APIs, set permissions to Send mail as you For the User APIs, set permissions to Sign you in and read your profile

最后，按照文檔要求，將Models目錄下面的GraphService.cs文件中的幾行代碼取消注釋。一切就緒，我們就可以調試了。?

點擊右上角的“Sign in with Microsoft”，會被導航到Office 365的登錄頁面?

輸入用戶名和密碼后，點擊“Sign In”，系統會引導你對權限進行確認?

點擊“Accept”后回到主界面，然后點擊“Get email address” 按鈕可以看到讀取到當前用戶的郵箱地址，然后點擊“send mail”則可以實現郵件發送。?

看起來還是不錯的，對吧？那么，這是怎么做到的呢？首先是Visual Studio幫我們做了不少工作，主要是自動完成應用程序注冊，并且在配置文件中保存信息?

其次，這個范例程序，里面有幾個文件預先編寫好了代碼

我不想解釋這些代碼。我當然是知道為什么應該這么寫，但并不想讓每個人都去這么寫。作為一個有一點追求的老同志，我根據這些代碼的邏輯封裝了一個組件，便于在大家后續開發的時候，直接使用。

在你的應用中快速集成Microsoft Graph

范例運行成功并沒有什么了不起，下面就要看一下怎么在一個自己寫的應用程序中實現同樣的功能。我上面提到了，雖然Visual Studio幫我們做了不少工作，但有些代碼還是省不了的，為了讓大家的代碼減到最少，我寫了一個組件，叫做Office365GraphMVCHelper。

接下來我就帶大家來極致體驗一下，怎么用不到三行代碼就完整地實現Microsoft Graph的調用。對，就是這么任性。

請注意使用Visual Studio 2017 Preview，同時確保上面對話框中，目標的Framework選擇 4.6。然后再下面的對話框中選擇“Empty”模板，并選擇“MVC”這個功能

按照之前的介紹，添加"Connected Service","Access Office 365 Services with Microsoft Graph"。作為演示目的，請選擇一個權限即可

接下來就是添加我寫好的那個組件，請運行下面的命令 Install-Package Office365GraphMVCHelper

接下來為當前這個項目添加一個啟動類（Owin Startup Class）：Open Web Interface for .Net

用一行代碼為啟動類添加Microsoft Graph身份功能?

接下來就可以實現業務模塊了，我們可以添加一個默認的Controller，在Index這個Action里面，我用兩行代碼做了實現：讀取當前用戶的信息，并且輸出到瀏覽器。

請不要告訴你不知道什么叫Controller，咱這篇文章講的是MVC哦

運行起來看看效果吧。在要求你輸入用戶名和密碼，以及授權確認后，你將看到如下的界面。?

當然，這只是一個演示，但只要打開了這扇大門，接下來你要做的就是盡情地調用Microsoft Graph所提供的功能了，詳情請參考?https://github.com/microsoftgraph/msgraph-sdk-dotnet?。

總結

這一篇文章講解了Visual Studio 2017 Preview最新推出的直接將Microsoft Graph集成到應用程序的開發體驗，并且演示了如何借助我封裝好的一個組件，進一步將后續編碼簡化到最少。我后續還會看看怎么把中國版的功能整合進來。

已經實現對中國版Office 365的支持

2017年5月31日，重構代碼實現了對中國版Office 365的支持，并且將Office365GraphMVCHelper這個工具包升級到了2.0版本。?

由于Visual Studio 2017 Preview提供的工具，不能直接添加中國版的Office 365作為Connected Service，所以，你需要手工地在中國版Office 365中注冊應用程序，并且在web.config文件中添加如下的信息

<add key="ida:ClientId" value="1142d051-c271-4044-b1ac-522c8029e3b7" /> <add key="ida:ClientSecret" value="Ei4JeIsuKzPVfnkgAmWSFfE9p5YKs0yhm41dcZo/ink=" /> <add key="ida:TenantId" value="12c0cdab-3c40-4e86-80b9-3e6f98d2d344" /> <add key="ida:Domain" value="modtsp.partner.onmschina.cn" /> <add key="ida:AADInstance" value="https://login.chinacloudapi.cn/" /> <add key="ida:ResourceId" value="https://microsoftgraph.chinacloudapi.cn" />

請注意，最后一行跟國際版不一樣。國際版可以省略。

這樣完成設置后，其他的代碼都是和國際版一樣的，盡情享受吧

總結

以上是生活随笔為你收集整理的【转】Microsoft Graph Web应用程序极致开发体验的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。