モバイルアプリケーションのビルド building-mobile-applications

CAUTION
AEM 6.4 の拡張サポートは終了し、このドキュメントは更新されなくなりました。 詳細は、 技術サポート期間. サポートされているバージョンを見つける ここ.
NOTE
Adobeは、単一ページアプリケーションのフレームワークベースのクライアントサイドレンダリング(React など)を必要とするプロジェクトでは、SPA Editor を使用することをお勧めします。 詳細情報を参照してください。

アプリケーションをビルドして、テスト用またはアプリストアに公開用に、デバイスまたはシミュレーターにインストールします。 PhoneGap コマンドラインインターフェイスを使用して、またはPhoneGap Buildを使用してクラウド内で、アプリケーションをローカルに構築できます。

GitHub から入手可能なコードを使用してモバイルアプリケーションを構築する方法に関する詳細な手順記事を利用できます ここ.

パブリッシュインスタンスへのアプリの移動 moving-the-application-to-the-publish-instance

アプリケーションファイルをパブリッシュインスタンスに移動して、インストールされているモバイルアプリケーションのインスタンスにコンテンツの更新を提供し、公開されたコンテンツを使用してアプリを構築できるようにします。 アプリケーションは、リポジトリ内の 2 つのノードブランチで構成されます。

  • /content/phonegap/apps/<application name>:作成者が作成およびアクティブ化する Web ページ。
  • /content/phonegap/content/<application name>:アプリケーション設定ファイルとコンテンツ同期設定。
NOTE
アプリケーションファイルをパブリッシュインスタンスに移動しないと、コンテンツ作成者はコンテンツ同期キャッシュを更新できません。

必要なのは、 /content/phonegap/content/<application name> パブリッシュインスタンスにブランチします。 のファイル /content/phonegap/apps/<application name> ブランチは、作成者がページをアクティベートすると移動されます。

AEMには、コンテンツを一括でパブリッシュインスタンスに移動する方法が 2 つ用意されています。

例えば、phonegapapp という名前のモバイルアプリケーションが作成されます。 次のノードをパブリッシュインスタンスに移動する必要があります。/content/phonegap/content/phonegapapp.

ヒント: パッケージをオーサーインスタンスからパブリッシュインスタンスに移動するには、パッケージで「レプリケート」コマンドを使用します。

chlimage_1-16

PhoneGap コマンドラインインターフェイスを使用した構築 building-using-the-phonegap-command-line-interface

PhoneGap コマンドラインインターフェイス (CLI) を使用して、コンピューター上で PhoneGap アプリケーションをコンパイルします。 AEMコンテンツをアプリケーションに含めるために、AEMは、モバイルアプリケーションのコンテンツ、コンテンツ同期設定、その他の必要なアセットを含む ZIP ファイルを作成します。 ZIP ファイルをダウンロードして、ビルドに含めます。

ビルド環境の準備 preparing-your-build-environment

PhoneGap CLI を使用してビルドするには、Node.js と PhoneGap クライアントユーティリティをインストールする必要があります。 次の手順を実行するには、インターネット接続が必要です。

  1. ダウンロードとインストール Node.js.

  2. ターミナルまたはコマンドプロンプトを開き、次のノードコマンドを入力して PhoneGap ユーティリティをインストールします。

    code language-shell
    npm install -g phonegap
    

    UNIX または Linux システムでは、コマンドの先頭にを付ける必要がある場合があります。 sudo.

    端末は、一連の HTTPGETコマンドの結果を示します。 インストールが正常に完了すると、次の例のように、ターミナルはライブラリのインストール先を示します。

    code language-xml
    /usr/local/bin/phonegap -> /usr/local/lib/node_modules/phonegap/bin/phonegap.js
    phonegap@3.3.0-0.19.6 /usr/local/lib/node_modules/phonegap
    ├── pluralize@0.0.4
    ├── colors@0.6.0-1
    ├── semver@1.1.0
    ├── qrcode-terminal@0.9.4
    ├── shelljs@0.1.4
    ├── optimist@0.6.0 (...)
    ├── prompt@0.2.11 (...)
    ├── phonegap-build@0.8.4 (...)
    ├── connect-phonegap@0.8.1 (...)
    └── cordova@3.3.0-0.1.1 (...)
    
  3. (オプション)ターゲットとするモバイルプラットフォーム用の SDK を取得します。

    • iOSプラットフォーム用のアプリを作成するには、最新バージョンのをインストールしてください Xcode.
    • Android アプリを作成するには、 Android SDK.

