5.8.5 プログレッシブWebアプリケーション属性の構成

「プログレッシブWebアプリケーション」ページを使用して、新規と既存の両方のプログレッシブWebアプリケーション・アプリケーションに対して属性を構成します。

ヒント:

プログレッシブWebアプリケーション属性は、「アプリケーション定義」、「プロパティ」、「簡易URL」属性が「オン」の場合にのみ表示されます。

• 「プログレッシブWebアプリケーション」ページへのアクセス
  「プログレッシブWebアプリケーション」ページには、アプリケーションのホームページからアクセスします。
• 「プログレッシブWebアプリケーション」ページ
  「プログレッシブWebアプリケーション」ページは、「一般」、「外観」および「サービス構成」の各セクションに分かれています。

関連項目:

プログレッシブWebアプリケーション(PWA)の作成

5.8.5.1 「プログレッシブWebアプリケーション」ページへのアクセス

「プログレッシブWebアプリケーション」ページには、アプリケーションのホームページからアクセスします。

「プログレッシブWebアプリケーション」ページにアクセスするには:

1. ワークスペースのホームページで、「アプリケーション・ビルダー」アイコンをクリックします。
2. アプリケーションを選択します。

   アプリケーションのホームページが表示されます。

3. アプリケーションのホームページから、ユーザー・インタフェース・ページに、次の2通りの方法でアクセスできます。
   • 「アプリケーション定義の編集」ボタン:

     1. アプリケーション名の右側にある「アプリケーション定義の編集」をクリックします。

     2. 「プログレッシブWebアプリケーション」タブをクリックします。

   • 「共有コンポーネント」からの場合:

     1. 「共有コンポーネント」をクリックします。

     2. 「ユーザー・インタフェース」で、「プログレッシブWebアプリケーション」をクリックします。

   ユーザー・インタフェース・ページが表示されます。

4. 対象となる属性を編集します。
5. 「変更の適用」をクリックして、変更を保存します。

5.8.5.2 「プログレッシブWebアプリケーション」ページ

「プログレッシブWebアプリケーション」ページは、「一般」、「外観」および「サービス構成」の各セクションに分かれています。

ヒント:

このページの属性についてさらに学習するには、フィールドレベル・ヘルプを参照してください。

• 一般
  
• 外観
  
• サービス・ワーカー構成
  

5.8.5.2.1 一般

ヒント:

プログレッシブWebアプリケーション属性は、「アプリケーション定義」、「プロパティ」、「簡易URL」属性が「オン」の場合にのみ表示されます。「プロパティ」の簡易URLを参照してください。

一般属性は、プログレッシブWebアプリケーション・アプリケーションの構成を有効または無効にする場合に使用します。

表5-20 「プログレッシブWebアプリケーション」、「一般」

属性	説明	さらに学習するには
一般	「プログレッシブWebアプリケーション」機能を有効にします。 このオプションを有効にすると、次のことが可能になります: 拡張キャッシュを使用して静的ファイルをより効率的に処理します。 宣言的プログレッシブWebアプリケーション設定の表示を有効にします。	「プログレッシブWebアプリケーション(PWA)の作成」を参照してください
インストール可能	「プログレッシブWebアプリケーションの有効化」が「オン」の場合にのみ表示されます。 プログレッシブWebアプリケーションをデバイスにインストールできます。プログレッシブWebアプリケーションをインストールすると、ネイティブ・アプリケーションと同様にデバイスのホーム画面にアイコンが追加されます。このオプションを有効にすると、次のことが可能になります: 新しいナビゲーション・バー・エントリInstall Appを追加します。 ユーザーは、APEXアプリケーションをデバイスにインストールできるようになります。	「プログレッシブWebアプリケーション(PWA)の作成」を参照してください

5.8.5.2.2 外観

ヒント:

外観属性は、「プログレッシブWebアプリケーション」の一般属性である「プログレッシブWebアプリケーションの有効化」および「インストール可能」が「オン」の場合にのみ表示されます。

外観属性は、表示、画面の向き、テーマ・カラー、背景色、IOSステータス・バー・スタイル、アプリケーションの説明およびカスタム・マニフェストについて属性を構成する場合に使用します。

表5-21 「プログレッシブWebアプリケーション」、「外観」

