Monacaでビルドするスタートアップガイド(iOS版)

46
Copyright © NIFTY Corporation All Rights Reserved. 【ハンズオン】 Monacaでビルド方法まとめ iOS版) ニフティ株式会社
  • date post

    08-Feb-2017
  • Category

    Software

  • view

    788
  • download

    2

Transcript of Monacaでビルドするスタートアップガイド(iOS版)

Page 1: Monacaでビルドするスタートアップガイド(iOS版)

Copyright © NIFTY Corporation All Rights Reserved.

【ハンズオン】

Monacaでビルド方法まとめ(iOS版)

ニフティ株式会社

Page 2: Monacaでビルドするスタートアップガイド(iOS版)

Copyright © NIFTY Corporation All Rights Reserved. 2

iOS向け実機ビルドにはApple Developer Program(有償)

への登録が必要です

https://developer.apple.com/jp/programs/方法1:【Monacaで設定】http://docs.monaca.mobi/cur/ja/manual/build/ios/build_ios/方法2:【Xcodeから移行】http://docs.monaca.mobi/cur/ja/manual/build/ios/import_export/

登録完了した方は以下にてログインhttps://developer.apple.com/membercenter/

Page 3: Monacaでビルドするスタートアップガイド(iOS版)

Copyright © NIFTY Corporation All Rights Reserved. 3

方法 1【Monacaで設定】http://docs.monaca.mobi/cur/ja/manual/buil

d/ios/build_ios/

Page 4: Monacaでビルドするスタートアップガイド(iOS版)

Copyright © NIFTY Corporation All Rights Reserved. 4

開発用証明書の発行(Developer Certificate)

開発用端末の登録

AppIDの作成

プロビジョニングプロファイル作成

※今回は【デバッグビルド】を主に説明していきます!そのため、「開発用証明書」と「プロビジョニングプロファイル」が必要になります。

Page 5: Monacaでビルドするスタートアップガイド(iOS版)

Copyright © NIFTY Corporation All Rights Reserved.

MONACAで秘密鍵と CSR の作成

Page 6: Monacaでビルドするスタートアップガイド(iOS版)

Copyright © NIFTY Corporation All Rights Reserved.

iOSビルド設定メニューにて

AppleIDと同じメールアドレスと名前を入力

Page 7: Monacaでビルドするスタートアップガイド(iOS版)

Copyright © NIFTY Corporation All Rights Reserved.

CSRをエックスポート(証明書を作成するために利用)

Page 8: Monacaでビルドするスタートアップガイド(iOS版)

Copyright © NIFTY Corporation All Rights Reserved.

DEVELOPER CENTERで証明書の作成

Page 9: Monacaでビルドするスタートアップガイド(iOS版)

Copyright © NIFTY Corporation All Rights Reserved.

デベロッパー / 開発用証明書を作成

Page 10: Monacaでビルドするスタートアップガイド(iOS版)

Copyright © NIFTY Corporation All Rights Reserved.

MonacaでエクスポートしたCSR ファイル をアップロードします。次に、 Generate ボタンをクリックします。

Page 11: Monacaでビルドするスタートアップガイド(iOS版)

Copyright © NIFTY Corporation All Rights Reserved.

生成した証明書をダウンロードする

Page 12: Monacaでビルドするスタートアップガイド(iOS版)

Copyright © NIFTY Corporation All Rights Reserved.

MONACAで証明書を登録する

Page 13: Monacaでビルドするスタートアップガイド(iOS版)

Copyright © NIFTY Corporation All Rights Reserved.

iOSビルド設定メニュー

Page 14: Monacaでビルドするスタートアップガイド(iOS版)

Copyright © NIFTY Corporation All Rights Reserved.

MONACAでアプリ設定

Page 15: Monacaでビルドするスタートアップガイド(iOS版)

Copyright © NIFTY Corporation All Rights Reserved. 15

MonacaでのiOSアプリ設定

メニュー「設定」→「iOSアプリ設定」

Page 16: Monacaでビルドするスタートアップガイド(iOS版)

Copyright © NIFTY Corporation All Rights Reserved. 16

MonacaでのiOSアプリ設定

メニュー「設定」→「iOSアプリ設定」

「AppID」を設定し、逆ドメイン形式がお勧め

App ID に、アスタリスク ( * ) を使用できません。

iOS の App ID に、アスタリスク ( * ) を使用できません。「 * 」 を使用した場合、 ビルドが失敗します。

Page 17: Monacaでビルドするスタートアップガイド(iOS版)

Copyright © NIFTY Corporation All Rights Reserved.

DEVELOPER CENTERでAPP ID作成

Page 18: Monacaでビルドするスタートアップガイド(iOS版)

Copyright © NIFTY Corporation All Rights Reserved.

こちらでクリックする!

https://developer.apple.com/membercenter

Page 19: Monacaでビルドするスタートアップガイド(iOS版)

Copyright © NIFTY Corporation All Rights Reserved. 19

新しいAppIDを作ります。※既存のものを使う場合はこの手順は不要です※ワイルドカードなIDは使えません

「iOS Apps」になっていることを確認しましょう!

Page 20: Monacaでビルドするスタートアップガイド(iOS版)

Copyright © NIFTY Corporation All Rights Reserved. 20

新しいAppIDを作ります。

アプリの説明(ascii文字で入力するのが無難です)

Page 21: Monacaでビルドするスタートアップガイド(iOS版)