コンテンツ ZIP ファイルのダウンロード downloading-the-content-zip-file

モバイルアプリケーションのコンテンツをファイルシステムに移動します。

  1. モバイルアプリケーションページで、アプリケーションを選択します。

  2. (オプション)完全なインストール用のアプリケーションを構築するには、ツールバーで、「キャッシュをクリア」アイコンをクリックまたはタップします。

    note note
    NOTE
    キャッシュには、インストールされたアプリケーションのコンテンツの更新が格納されます。 キャッシュをクリアすると、キャッシュされたすべての更新が無効になります。
  3. ツールバーの「 CLI Assets をダウンロード」アイコンをクリックまたはタップします。

  4. ZIP ファイルを保存したら、成功ダイアログの「閉じる」をクリックします。

  5. ZIP ファイルの内容を抽出します。

PhoneGap CLI を使用したビルド using-the-phonegap-cli-to-build

PhoneGap CLI を使用して、アプリケーションをコンパイルしてインストールします。 PhoneGap CLI の使用方法について詳しくは、 PhoneGap コマンドラインインターフェイス ドキュメント。

  1. ターミナルまたはコマンドプロンプトを開き、現在のディレクトリをダウンロードしたアプリケーションの ZIP ファイルに変更します。 例えば、次の例では、ディレクトリが ng-app-cli.1392137825303.zip ファイルに変更されます。

    code language-shell
    cd ~/Downloads/ng-app-cli.1392137825303
    
  2. ターゲットとするプラットフォームの phonegap コマンドを入力します。 例えば、次のコマンドを実行すると、Android 用のアプリが構築されます。

    code language-shell
    phonegap build android
    

PhoneGap Buildを使用したビルド building-using-phonegap-build

PhoneGap クラウドサービスを使用してアプリを構築します。 この手順を実行するには、まずPhoneGap Build設定を作成する必要があります。

PhoneGap Build に接続しています connecting-to-phonegap-build

AEM内でPhoneGap Buildサービスを使用できるようにPhoneGap Build設定を作成します。 モバイルアプリケーションの構築に使用するPhoneGap Buildアカウントのユーザー名とパスワードを指定します。

  1. ツールページを開きます。 (http://localhost:4502/tools.html).

  2. 「CQ Operations」領域で、「Cloud Services」をクリックします。

  3. 「今すぐ設定」リンクをクリックして、PhoneGap Buildを表示します。

    chlimage_1-17

  4. 設定を作成ダイアログで、Title プロパティの値を入力します。 既定では、Name プロパティの値はタイトルから派生しますが、名前を入力することもできます。 「作成」をクリックします。

  5. [PhoneGap Buildの設定 ] ダイアログで、PhoneGap Buildのユーザ名とパスワードを入力し、[OK] をクリックします。

PhoneGap Buildの使用 using-phonegap-build

様々なモバイルプラットフォーム向けにをコンパイルするために、アプリケーションリソースをPhoneGap Buildに送信します。

  1. モバイルアプリケーションページで、モバイルアプリケーションを開きます。 (http://localhost:4502/mobile.html/content/phonegap)

  2. (オプション)完全なインストール用のアプリケーションを構築するには、アプリケーションを選択し、キャッシュをクリアアイコンをクリックします。

    note note
    NOTE
    キャッシュには、インストールされたアプリケーションのコンテンツの更新が格納されます。 キャッシュをクリアすると、キャッシュされたすべての更新が無効になります。
  3. スプラッシュページを選択し、「リモートビルド」アイコンをクリックします。

    注意: ビルドが正常に完了した場合、AEM Beta バージョンではインボックス通知が作成されません。

  4. 成功ダイアログボックスで、「PhoneGap Build」をクリックしてAdobe PhoneGap Buildページを開きます。 https://build.phonegap.com/apps. アプリが表示されるのを待っている場合は、 PhoneGap Buildステータス ページ。

    ビルドのインストールについて詳しくは、 PhoneGap Build文書.

    note note
    NOTE
    無料のPhoneGap Buildアカウントは、1 つのプライベートアプリケーションで使用できます。 追加のプライベートアプリケーションを作成する場合、PhoneGap ビルドは失敗します。

次の手順 the-next-steps

構築プロセスの次の手順は、 アプリの構造.

recommendation-more-help
547b817b-14b5-4d82-aa0f-a64750e0e592