19 オフライン機能をアプリケーションに追加
Visual Builderで作成するアプリケーションは、デバイスがネットワークから切断されている場合でも機能できます。 これを行うには、アプリケーションがオフライン・サポートのためにクライアント上のデータをキャッシュできるOracle Offline Persistence Toolkitを使用します。
ビジネス・オブジェクトを使用してアプリケーション・データを形成する場合は、オブジェクト・キャッシュ設定を利用して、クライアント上のビジネス・オブジェクトから読み取られたデータをキャッシュできます。 詳細は、「ビジネス・オブジェクトのデータ・キャッシュの制御」を参照してください。
Oracle Offline Persistence Kitを使用したオフライン・サポートの追加
Oracle Offline Persistence Toolkitがクライアント側のJavaScriptライブラリで、アプリケーションへのオフライン・サポートを提供します。
HTTPリクエスト・レイヤーでのオフライン・サポートのキャッシュを有効にします。 このサポートは、ユーザーに対して透過的で、フェッチAPIおよびXHRアダプタを使用して実行されます。 クライアントまたはクライアント・デバイスがオフラインになっている間に行われたHTTPリクエストは、サーバーへの接続が回復されると、リプレイのために取得されます。 追加機能には、永続ストレージ・レイヤー、同期マネージャ、バイナリ・データ・サポート、およびデフォルトの動作をカスタマイズするための様々な構成APIが含まれます。 このツールキットは、Webアプリケーション内におけるServiceWorkerコンテキストと非ServiceWorkerコンテキストの両方で使用できます。
ツールキットを使用すると、次の操作のためにアプリケーションを構成できます:
- 接続が使用できない場合、オフラインでの読取り用のコンテンツをダウンロードします。
たとえば、アプリケーションに、接続が使用できない顧客サイトで営業担当がダウンロードして読み取ることのできる製品在庫データを含めることができます。
- パフォーマンスを向上させるためのコンテンツをキャッシュします。
- 接続が使用できないダウンロード済コンテンツに対してトランザクションを実行し、接続が戻ったときにトランザクションをアップロードします。
たとえば、営業担当はインターネットにアクセスできないサイトにアクセスして、いくつかの製品アイテムのオーダーを入力できます。 接続が戻されると、アプリケーションはトランザクションをサーバーに自動的に送信できます。
- オフライン・データをサーバーとマージできない場合は、競合の解決を提供してください。
営業担当のリクエストが使用可能な在庫量を超えた場合、アプリケーションでは、営業担当にオーダーの取消またはバック・オーダーの品目の発行を求めるメッセージを構成できます。
Cache-Control HTTPヘッダーにno-cacheまたはno-store値のいずれも含めないでください。これらの値により、アプリケーションでツールキットが動作しなくなります。 アプリケーションの接続先のRESTサービスの管理者と協力して、Cache-Control HTTPヘッダー内の値が適切に構成されるようにします。
ノート:
ビジネス・オブジェクトのデータ・キャッシュはデフォルトで無効になっています。各オブジェクト・リソース・キャッシュ制御設定はSensitiveとして定義されています。 このデフォルト・オプションは、no-cacheとno-storeの値を組み合せてデータ・キャッシュを無効にします。 Oracleオフライン永続性ツールキットを使用してオフライン・サポートのデータ・キャッシュを有効にする前に、アプリケーション・ビジネス・オブジェクトで使用されるデータ・キャッシュ戦略を確認します。 「データ・キャッシュ戦略の定義」を参照してください。
app-flow.jsファイルを更新して、キャッシュするアプリケーションのデータの範囲を決定するOfflineHandler()関数、使用するツールキットからのキャッシュ方法のタイプなどを含めます。 次のコメント付きapp-flow.jsファイルは、アプリケーションでのオフライン機能のキャッシュの実装に関するシナリオの一例を示しています。 このファイルは、ツールキットを使用するアプリケーションの開発中にツールキットのロギング機能を有効にする方法も示します。 開発フェーズでこのタイプのロギングを有効にすると、アプリケーションでツールキットがオフラインでキャッシュするデータを理解するのに役立ちます。 本番環境でアプリケーションを公開する準備ができたら、ロギング機能を無効にします。 define([
'vbsw/helpers/serviceWorkerHelpers',
/**
* Add the following entries to include the toolkit classes that you'll use. More information about these
* classes can be found in the toolkit's API doc. See the link to the API doc in the paragraph before
* this sample file.
*
*/
'persist/persistenceManager',
'persist/defaultResponseProxy',
'persist/fetchStrategies',
/**
* Add the following entry to enable console logging while you develop your app with the toolkit.
*/
'persist/impl/logger'
],
(ServiceWorkerHelpers, PersistenceManager, DefaultResponseProxy, FetchStrategies, Logger) => {
'use strict';
class AppModule {
}
var OfflineHandler = function () {
/**
* Enable console logging of the toolkit for development testing
*/
Logger.option('level', Logger.LEVEL_LOG);
Logger.option('writer', console);
var options = {
/**
* The following code snippets implements the toolkit's CacheFirstStrategy. This strategy
* checks the application's cache for the requested data before it makes a request to cache
* data. The code snippet also disables the background fetch of data.
*/
fetchStrategy: FetchStrategies.getCacheFirstStrategy({
backgroundFetch: 'disabled'
}),
};
this._responseProxy = DefaultResponseProxy.getResponseProxy(options);
};
OfflineHandler.prototype.handleRequest = function(request, scope) {
/**
* (Optional). Write output from the OfflineHandler to your browser's console. Useful to help
* you understand the code that follows.
*/
console.log('OfflineHandler.handleRequest() url = ' + request.url + ' cache = ' + request.cache +
' mode = ' + request.mode);
/**
* Cache requests where the URL matches the scope for which you want data cached.
*/
if (request.url.match(
'http://localhost:1988/webApps/ifixitfaster/api')) {
return this._responseProxy.processRequest(request);
}
return PersistenceManager.browserFetch(request);
};
OfflineHandler.prototype.beforeSyncRequestListener = (event) => {
return Promise.resolve();
};
OfflineHandler.prototype.afterSyncRequestListener = (event) => {
return Promise.resolve();
};
AppModule.prototype.createOfflineHandler = () => {
/** Create the OfflineHandler that makes the toolkit cache data URLs */
return Promise.resolve(new OfflineHandler());
};
AppModule.prototype.isOnline = () => {
return ServiceWorkerHelpers.isOnline();
};
AppModule.prototype.forceOffline = (flag) => {
return ServiceWorkerHelpers.forceOffline(flag).then(function () {
/** if online, perform a data sync */
if (!flag) {
return ServiceWorkerHelpers.syncOfflineData();
}
return Promise.resolve();
}).catch(function (error) {
console.error(error);
});
};
return AppModule;
});Oracleは、永続性ツールキットをオープンソース・プロジェクトとして保持します。 ツールキットの使用方法の詳細は、README.mdおよびWikiのGithubの永続ツールキットに関する情報(https://github.com/oracle/offline-persistence-toolkit)を参照してください。 ツールキットのAPIドキュメントは前述のGithubページからリンクされていますが、https://oracle.github.io/offline-persistence-toolkit/index.htmlから直接アクセスすることもできます。