오프라인 iOS 웹 앱 : 매니페스트를로드하지만 오프라인에서 작동하지 않습니다.

오프라인 iOS 웹 앱 : 매니페스트를로드하지만 오프라인에서 작동하지 않습니다.

---

iOS에서 오프라인으로 사용할 웹 앱을 작성 중입니다. 매니페스트를 만들고으로 제공하고 있으며 text/cache-manifestSafari 내에서 실행할 때 일반적으로 정상적으로 작동합니다.

홈 화면에 앱으로 추가 한 다음 비행기 모드를 켜면 앱이 전혀 열리지 않습니다. 오류가 발생하고 앱을 닫을 것을 제안합니다. (나는 이것이 오프라인 앱의 전체 목적이라고 생각했습니다!)

• 온라인 상태에서 앱을 처음로드하면 매니페스트에 나열된 모든 페이지를 요청하고 있음을 로그에서 볼 수 있습니다.

• 비행기 모드를 끄고 앱을로드하면 요청하는 첫 번째 파일이 내 main.html 파일 (모두 매니페스트에 나열되고 manifest=...속성이 있음) 임을 알 수 있습니다 . 그런 다음 매니페스트와 다른 모든 파일을 요청하여 모두에 대해 200 개를 얻습니다 (이로드 중에 두 번째로 요청 된 항목에 대해 304 개).

• Chrome에서 페이지를로드하고 주변을 클릭하면 로그에 "/favicon.ico"(이는 404이고 iOS Safari가로드하려고하지 않는 것 같습니다. , 어쨌든). 매니페스트에 나열된 모든 파일이 유효하며 오류없이 제공됩니다.

• Chrome 검사기는 "APPLICATION CACHE"아래에 내가 나열한 모든 캐시 된 파일을 나열합니다. 전체 파일 집합은 내가 찾은 오프라인 리소스에 대한 제한보다 훨씬 낮은 약 50KB입니다.

이것이 작동해야합니까? 즉, HTML / CSS / JS 만 사용하여 오프라인 iOS 앱을 만들 수 있어야합니까? 오프라인에서 작동하지 않는 이유를 알아 내려면 어디로 가야합니까?

(관련이 있지만 독립 실행 형 앱이 아닌 Safari에 관한 것이기 때문에 나에게 똑같이 들리지는 않습니다. " iPod에서 오프라인으로 작동하도록 웹 앱을 가져올 수 없습니다. ")

---

'cache.manifest'라는 이름이 IOS 4.3의 오프라인 캐싱 문제를 해결했음을 확인합니다. 다른 이름은 단순히 작동하지 않았습니다.

---

HTML5 오프라인 앱을 디버깅하는 것이 힘들다는 것을 알았습니다. 이 기사의 코드가 내 앱의 문제점을 파악하는 데 도움이되었음을 발견했습니다.

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

Jonathan Stark의 HTML 5 오프라인 애플리케이션 캐시 디버깅

웹 앱에 대한 오프라인 액세스를 제공하려는 경우 HTML5에서 사용할 수있는 오프라인 애플리케이션 캐시가 강력합니다. 그러나 디버깅하는 것은 거대한 PITA입니다. 특히 여전히 문제를 해결하려는 경우 더욱 그렇습니다.

캐시 매니페스트로 어려움을 겪고있는 경우 기본 HTML 페이지에 다음 JavaScript를 추가하고 Firefox의 Firebug 또는 Safari의 디버그> 오류 콘솔 표시를 사용하여 콘솔에서 출력을 봅니다.

질문이 있으면 의견에 PLMK.

HTH,
j

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);

---

응용 프로그램 캐시 그룹이 MobileSafari에서 잘못된 상태가되는 경우가 있습니다. 캐시의 모든 항목을 다운로드 한 다음 마지막에 일반 캐시 오류 이벤트를 발생시킵니다. 사양에 따라 애플리케이션 캐시 그룹은 매니페스트의 절대 URL을 기반으로합니다. 이 오류가 발생하면 매니페스트 경로 (예 : cache2.manifest 등)를 변경하면 새로운 캐시 그룹이 생성되고 문제를 피할 수 있습니다. 모든 웹 앱이 4.2 및 4.3을 사용하여 전체 화면에서 오프라인으로 작동 함을 보증 할 수 있습니다.

---

No offline web app (as of iOS 4.2) can run without an internet connection (which means Airplane mode, too) when using <meta name="apple-mobile-web-app-capable" content="yes" /> in the html head section. I have verified this with every example I've seen and the ones that use Safari to render the site work fine, but when you throw in that meta tag, it won't work. Try your app without it and you'll see what I mean.

---

I have found that clearing the Safari cache after enabling Airplane mode to be an effective way of testing whether the app is really functioning offline.

I have sometimes been fooled into thinking that the application cache was working when it wasn't.

