Xamarin- 與Windows Azure Mobile Servie 整合進行身份驗證.
在八月份北中南3場的跨平台App開發日中, 有一個demo是Xamarin 與Windows Azure Mobile Service整合. 微軟的Windows Azure Mobile Service 對行動裝置跨平台的支援真的是不遺餘力. 它為底下平台提供了SDK:
若不在上述支援平台的解決方案, 亦可以使用REST API. MSDN的參考資訊如下:
Windows Azure 行動服務 REST API 參考
當然, Xamrin 標榜用C#及整合Visual Studio 進行開發, 在雲端服務上怎麼能缺席呢. 微軟特別針對Xamarin撰寫一個免費的元件, 讓我們可以在專案中參考, 很方便的針對Windows Azure Mobile Service 相關的應用進行開發. 元件的說明及下載網頁如下:
http://components.xamarin.com/view/azure-mobile-services/
在這篇文章中, 我們將依據GitHub上的範例進行修改, 加入身份驗證的功能. 讓開發人員可以透過簡單的程式碼, 進行Microsoft Account, Google, Facebook以及Twitter等主流社交網站的登入. 這項功能可以分為兩個部份說明, 分別是在Windows Azure管理界面中的設定, 以及用戶端程式碼的部份.
Windows Azreu 管理界面:
要進行身份驗證, 必須取得目標平台的Client ID及Secret, 下方的連結可以連結到各平台的申請頁面, 依照說明建立應用程式, 即可取得Client ID及Secret
取得ID及Secret後, 登入Windows Azure的管理界面並選取Mobile Service (若您還沒建立行動服務, 可以參考官方的說明, 先建立Windows Azure Mobile Service), 接著切換到IDENTITY. 將您先前申請的Client ID及Secret填入. 以下圖為例, 因為我並沒有使用Twitter的習慣, 因此只申請Microsoft Account, Google以及Facebook.
做完上述動作後, Windows Azure的部份便已設定完成, 接下來就是用戶端的部份了.
行動裝置用戶端:
1. 開啟或建立專案後, 在專案下的Components節點按下滑鼠右鍵, 點擊"Get More Components”
2. 此時會帶出Xamarin 元件列表的視窗, 以下圖為例, 列表中的第一個便是我們要的Azure Mobile Service 元件, 點選後可以加入至專案.
3. 開啟專案中的AppDelegate.cs, 引用Mobile Service的名稱空間如下:
using Microsoft.WindowsAzure.MobileServices;
4. 在AppDelegate.cs 宣告一個靜態的Mobile Service Clieent 物件, 供後續的登入頁面使用.
//宣告MobileSerciceClient物件
public static readonly MobileServiceClient MobileService =
new MobileServiceClient ("<Application URL>", "<Application Key>");
上述的Application URL以及Application KEY 可以在Azure Portal 中取得, 如下圖所示:
5. 在LoginView.cs中新增以下程式進行登入
//登入事件
partial void performLogin(NSObject sender)
{
AppDelegate.MobileService.LoginAsync(this, MobileServiceAuthenticationProvider.Facebook)
.ContinueWith(t =>
{
BeginInvokeOnMainThread(() =>
{
MobileServiceUser user = t.Result;
var alert = new UIAlertView("Welcome!", "登入成功, 你的Token是: " + user.UserId, null, "OK");
alert.Show();
});
});
}
在上述的程式碼中, 我們呼叫AppDelegate中的MobileServiceClient 物件實體, 並呼叫它的LoginAsync方法, 此覆寫方法接收2個參數, 第1個是目前所在的頁面, 所以我們傳入this物件. 第2個參數是您想要實作驗證的平台提供者. 以此例是用Facebook, 當然也可以選擇Microsoft Account, Google或Twitter. 若登入成功後, 我們便可以取得user ID及Token, 搭配各平台的SDK進行後續的開發.
6. 範例執行結果如下:
在此範例中, 還有用到iOS平台的Storyborad物件, 後續會再針對Storyborad做詳細的介紹.
範例程式下載:Lab02-MobileService.zip