この文章は Salesforce 機械翻訳システムを使用して翻訳されました。詳細はこちらをご参照ください。
英語に切り替える

JavaScript Remoting と静的 HTML

JavaScript Remoting と静的 HTML を組み合わせて、高度なパフォーマンスとユーザインターフェースを Salesforce モバイルアプリケーションに匹敵させ、ユーザの操作性を最大限に高めます。このアーキテクチャでは、JavaScript のページ要素のレンダリングが優先され、Visualforce タグの大半が回避されます。このオプションでは、開発者に最も高度な専門知識が求められ、標準の Visualforce または Visualforce と HTML の組み合わせよりも設定に多少時間がかかることがあります。Salesforce モバイルパックを使用すると、すぐに着手できるほか��最先端のモバイル Web アプリケーションテクノロジを活用できます。

この方法で設計された Visualforce ページは、要求-応答サイクルに対する制御が強化され、ページの再読み込みの代わりに JavaScript を使用したページの更新が優先されるため、標準の Visualforce の簡略化された自動機能の多くが使用されません。このアプローチはページのパフォーマンスを大幅に高めることができます。帯域幅が狭く、遅延の大きいワイヤレスネットワーク接続でモバイルデバイスを文字通りモバイルとして使用する場合は特に有効です。この方法の欠点は記述するコードが増えることで、Apex と Visualforce のほか、JavaScript、JavaScript Remoting、HTML5、ご使用のモバイルツールキット、CSS などの専門知識が必要です。一方、利点は、モバイル開発の最新鋭のツールを使用して作業できることと、この手法で構築したページにより、アプリケーションと完全統合するカスタム機能を最も適切で最も完璧な方法で組み込めることです。

デスクトップ用の Visualforce ページも、Salesforce モバイルアプリケーション用のページもこのアプローチで構築できます。さらに、このアプローチによるページは、スタイル設定をカスタマイズすれば 2 つの環境で共有することも可能です。ただし、Salesforce フルサイトのデザインに近づけることは容易なことではありません。最も重要なことは、設計するページの応答性を最大限に高められることと、幅広いデバイスやフォームファクタに適合させられることです。

このアプローチの Visualforce ページへの適用

Salesforce モバイルアプリケーションのページの作成にこのアプローチを採用する場合は、次の一般的なプロセスに従います。

  1. 任意の Salesforce Mobile パック (Salesforce で入手可) を静的リソースとして組織にインストールします。
  2. ページの docType を html-5.0 に設定します。標準のスタイルシートとヘッダーを無効にすることを強くお勧めします。次に例を示します。
  3. Visualforce リソースタグを使用して、選択したモバイルツールキットのスクリプトとスタイルをページに追加します。次に例を示します。
  4. HTML5 とモバイルツールキットのタグおよび属性を使用して、ページのスケルトンを作成します。
  5. Javascript 関数を、ユーザ操作に応答するハンドラとしてページに追加します。JavaScript Remoting を使用して、Apex @RemoteAction メソッドをコールします。このメソッドは、レコードの取得、DML の実行などを行います。
  6. ユーザアクションやページ更新を処理する Javascript 関数を追加します。HTML 要素を JavaScript で構築してから、ページのスケルトンに追加して、ページ更新を実行します。

JavaScript Remoting と静的 HTML ページの例

次のサンプルコードは、ユーザが倉庫レコードを編集できるようにする、Remoting と HTML を組み合わせた Visualforce ページを示します。編集機能は、JavaScript Remoting の要求に応答する @RemoteAction メソッドが設定されたコントローラ拡張によって提供されます。
静的 HTML には、空のフォーム項目など、ページのシェルが用意されています。Javascript 関数は、レコードを読み込み、フォーム項目に入力して、更新されたフォームデータを Salesforce に送り返します。

このページは、Salesforce フルサイトでも使用できますが、Salesforce アプリケーションページとして設計されているため、通常の Visualforce ページとはデザインがかなり異なります。

JavaScript Remoting と静的 HTML コントローラの例

モバイルページを作成する他の 2 つのアプローチとは異なり、Remoting + HTML のアプローチでは、標準のコントローラ機能を使用して Salesforce のデータを取得したり保存したりすることがありません。その代わりに、コントローラ拡張またはカスタムコントローラを作成して、ページに必要な @RemoteAction メソッドを追加します。上記のページをサポートする、簡略化されたコントローラ拡張は次のようになります。