---

I had struggled with this iOS 4.3 "no offline cache" problem since I updated my iPad to 4.3.1 from 4.2. I saw in another post in this site that it was working again in 4.3.2. So I updated by iPad again, now to iOS 4.3.3. But still couldn't get the offline caching to work until I renamed my manifest file to "cache.manifest". Then the caching started working again and I could run my HTML5 offline app from the Home Screen. I did not need to put the favicon.ico in to the cache manifest. And I also had full screen going (setting the "apple-mobile-web-app-capable" to "yes").

---

I have several working offline and on/offline web apps.

When I turn off airport mode, I get a request for the manifest and some other files.

I don't get requests for images, JavaScript, CSS or cached AJAX files.

If you see requests for your resources, IOS doesn't have them cached.

Safari in general is more picky with manifests.

I suggest you try Safari on your computer.

---

I have run into the same problem today on iOS 4.3. I was able to fix the problem by adding a favicon.ico file and also adding it to the manifest.

---

I've written an offline app that still seems to work in 4.2 and 4.2.1; the post is a little dusty, but the code still runs:

http://kentbrewster.com/backchannel/

Remy Sharp has a newer post with code that also works, here:

http://remysharp.com/2011/01/31/simple-offline-application/

His app:

http://rem.im/boggle/

---

After days of messing with getting offline web apps to work on an iPhone/iPod Touch using the Webserver's HTTP authentication, I discovered these useful nuggets:

1. Make sure Safari is at the URL root of the web app when tapping "Add to Home Screen". I used jQuery Mobile and was sometimes adding the link with"/#pageId". Caused trouble.

2. Run your Ajax calls in serial. This might only be important if your web app is using HTTP authentication, but my app was firing a whole slew of Ajax calls on page load in parallel and it caused the app to hang on the "apple-touch-startup-image".

3. Ajax calls are "successful" when offline (at least using Prototype.js). Test for an actual piece of data in the Ajax response, not just on the HTTP status. I used this to test for displaying cached (SQL) or live data.

4. In the manifest use "NETWORK:\n*\n". From what I could muster, this is a catch-all statement for anything not explicit in the "CACHE:" section. Use Chrome to make sure your manifest is correct. Look at Chrome's console for errors.

5. Not directly related, but tripped me up for a bit, openDatabase.transaction() calls are ASYNCHRONOUS! Meaning, the line of JS code after transaction (execute(), error(), success()) will execute BEFORE the success() function.

Good luck!

---

I found this solution that seemed to work for me, since I also ran into this problem during my development. This fix has worked fine for me so far and also for other people that I've asked to test it with, and I'm able to get it running offline (in airplane mode) and off the home screen after caching and whatnot. I've written a post about it on my site:

http://www.offlinewebapp.com/solved-apple-mobile-web-app-capable-manifest-error/

1. Delete your current web app icon on the home screen.
2. Go to settings and clear your Safari browser cache.
3. Double tap your home button to open the multitasking bar. Find the Safari one, hold your finger down on it, and exit it.

Please let me know if this works for you also! Good luck!

---

I've written an app and it works fine through the mobile browser, but when adding the desktop... Doesnt work. I guess apple have given up on IOS4 and all efforts are now on OS5. Shame :(

---

I have one potential workaround for this - it seems a bit crazy, but here goes... I work with the cache.manifest and full screen apps a lot (here's a test if you need: http://www.mrspeaker.net/2010/07/12/argy-bargy/ - add to home screen then turn on flight mode and it launches - at least, as of iOS 4.2.1)

One weird thing I found is that sometimes it seems that some kind of "meta" information in files can mess them up from being cached - Have you ever noticed that in bash that if you do a "ls" some files (depending on your colour settings) are highlighted for no apparent reason? Files can have meta data that the operating system (I think) adds automagically - and there are ways to remove it... I can't remember why but here's some more details: Strip metadata from files in Snow Leopard

After tearing my hair out one day - and refusing to give up because I knew it SHOULD have worked... Chrome was saying it loaded all the files, but ended with a generic error. In the end I recreated the project structure with blank files and copy/pasted the contents over. It worked - started caching as it was supposed to!

When I looked at the files I noticed there was some meta info. I tried scrubbing this info and the original project worked again. I'm not sure this was the reason it worked again - perhaps it was just a coincidence.

Because it worked, I didn't think too much about it. The same problem happened again some months later and the copy/paste trick worked again. I was busy, so I didn't investigate further - but vowed I would get to the bottom of it the next time it happened.... but I haven't had to yet.

Phew. Anyway, glad I got to write that down somewhere...

[UPDATE: months and months later - I've not been able to reproduce this, so I don't think it's the metadata]

참고URL : https://stackoverflow.com/questions/4361948/offline-ios-web-app-loads-my-manifest-but-doesnt-work-offline