属性	説明	さらに学習するには
表示	アプリケーションの優先表示モードを選択します。このオプションは、ユーザーに表示されるブラウザUIがどの程度かを制御します。オプションは次のとおりです。 全画面: ブラウザUIなしでPWAを開きます。このオプションは、画面またはウィンドウの全体を使用します。 スタンドアロン: スタンドアロン・アプリケーションのように見えるようPWAを開きます。アプリケーションは、ブラウザとは別の異なるウィンドウで実行されます。URLバーやボタンなどの標準のブラウザUIコンポーネントは表示されません。 最小のUI: スタンドアロンと同様ですが、ブラウザの制御ナビゲーション・ボタン(「戻る」、「リフレッシュ」など)は除きます。 ブラウザ: 通常のブラウザUIでPWAを開きます。 ノート: 一部のデバイスおよびブラウザではこの属性が無視されます。Oracle APEXでは、プログレッシブWebアプリケーションを適切に処理するデバイスにのみこの情報を中継します。詳細は、https://web.dev/add-manifest//を参照してください。	「プログレッシブWebアプリケーション(PWA)の作成」を参照してください
画面の向き	このプログレッシブWebアプリケーションを使用するときに優先される画面の向きを選択します。このオプションは主にモバイル・デバイスに適用されます。 ノート: 一部のデバイスおよびブラウザではこの属性が無視されます。APEXでは、プログレッシブWebアプリケーションを適切に処理するデバイスにのみこの情報を中継します。	「プログレッシブWebアプリケーション(PWA)の作成」を参照してください
テーマ・カラー	アプリケーションのデフォルトのテーマ・カラーを定義します。 この属性は、オペレーティング・システムがアプリケーションを表示する方法に影響します(たとえば、Androidのタスク・スイッチャの場合、このテーマ・カラーで囲まれます)。 ノート: 一部のデバイスおよびブラウザではこの属性が無視されます。Oracle APEXでは、プログレッシブWebアプリケーションを適切に処理するデバイスにのみこの情報を中継します	「プログレッシブWebアプリケーション(PWA)の作成」を参照してください
背景色	背景色を選択します。 バックグラウンド・カラーは、スタイルシートがロードされる前にアプリケーションに表示するプレースホルダのバックグラウンド・カラーを定義します。したがって、バックグラウンド・カラーは、Webアプリケーションの起動とアプリケーション・コンテンツのロードのスムーズな移行のために、テーマ本体のバックグラウンド・カラーと一致する必要があります。 これは、オペレーティング・システムがアプリケーションを表示する方法に影響します(たとえば、Androidのタスク・スイッチャの場合、このテーマ・カラーで囲まれます)。 ノート: 一部のデバイスおよびブラウザではこの属性が無視されます。Oracle APEXでは、プログレッシブWebアプリケーションを適切に処理するデバイスにのみこの情報を中継します	「プログレッシブWebアプリケーション(PWA)の作成」を参照してください
iOSステータス・バー・スタイル	プログレッシブWebアプリケーションのiOSステータス・バーのスタイルを決定します。Appleには、次の3つの異なる選択肢があります。 黒いテキストと白い背景 黒いテキストと黒い背景: このオプションを選択すると、完全に黒く表示されます 半透明: このオプションでは、白いテキストの背景色がWebアプリケーションの本体と同じになります。明るい背景色を使用する場合でも、テキストの色は白のままです。半透明を使用する場合、ページのコンテンツは画面全体に表示されます。	「プログレッシブWebアプリケーション(PWA)の作成」を参照してください
アプリケーションの説明	アプリケーションの動作について説明します。この属性は、アプリケーションのインストールを求められたときに、ユーザーに詳細情報を提供する場合に使用します。	「プログレッシブWebアプリケーション(PWA)の作成」を参照してください
カスタム・マニフェスト	Webアプリケーション・マニフェスト・ファイルの追加のJSONプロパティを格納するために使用されます。ここで見つかったプロパティは、既存のプロパティをオーバーライドするか、新しいプロパティを追加することで、前述の宣言オプションを拡張するために使用されます。	「プログレッシブWebアプリケーション(PWA)の作成」を参照してください カスタム・マニフェストの構築の詳細は、Webアプリケーション・マニフェストの仕様(https://www.w3.org/TR/appmanifest/)を参照してください。

5.8.5.2.3 サービス・ワーカー構成

サービス・ワーカー構成属性は、サービス・ワーカーを構成する場合に使用します。サービス・ワーカーは、アプリケーションが使用中でない場合でもコードを実行できるJavaScriptファイルです。

サービス・ワーカーは、リソースのフェッチや通知の処理などのイベントをリスニングできます。サービス・ワーカーはフックを使用するか、イベントを完全に置換することで変更できます。

サービス・ワーカーのオプションは、次のとおりです。

• デフォルト: 次の方法で、APEXエンジンによって生成されます。

  • サービス・ワーカーをインストールしてアクティブにします

  • キャッシュが存在する場合、キャッシュからリソースを提供します

  • それ以外の場合は、ネットワークから提供し、リソースをキャッシュに挿入します。

  • ネットワークに障害が発生した場合、オフライン・ページを提供します

• フックの構成: プレースホルダをサービス・ワーカー・コードに入力して独自のものを追加します。フックの場所は、Oracle APEXによって指定されます。このオプションを使用すると、「構成のダウンロード」を選択し、ファイルURLとして使用できます。

• ファイルURL: サービス・ワーカー・フック・インタフェースが含まれるファイルへのURL参照を指定します。これは、複数のアプリケーション間でサービス・ワーカー・フックを共有する場合に便利です。ファイル参照を使用する場合は、インタフェース・アーキテクチャに適切に従うようにしてください。そうしないと、サービス・ワーカーは実行時に障害が発生します。

  インタフェース構造を表示するには、この属性のフィールドレベル・ヘルプを参照してください。