Copyright © NIFTY Corporation All Rights Reserved. 21

新しいAppIDを作ります。

「Explicit App ID」を選択

「Bundle ID」を入力

※Wildcard AppIDはPush通知機能には利用不可能

Page 22: Monacaでビルドするスタートアップガイド(iOS版)

Copyright © NIFTY Corporation All Rights Reserved. 22

新しいAppIDを作ります。

「Continue」をクリック

Page 23: Monacaでビルドするスタートアップガイド(iOS版)

Copyright © NIFTY Corporation All Rights Reserved. 23

新しいAppIDが作られました。

Page 24: Monacaでビルドするスタートアップガイド(iOS版)

Copyright © NIFTY Corporation All Rights Reserved.

DEVELOPER CENTERで開発用端末の登録

Page 25: Monacaでビルドするスタートアップガイド(iOS版)

Copyright © NIFTY Corporation All Rights Reserved.

管理画面にてDevicesを選択する

「+」をクリック

Page 26: Monacaでビルドするスタートアップガイド(iOS版)

Copyright © NIFTY Corporation All Rights Reserved.

Nameにはデバイス名、UUIDにはデバイスのUUIDを追加

※デバイスのUUIDの確認方法:

iTunes>デバイスを開き、表示するシリアルをクリックすると、UUIDが表示される

Page 27: Monacaでビルドするスタートアップガイド(iOS版)

Copyright © NIFTY Corporation All Rights Reserved.

DEVELOPER CENTERで開発用 プロビジョニングプロファイルを作成

Page 28: Monacaでビルドするスタートアップガイド(iOS版)

Copyright © NIFTY Corporation All Rights Reserved.

iOS App Developmentを選択し、「Continue」を選択する

Page 29: Monacaでビルドするスタートアップガイド(iOS版)

Copyright © NIFTY Corporation All Rights Reserved.

Page 30: Monacaでビルドするスタートアップガイド(iOS版)

Copyright © NIFTY Corporation All Rights Reserved.

プロビジョニングプロファイルを作成完了!

プロビジョニングプロファイルをダウンロード

Page 31: Monacaでビルドするスタートアップガイド(iOS版)

Copyright © NIFTY Corporation All Rights Reserved.

MONACAでアプリビルドにプロビジョニングプロファイルをアップロード

Page 32: Monacaでビルドするスタートアップガイド(iOS版)

Copyright © NIFTY Corporation All Rights Reserved.

Page 33: Monacaでビルドするスタートアップガイド(iOS版)

Copyright © NIFTY Corporation All Rights Reserved.

作成したプロビジョンニングプロファイルを選択

Page 34: Monacaでビルドするスタートアップガイド(iOS版)

Copyright © NIFTY Corporation All Rights Reserved. 34

方法 2【Xcodeから移行】http://docs.monaca.mobi/cur/ja/manual/buil

d/ios/import_export/

Page 35: Monacaでビルドするスタートアップガイド(iOS版)

Copyright © NIFTY Corporation All Rights Reserved. 35

キーチェーンアクセスで秘密鍵と証明書のエクスポート

開発用端末の登録

AppIDの作成

プロビジョニングプロファイル作成

Monacaで秘密鍵と証明書のインポート

Page 36: Monacaでビルドするスタートアップガイド(iOS版)

Copyright © NIFTY Corporation All Rights Reserved.

キーチェーンアクセスで証明書・秘密鍵をインポート

Page 37: Monacaでビルドするスタートアップガイド(iOS版)

Copyright © NIFTY Corporation All Rights Reserved. 37

秘密鍵の作成

マックで、アプリケーション > ユーティリティ > キーチェーンアクセス を選択

Page 38: Monacaでビルドするスタートアップガイド(iOS版)

Copyright © NIFTY Corporation All Rights Reserved. 38

エクスポートする証明書を右クリックして、「 証明書名 」 を書き出す... を選択

秘密鍵の作成

Page 39: Monacaでビルドするスタートアップガイド(iOS版)

Copyright © NIFTY Corporation All Rights Reserved. 39

フォーマットは「個人情報交換p12」確認し、保存

秘密鍵の作成

Page 40: Monacaでビルドするスタートアップガイド(iOS版)

Copyright © NIFTY Corporation All Rights Reserved. 40

証明書のエクスポート

Page 41: Monacaでビルドするスタートアップガイド(iOS版)

Copyright © NIFTY Corporation All Rights Reserved. 41

証明書のエクスポート

エクスポートしたい証明書を右クリックして Export 証明書名 を選択します。次に、エクスポート画面が表示

Page 42: Monacaでビルドするスタートアップガイド(iOS版)

Copyright © NIFTY Corporation All Rights Reserved. 42

証明書のエクスポート

フォーマットは「証明書Certificate .cer」確認し、保存

Page 43: Monacaでビルドするスタートアップガイド(iOS版)

Copyright © NIFTY Corporation All Rights Reserved.

MONACAで証明書・秘密鍵をインポート

Page 44: Monacaでビルドするスタートアップガイド(iOS版)

Copyright © NIFTY Corporation All Rights Reserved. 44

秘密鍵をインポートする

Page 45: Monacaでビルドするスタートアップガイド(iOS版)

Copyright © NIFTY Corporation All Rights Reserved. 45

証明書をアップロード

.cerファイルを選択し、アップロードする

Page 46: Monacaでビルドするスタートアップガイド(iOS版)

Copyright © NIFTY Corporation All Rights Reserved. 46