2010-11-20 6 views
5

モバイルデバイスでオフラインで実行するための基本的なパスワードマネージャタイプのWebアプリケーションを作成しました(第4世代iPod Touchでのテスト)。私はホームスクリーンにこのアプリを追加した。それはiPodがオンラインで、サーバーにアクセスできる間はすべて正常に機能する。私は、iPodをオフラインに入れたら、私はアプリを開くと、以下のダイアログが起動します:iPodでオフラインで作業するWebアプリケーションを取得できません

でき、それがインターネット

に接続されていないためPwdThingを開くことができませんでした

ないオープンPwdThingアプリ(passwordthing.html)のための単一の静的HTMLファイルは、マニフェストファイルを指す:

<html manifest="cache.manifest"> 
... 

ファイルにtext/cache-manifestを務めするように設定されて

CACHE MANIFEST 
passwordthing.html 
passwordthing.js 
... 

そしてcache.manifestファイル:ファイルには、(jQuery Mobileファイルを含む)のアプリが使用するすべてのファイルが含まれて

AddType text/cache-manifest .manifest 

をすべてソースファイルはGithub(筆記時のバージョンはthis commit)です。私もpublic serverからインストールしています。

私のアプリをオフラインで動作させることができないのはなぜですか?

+2

キャッシングエラーが発生しているかどうかを確認するには、アプリでChromeをポイントする必要があります。 – hvgotcodes

+0

@hvgotcodesキャッシングエラー(ファイル名が間違っています)が見つかりました。あなたのコメントごとに新しい回答を追加できる場合、私はそれを受け入れます:-) –

+0

完了 - すべてのリリースで常にマニフェスト名を変更したいことがあります。そうしないと、ファイルが変更される可能性がありますが、名前は変わらず、更新されません。 – hvgotcodes

答えて

2

私が考えることができるのは、ファイルを変更していないことと、モバイルSafariがマニフェストの古いバージョンをキャッシュしていることだけです。マニフェストにコメントを追加するまた、マニフェストファイル自体の名前を変更することもできます。私はキャッシュに私のIPadを得るためにそれをしなければならなかった - 私はアプリケーションを更新するたびに、マニフェストの名前を変更して日付を含めるようにする。

iOS4.2には、はるかに優れたマニフェストサポートがあることに注意してください。外出時に物事が改善するかもしれません。

編集 - または判明しているとおり、悪いファイル名です。 ;)(問題のコメントを参照)。

私はデバッグHTML5のオフラインアプリが苦痛であることが判明:

+0

ありがとう、マニフェストファイル名を変更しようとしましたが、違いはありません:-( –

+0

@benあなたはChromeでアプリケーションを読み込み、コンソールを見ましたか? – hvgotcodes

1

[]は、それがここで適用される場合がありますので、[以下my answer from hereを複製します]。私は、この記事のコードは、私は私のアプリで間違っていたかを把握助けが見つかりました:

http://jonathanstark.com/blog/2009/09/27/debugging-html-5-offline-application-cache/

デバッグHTML 5オフラインアプリケーションキャッシュ ジョナサン・スターク

によってオフラインで提供するために探している場合HTML5で利用可能なオフラインアプリケーションキャッシュはキラーです。しかし、それはあなたがまだそれの周りにあなたの頭を取得しようとしている場合、特に、デバッグする巨大なピタです。

キャッシュマニフェストに苦労している場合は、メインのHTMLページに次のJavaScriptを追加してFirefoxでFirebugを使用するか、Safariで[デバッグ]> [エラーコンソールを表示]を使用して出力をコンソールで表示します。

ご不明な点がございましたら、コメントのPLMKをご覧ください。

HTH、

var cacheStatusValues = []; 
cacheStatusValues[0] = 'uncached'; 
cacheStatusValues[1] = 'idle'; 
cacheStatusValues[2] = 'checking'; 
cacheStatusValues[3] = 'downloading'; 
cacheStatusValues[4] = 'updateready'; 
cacheStatusValues[5] = 'obsolete'; 

var cache = window.applicationCache; 
cache.addEventListener('cached', logEvent, false); 
cache.addEventListener('checking', logEvent, false); 
cache.addEventListener('downloading', logEvent, false); 
cache.addEventListener('error', logEvent, false); 
cache.addEventListener('noupdate', logEvent, false); 
cache.addEventListener('obsolete', logEvent, false); 
cache.addEventListener('progress', logEvent, false); 
cache.addEventListener('updateready', logEvent, false); 

function logEvent(e) { 
    var online, status, type, message; 
    online = (navigator.onLine) ? 'yes' : 'no'; 
    status = cacheStatusValues[cache.status]; 
    type = e.type; 
    message = 'online: ' + online; 
    message+= ', event: ' + type; 
    message+= ', status: ' + status; 
    if (type == 'error' && navigator.onLine) { 
     message+= ' (prolly a syntax error in manifest)'; 
    } 
    console.log(message); 
} 

window.applicationCache.addEventListener(
    'updateready', 
    function(){ 
     window.applicationCache.swapCache(); 
     console.log('swap cache has been called'); 
    }, 
    false 
); 

setInterval(function(){cache.update()}, 10000); 
0

また
J、HTMLファイルであなたに一致するcache.manifestが(私の場合はUTF-8での)正しいBOMを持っていることを確認してください。 BOM以外のASCIIファイルがあり、Content TypeがUTF-8に設定されている場合、キャッシングは失敗します。

HTH誰か。

Christine Boersen