私たちのアプリでは、永続性をsessionStorageに依存しています。ただし、モバイルSafariでは、プライベートモードでブラウジングしている場合、sessionStorageは使用できません。
ただし、Safariをプライベートモードで使用しているお客様は、メモリ内アプローチに切り替えてもかまいません。私たちのアプリは引き続きある程度使用可能です(ブラウザーを更新するとデータが失われますが、シングルページアプリケーションであるため、とにかく更新する必要はありません)。
開発モードでは、修正は非常に簡単でした。しかし、本番ビルドを実行した後、私は大きな問題に直面しました。
したがって、コードは千の言葉の価値があります。現在使用しているものは次のとおりです。
index.html
//...
<script type="text/javascript">
var isSessionStorageAvailable = true;
var storage = window.sessionStorage;
if (typeof window.sessionStorage == 'undefined' || window.sessionStorage === null) {
isSessionStorageAvailable = false;
} else try {
storage.setItem('__ccTest', '__ccTest');
} catch (err) {
isSessionStorageAvailable = false;
}
</script>
<script id="microloader" type="text/javascript" src="../sencha/microloader/development.js"></script>
//...
myStore.js
Ext.define('App.store.Quote', {
extend: 'Ext.data.Store',
requires: ['App.model.QuoteItem','Ext.data.proxy.SessionStorage'],
config :{
model: 'App.model.QuoteItem',
autoLoad: true,
autoSync: true,
identifer: 'uuid',
proxy:{
type: isSessionStorageAvailable ? 'sessionstorage' : 'memory',
id:'ccCart'
}
},
//...
したがって、sencha getがロードされる前に、まずsessionStorageをチェックし、グローバル変数を設定します。したがって、ストアファイルがロードされるときに、適切な構成が選択されます。
ただし、index.htmlファイルを変更する必要があったため、このソリューションは本当に嫌いです。開発モードでは、他のすべてのファイルが後でロードされるため、app.jsファイルのどこにでもこのチェックを書き込むことができます。しかし、本番環境ではそうではありません。では、index.htmlファイルを変更せずにそれを適切に行うにはどうすればよいでしょうか。
アップデート
私もこのようなアプライヤーを使おうとしました:
applyProxy: function(proxy, oldProxy){
proxy.type = 'sessionstorage';
var storage = window.sessionStorage;
if (typeof window.sessionStorage == 'undefined' || window.sessionStorage === null) {
proxy.type = 'memory';
} else try {
storage.setItem('__ccTest', '__ccTest');
} catch (err) {
proxy.type = 'memory';
}
this.callParent([proxy, oldProxy]);
}
ただし、一部のコードがこのストアでsync()を初めて呼び出すと、senchaフレームワーク内でエラーが発生します。
これは、この行のストアクラスのsyncメソッド内にあります(縮小されたソースからのものです、申し訳ありません):
d.getProxy().batch({operations: b,listeners: d.getBatchListeners()})
getProxy()がundefinedを返すため、エラーが発生します。したがって、アプライヤーが機能しなかったかのようです:(。