Visual Studio App Centerを公式サンプルアプリから学ぼうiOS(swift),Android(java)
- 1. Visual Studio App Centerを 公式サンプルアプリから学ぼう iOS(Swift), Android(Java) 2018/01/20 JXUGC #24 春の App Center 祭り なかしょ（中島進也）
- 2. Profile • 名前：なかしょ（中島 進也） • Twitter：@nakasho_dev • ブログ：なかしょの技術日誌 http://nakasho-dev.hatenablog.jp/ • 最近の興味 TDD、アジャイル開発、Xamarin、Chatbot、Tizen • 主な参加コミュニティ JXUG、.NETラボ、Cogbot ※本資料は私個人の意見であり、所属企業・部門見解を代表するもの ではありません。 2
- 5. サンプルアプリを通じて分かること • SDKの組み込み方 • ビルド方法 • テストの方法 • 配信方法（ad-hoc配布、iTunesConnect配布） • クラッシュログの取得方法 • イベントログの残し方 • Push通知の方法 5https://github.com/Microsoft/appcenter-sampleapp-ios-swift
- 6. サンプルアプリの流れ 6 Getting Started Build Test Distribute Crashes Analytics Push
- 7. Getting Started • GitHubのアカウントを作成し以下のリポジトリをフォーク • https://github.com/Microsoft/appcenter-sampleapp-ios-swift • フォークしたリポジトリをローカルにClone • 例：git clone https://github.com/nakasho-dev/appcenter-sampleapp-ios-swift.git 7https://docs.microsoft.com/en-us/appcenter/quickstarts/ios/getting-started ここをクリック
- 8. Getting Started • AppCenterにサインイン • https://appcenter.ms/create-account • 以下のアカウントが使用可能 • GitHub • Microsoft • Facebook • Google 8https://docs.microsoft.com/en-us/appcenter/quickstarts/ios/getting-started
- 9. Getting Started • 新規アプリを登録 • Add New ⇒ Add New App • OSはiOSを選択 • PlatformはObjective-C/Swiftを選択 • 作成後ポータル画面に遷移 9https://docs.microsoft.com/en-us/appcenter/quickstarts/ios/getting-started ポータル画面では最初 にやるべきことが書い てある
- 10. Getting Started - CocoaPodsの使用 10https://docs.microsoft.com/en-us/appcenter/quickstarts/ios/getting-started Cloneしたプロジェクトの ディレクトリに移動し、以下を実施 １．Podfileの初期化 $ pod init ２．Podfileに以下を記述 pod 'AppCenter’ pod 'AppCenter/Push' ３．指定したライブラリを適用 pod install CocoaPodsを入れていなかったら以下のコマンドでインストール $ sudo gem install cocoapods サンプルアプリではPodfile を作成済み $pod installのみでOK Carthageに 対応していません
- 11. Getting Started - App Secretの置換 11https://docs.microsoft.com/en-us/appcenter/quickstarts/ios/getting-started ポータル画面では表示されているApp SecretをAppDelegate.swift内にある <APP SECRET HERE>と置換する サンプルアプリでは以下 の宣言も追加されている import AppCenterPush サンプルアプリでは以下 も追加されている MSPush.self 公開リポジトリで管理するのであれば AppSecretは埋め込むのは厳禁
- 12. Getting Started – 証明書の準備 • Apple Developer Programの証明書を準備すると以下が可能となる。 • Test • Destribute • Push • 証明書なしでできること • Build（ XCTest 含む） • Clashes • Analytics 12https://docs.microsoft.com/en-us/appcenter/quickstarts/ios/getting-started
- 15. Build – GitHubとの連携 • 自分が編集したソースをGitHubへPush $ git add . $ git commit –m ‘App Secret を変更’ $ git push • アプリポータル画面からビルドを選択してGitHubを選択 15https://docs.microsoft.com/en-us/appcenter/quickstarts/ios/build
- 16. Build – GitHubとの連携 • GitHubへのログインをおこない、対象のリポジトリを選択 16https://docs.microsoft.com/en-us/appcenter/quickstarts/ios/build
- 17. Build – GitHubとの連携 • ブランチの一覧が表示されるのでmasterを選択 17https://docs.microsoft.com/en-us/appcenter/quickstarts/ios/build
- 18. Build – ビルド設定（１／２） • Project/Workspace • Shared Scheme • XCode version • Build Script • 固定名のファイルを含めることで有効となる • Build frequency • Pushごとにビルドするか否か • Automatically increment build number • ビルドごとにビルド番号を増加させるか否か • Run XCTest tests • ビルド時にXCTestをおこなうか否か 18https://docs.microsoft.com/en-us/appcenter/quickstarts/ios/build
- 19. Build – ビルド設定（２／２） • Environment variables • 環境変数を設定しビルドに反映できる • リポジトリに含められないものはここで管 理すべき • Sign builds • ビルド時に署名を付与するか否か • Test on a real device • 実機テストを実施するか否か • Distribute builds • ビルドを配信するか否か • Advanced • ビルドステータスバッジの有無 19https://docs.microsoft.com/en-us/appcenter/quickstarts/ios/build
- 20. Build – Sign builds 署名設定 • プロビジョニングプロファイルとp12ファイルを登録することで 証明書の署名が可能となる 20https://docs.microsoft.com/en-us/appcenter/quickstarts/ios/build プロビジョニングプロファイルやp12ファ イルが正常でないと以下のような警告が出 て登録できない
- 21. Build – ビルド状態表示 21https://docs.microsoft.com/en-us/appcenter/quickstarts/ios/build • 設定後、ビルドを走らせると以下のようにビルド状態を表示 Downloadボタンから以下 がダウンロード可能 ・Build ・Symbols ・logs
- 23. Test – ローカル端末で準備 • AppCenterCLIのインストール $ npm install -g appcenter-cli • AppCenterにログイン $ appcenter login • プロジェクトフォルダに移動し てderivedDataPathを削除 $ rm -rf ddp • テスト用フォルダを作成 $ xcrun xcodebuild build-for-testing - configuration Debug -workspace sampleapp- ios-swift.xcworkspace -sdk iphoneos -scheme sampleapp-ios-swift -derivedDataPath ddp 23https://docs.microsoft.com/en-us/appcenter/quickstarts/ios/test Node.js6.3以上の環境で以下を実行 Loginコマンドでブラウザが開くので AppCenterにログインして上記のコー ドをコピーし、端末に貼り付ける このパラメータで指定したパス(ddp)が重要
- 24. Test – 端末の選択 • 以下を選択 • 機種 • OS 24https://docs.microsoft.com/en-us/appcenter/quickstarts/ios/test 今回は iPhone7 Plus iOS 11.2.2 を 選択
- 25. Test – 設定 • 以下を選択 • Test Series • システム言語 • Test framework 25https://docs.microsoft.com/en-us/appcenter/quickstarts/ios/test 今回のサンプルアプリではXCUITest 用のテストが用意されているので、 それを選択する。
- 26. Test – 実行 • プロジェクトのフォルダで 画面上に出ているテストコ マンドを実行する。 • 「pathToXCUItestBuildFol der」を 「 ddp/Build/Products/De bug-iphoneos」に置換して 実行する。 26https://docs.microsoft.com/en-us/appcenter/quickstarts/ios/test
- 28. Test – テスト結果 28https://docs.microsoft.com/en-us/appcenter/quickstarts/ios/test ぐぬぬぬ CocoaPodsの失敗が影響 かも？ クリックで詳細ログが表示さ れる
- 29. Test – テスト結果詳細 29https://docs.microsoft.com/en-us/appcenter/quickstarts/ios/test 端末情報の詳細が表示 ログ詳細が表示
- 32. Distribute • iOSの配信方法は３つ グループ配信 App Centerによる配信 Ad-Hoc証明書が必要 登録したユーザにメールで通知 iTunesConnectによる配信 Production証明書が必要 TestFlight用の配信 AppStore用の配信 Intune Company Portal用の配信 32https://docs.microsoft.com/en-us/appcenter/quickstarts/ios/distribute
- 39. Distribute – ストア配信 39https://docs.microsoft.com/en-us/appcenter/quickstarts/ios/distribute iTuneConnectを選 択 Publish to TestFlight をクリック
- 40. Distribute – ストア配信 40https://docs.microsoft.com/en-us/appcenter/quickstarts/ios/distribute IPAファイルのアッ プロード アップロード内容を確 認 リリースノートを記述 確認してPublish
- 45. Crashes – クラッシュ情報取得 • 登録方法はAppDelegateに以下のコードを追加するのみ。 • クラッシュ情報がAppCenterに送信されるのはアプリ再起動後。 • テストのため意図的にクラッシュさせるAPIが用意されている。 45 https://docs.microsoft.com/en-us/appcenter/quickstarts/ios/crashes
- 47. Push • Pushの実現に必要な条件 ワイルドカードではないProduction証明書 Pushの許可を有効にすること Push 通知用のサービスキー アプリのビルドでCapabilitiesのPush通知をON アプリのソースにAppCenter/Pushを組み込む Podfileに 「pod ‘AppCenter/Push’」を追加 AppDelegateでMSPush.selfを追加 47https://docs.microsoft.com/en-us/appcenter/quickstarts/ios/push
- 48. Push – 認証情報を登録 48 https://docs.microsoft.com/en-us/appcenter/quickstarts/ios/push Key IDを登録 PrefixとIDを登録 Keyファイルにある Tokenを登録
- 50. Push – オーディエンスについて • オーディエンスは以下の属性から選択可能 App Version Country MobileCarrier Language DeviceModel OEM Device OS Version Screen Size 50https://docs.microsoft.com/en-us/appcenter/quickstarts/ios/push App Versionはアプリの バージョンアップ時に、 旧バージョンを使っている ユーザへアップデートを促 す際に非常に有効
- 51. Push – 送信 • 各画面で登録した情報が表示 • 確認して「Send notification」 をクリック 51https://docs.microsoft.com/en-us/appcenter/quickstarts/ios/push
- 52. Push – 履歴一覧 • 送信状況が一覧で確認できる 52https://docs.microsoft.com/en-us/appcenter/quickstarts/ios/push
- 53. iOSまとめ • アプリへの組み込みのポイント CocoaPodsの導入、Podfileの編集 AppDelegateへの初期化処理の追加 各イベントログ対象時のイベントの埋め込み • クラッシュログが送信されるのは再起動後 • ストアへの配信はIPAファイルのアップロードのみ リポジトリからやりたいなぁ • 実機テストはローカル側の設定に一癖ありそう 53
- 55. サンプルアプリを通じて分かること • SDKの組み込み方 • ビルド方法 • テストの方法 • 配信方法（APK配布、GooglePlay配布） • クラッシュログの取得方法 • イベントログの残し方 • Push通知の方法 55https://github.com/Microsoft/appcenter-sampleapp-android
- 56. サンプルアプリの流れ 56 Getting Started Build Test Distribute Crashes Analytics Push
- 57. Getting Started • GitHubのアカウントを作成し以下のリポジトリをフォーク • https://github.com/Microsoft/appcenter-sampleapp-android • フォークしたリポジトリをローカルにClone • 例：git clone https://github.com/nakasho-dev/appcenter-sampleapp-android.git 57https://docs.microsoft.com/en-us/appcenter/quickstarts/android/getting-started ここをクリック
- 58. Getting Started • AppCenterにサインイン • https://appcenter.ms/create-account • 以下のアカウントが使用可能 • GitHub • Microsoft • Facebook • Google 58https://docs.microsoft.com/en-us/appcenter/quickstarts/android/getting-started
- 59. Getting Started • 新規アプリを登録 • Add New ⇒ Add New App • OSはAndroidを選択 • PlatformはJavaを選択 • 作成後ポータル画面に遷移 59https://docs.microsoft.com/en-us/appcenter/quickstarts/android/getting-started ポータル画面では最初 にやるべきことが書い てある
- 60. Getting Started - App Secretの置換 60https://docs.microsoft.com/en-us/appcenter/quickstarts/android/getting-started ポータル画面で表示されているApp SecretをMainActivity内にある<APP SECRET HERE>と置換する 公開リポジトリで管理するのであれば AppSecretは埋め込むのは厳禁
- 61. Getting Started – 証明書の準備 • 実機にAPKをインストールするためには証明書が必要 • Build > Generate Signed APKで証明書を作成 61https://docs.microsoft.com/en-us/appcenter/quickstarts/android/getting-started
- 62. Build – GitHubとの連携 • 自分が編集したソースをGitHubへPush $ git add . $ git commit –m ‘App Secret を変更’ $ git push • アプリポータル画面からビルドを選択してGitHubを選択 62https://docs.microsoft.com/en-us/appcenter/quickstarts/android/build
- 63. Build – GitHubとの連携 • GitHubへのログインをおこない、対象のリポジトリを選択 63https://docs.microsoft.com/en-us/appcenter/quickstarts/android/build
- 64. Build – GitHubとの連携 • ブランチの一覧が表示されるのでmasterを選択 64https://docs.microsoft.com/en-us/appcenter/quickstarts/android/build
- 65. Build – ビルド設定（１／２） • Android Module • Build Variant • Build Script • 固定名のファイルを含めることで有効と なる • Build frequency • Pushごとにビルドするか否か • Automatically increment build number • ビルドごとにビルド番号を増加させるか否か • Run XCTest tests • ビルド時にXCTestをおこなうか否か • Lint source code • コードの静的解析(Lint)をおこなうか否か 65https://docs.microsoft.com/en-us/appcenter/quickstarts/android/build
- 66. Build – ビルド設定（２／２） • Environment variables • 環境変数を設定しビルドに反映できる • リポジトリに含められないものはここ で管理すべき • Sign builds • ビルド時に署名を付与するか否か • Test on a real device • 実機テストを実施するか否か • Distribute builds • ビルドを配信するか否か • Advanced • ビルドステータスバッジの有無 66https://docs.microsoft.com/en-us/appcenter/quickstarts/android/build
- 67. Build – Sign builds 署名設定 • Gradle内で署名はできるが、こ こで署名をした方がセキュア 67https://docs.microsoft.com/en-us/appcenter/quickstarts/android/build
- 68. Build – ビルド状態表示 68https://docs.microsoft.com/en-us/appcenter/quickstarts/android/build • 設定後、ビルドを走らせると以下のようにビルド状態を表示 Downloadボタンから以下 がダウンロード可能 ・Build ・logs
- 69. Test – ポータル 69https://docs.microsoft.com/en-us/appcenter/quickstarts/android/test ビルドの設定で「Test on a real device」を有効にしていたらテストが 成功していた。
- 70. Test – ローカル端末で準備 • AppCenterCLIのインストール $ npm install -g appcenter-cli • AppCenterにログイン $ appcenter login • プロジェクトフォルダに移動し てテスト用APKを作成 $ ./gradlew assembleDebug $ ./gradlew assembleDebugAndroidTest 70https://docs.microsoft.com/en-us/appcenter/quickstarts/android/test Node.js6.3以上の環境で以下を実行 Loginコマンドでブラウザが開くので AppCenterにログインして上記のコー ドをコピーし、端末に貼り付ける
- 71. Test – 端末の選択 • 以下を選択 • 機種 • OS 71https://docs.microsoft.com/en-us/appcenter/quickstarts/android/test 今回は Google Pixel 2 XL Android 8.1.0 を選択
- 72. Test – 設定 • 以下を選択 • Test Series • システム言語 • Test framework 72https://docs.microsoft.com/en-us/appcenter/quickstarts/android/test 今回のサンプルアプリではEspresso 用のテストが用意されているので、 それを選択する。
- 73. Test – 実行 • プロジェクトのフォルダで 画面上に出ているテストコ マンドを実行する。 • 「pathToEspressoBuildFol der」を「sampleapp- android/app/build/outputs /apkに読み変える。 • 「 pathToFile.apk」を 「app-debug- androidTest.apk」に置換し て実行する。 73https://docs.microsoft.com/en-us/appcenter/quickstarts/android/test
- 74. Test – テストすら実行されない 74https://docs.microsoft.com/en-us/appcenter/quickstarts/android/test ぐぬぬぬ • エラー文：The same apk was uploaded as app and test ビルド時の同時実行では成功していたのに．．．
- 75. Distribute • Androidの配信方法は３つ グループ配信 App Centerによる配信 登録したユーザにメールで通知 未登録のユーザにも配布できるリンクが作成可能 GooglePlayによる配信 API接続用のセキュリティトークンが必要 α、βテスト用の配信 Production用の配信 Intune Company Portal用の配信 75https://docs.microsoft.com/en-us/appcenter/quickstarts/android/distribute
- 79. Distribute – Group配信 79https://docs.microsoft.com/en-us/appcenter/quickstarts/android/distribute 届いたメールの Accept Invitaionを クリック Downloadをクリッ ク 警告が出てもOK この警告が出た際は セキュリティの設定 を変更して再度イン ストール アプリ 起動
- 81. Distribute – ストア配信 81https://docs.microsoft.com/en-us/appcenter/quickstarts/android/distribute iTunesConnectを選択 トークンを登録したら GooglePlayへ接続 Google Play Developer Consoleから払い出したAPI接 続用のセキュリティトークンが 必要
- 82. Distribute – ストア配信 82https://docs.microsoft.com/en-us/appcenter/quickstarts/android/distribute Alphaを選択 Publish to Storeをク リック
- 83. Distribute – ストア配信 83https://docs.microsoft.com/en-us/appcenter/quickstarts/android/distribute APKファイルのアッ プロード アップロード内容を確 認 リリースノートを記述 確認してPublish
- 84. • GooglePlayDeveloperCon soleであらかじめアプリ を作成し、手動で一度は バイナリをアップロード しないとAPI経由でのアッ プロードに成功しない Distribute – 失敗 84https://docs.microsoft.com/en-us/appcenter/quickstarts/android/distribute
- 87. Crashes – クラッシュ情報取得 • 登録方法はMainActivityに以下のコードを追加するのみ。 • クラッシュ情報がAppCenterに送信されるのはアプリ再起動後。 • サンプルではCrash appボタン実行でRuntime Exceptionをス ローしている。 87 https://docs.microsoft.com/en-us/appcenter/quickstarts/android/crashes
- 89. Push • Pushの実現に必要な条件 Firebase Cloud MessagingのSenderIDとServerKey アプリのソースにappcenter-pushを組み込む app/build.gradleappcenter-pushを追加 compile "com.microsoft.appcenter:appcenter-push:${appCenterSdkVersion}" MainActivityでSenderIdとPush.classを追加 89https://docs.microsoft.com/en-us/appcenter/quickstarts/android/push
- 91. Androidまとめ • アプリへの組み込みのポイント Build.gradleの編集 MainActivityへの初期化処理の追加 各イベントログ対象時のイベントの埋め込み • クラッシュログが送信されるのは再起動後 • ストアへの配信はAPKファイルのアップロードのみ リポジトリからやりたいなぁ • 実機テストはローカル側の設定に一癖ありそう 91
- 92. Why CI/CD 92
- 93. なぜ、CI/CDは必要？ • スノーフレークによる不具合を防ぐために必要 • 常に同一の条件でビルド・テスト・配信するためには、デベ ロッパーの開発環境では限界がある。 デベロッパーが２トラック以上いるチームでは、お互いの環境の差 異により不具合を発生させる可能性が高くなる。 • 環境が壊れてもすぐに復旧できるように環境設定はコード化 したい。⇒Infrastructure as Code • Visual Studio App Centerの環境設定はどうコード化すべき か？ APIベースで操作したらよいのではないか。 • そこで．．． 93
- 94. App Center Client (Preview) 94https://openapi.appcenter.ms/