概要
この記事の記載内容
- Xamarin.Forms + Azure Mobile Appsで認証処理を行う
- 公式ドキュメントだと代替案が大量にあり大混乱したので、余計な代替案は出さず、最低限の説明のみ記載し、認証処理を実現できることを目指す
- 対象OSはAndroid、iOS
- 1章は主にAzureの設定
- 2章はAzure Web Apps、Xamarinのプログラム修正方法
実現したい処理内容
- 複数プロバイダ（Office365, Google）でXamarin.Forms + Azure Mobile Appsの認証処理を行う
- アプリ起動時、過去にサインインを行っていれば、サインイン画面を再度表示せずに認証後の画面に遷移する
- アクセストークンは定期的に更新する
その他・要調査項目
- Azure Mobile Appsにはサーバー側認証する。クライアント側認証との違いは難しいので良くわかってない
- GoogleのRefreshトークンの取得が出来ない
- サインアウト時、アプリからキャッシュ消すだけじゃなくて、ブラウザからもサインアウトしたいけど、やり方わからない
今回解説用に作成するアプリの名称
- アプリ名：XamarinAuthFirst
- Azure Mobile Apps名：xamarin-auth-1st
- Azure Mobile Apps URL： https://xamarin-auth-1st.azurewebsites.net
- リダイレクト用URLスキーマ： xamarin-auth-1st://easyauth.callback
Azure設定
Azure Mobile Apps登録(1)
Azureポータルの「＋新規」を押下し、「Mobile Apps」で検索します。
すると「モバイル アプリ」が表示されるので、選択します。
そして「アプリ名」に、URLとなる「xamarin-auth-1st」を入力し、作成します。
Office365サインイン設定 - Azure AD Application登録
Azureポータルの「Azure Active Directory」を押下し、「アプリの登録」を押下します。
その後、「＋新しいアプリケーションを登録」を押下します。
アプリの名前、サインオンURLを入力します。
アプリケーションの種類は、「Webアプリ/API」を選択してください。
新しいアプリが作成されます。
「アプリケーションID」文字列はコピーしてください。あとで使用します。
アプリの設定を変えていきます。
「プロパティ」で、「マルチテナント」を「はい」に変更してください。
その後「保存」を押下します。
「応答URL」を選択し、URLの末尾に「/.auth/login/aad/callback」を追加します。
その後「保存」を押下します。
「キー」を選択し、任意の「キーの説明」を入力、期間を設定し（自分は「期限なし」を選択します）、「保存」を押下します。
「値」の欄に、ClientSecretが発行されるので、必ずコピーします。あとで使用するのと、これ以降この文字列はコピーできないので、この段階で必ずコピーしてください。
これでAzure AD Applicationの設定は終了です。
Googleサインイン設定 - Google OAuth登録
次はGoogleです。以下のサイトにアクセスしてください。
https://console.developers.google.com/
メニューから「認証情報」を選択し、「認証情報を作成」を押下します。
その後、「OAuth クライアントID」を押下します。
アプリケーションの種類を「ウェブ アプリケーション」、
名前は任意の名前（アプリ名）
承認済みのJavascript生成元を、Azure Mobile AppsのURL、
承認済みのリダイレクトURIを、Azure Mobile AppsのURL + 「/.auth/login/google/callback」を入力します。
完了したら、「作成」を押下します。
クライアントID、クライアントシークレットが表示されるので、コピーします。
これでGoogle APIsの設定は終了です。
Azure Mobile Apps登録(2)
先ほどコピーした、Azure AD Application、 Google APIsのIDなどを、Azure Mobile Appsに登録します。
Azure Mobile Appsの設定に戻り、「認証/承認」を押下します。
その後、「Apps Service 認証」を「オン」にします。
認証プロバイダーの情報が表示されるので、「Azure Active Directory」を押下します。
管理モードを「詳細」にします。
クライアントID、クライアントシークレットに、先ほどAzure AD ApplicationでコピーしたクライアントID・Secretを記入します。「発行者のURL」は空欄にしてください。
その後、「OK」を押下します。
Googleでも同様の手順を行います。
認証プロバイダーで「Google」を押下し、クライアントID・シークレットを、Google APIsで記入したID・シークレットをコピーします。
その後、OKを押下します。
ページ下の「許可される外部リダイレクト URL」に、スキーマ名 + 「://easyauth.callback」と入力します。スキーマ名はアプリ名なんかでいいと思います。
スキーマ名は、Android + iOS側で「URLからアプリに戻る」ための判別を行うためのもののようです。
今回は「xamarin-auth-1st://easyauth.callback」にします。
最後、「保存」を押下します。
Azure Mobile Apps登録(3)
Xamarinソリューション、ならびにDB設定などの準備を行います。
今回は「クイックスタート」を利用します。
メニューより「クイックスタート」を押下します。
その後、「Xamarin.Forms」を押下します。
「データベースの接続」を押下し、「＋追加」を押下します。
必要なDBの情報を一通り設定します。必要に応じてSQL Databaseは作成してください。
テーブルAPIの言語を選択します。
個人的にはC#をおすすめします。
C#を選択した場合、「ダウンロード」ボタンが表示されますので、押下します。
Azure Mobile Apps本体のソリューションがダウンロードされます。あとで使用します。
「クライアント アプリケーションの構成」で、「新しいアプリケーションアプリの作成」を押下し、「ダウンロード」を押下します。
Xamarin.Formsソリューションがダウンロードされます。あとで使用します。
これで、Azureの設定はすべて終了です。
次回予告
次回は、ダウンロードしたAzure Mobile Appsソリューション、Xamarin.Formsソリューションに、認証処理を加えていきます。
https://qiita.com/hirossyi73/items/f3e56633a4f24eb27a60
参考文献
https://docs.microsoft.com/ja-jp/azure/app-service-mobile/app-service-mobile-xamarin-forms-get-started-users
https://docs.microsoft.com/ja-jp/azure/app-service/app-service-mobile-how-to-configure-active-directory-authentication
https://docs.microsoft.com/ja-jp/azure/app-service/app-service-mobile-how-to-configure-google-authentication
（宣伝1）Vietnam Japan Cloud Developer 2017 開催！
https://connpass.com/event/67792/
Xamarin.FormsやAzure Mobile Appsをはじめとした、クラウドサービスのセミナーをハノイで開催します！
日程：2017/11/17(Fri) 16:00-20:00
自分も少し話します。英語か日本語かは要検討。
内容はYouTubeにも公開します。ハノイには来れない、という方もぜひYouTubeにてお越し下さい！
（宣伝2）Xamarin.Forms + Azure Mobile AppsのOSSプロジェクト開発中
現在、Xamarin.Forms + Azure Mobile AppsのOSSアプリを走らせています。
日々の日報などをSPのみで完結出来るアプリです。
GitHubで公開しておりますので、よければぜひご覧ください！
https://github.com/exceedone/APO-Chan