Application web iOS hors ligne: charge mon manifeste, mais ne fonctionne pas hors ligne
j'écris une application web à utiliser hors ligne sur iOS. J'ai créé un manifeste, je le sers sous le nom de text/cache-manifest
, et ça marche très bien, quand on court dans un Safari.
Si je l'ajouter comme une application sur mon écran d'accueil, puis activez le mode Avion, il ne peut pas ouvrir l'application, j'obtiens une erreur et qu'il offre pour fermer l'application. (Je pensais que c'était tout l'objet d'une application hors ligne!)
-
temps en ligne, je peux voir dans mes journaux qu'il demande chaque page énumérée dans le manifeste.
-
si j'éteins le mode avion et que je charge l'application, je vois que le premier fichier demandé est mon fichier principal.fichier html (qui est à la fois énuméré dans le manifeste, et a l'attribut
manifest=...
). Il demande alors le manifeste, et tous mes autres fichiers, obtenir 200 pour tous (et 304 pour tout ce qui a été demandé une deuxième fois au cours de cette charge). -
quand je charge la page dans Chrome, et que je clique, les logs montrent que la seule chose qu'il essaie d'atteindre sur le serveur est " /favicon.ico" (qui est un 404, et que je ne pense pas que iOS Safari essaie de charger, de toute façon). Tous les fichiers répertoriés dans le manifeste sont valides et servi sans erreur.
-
L'inspecteur Chrome liste, sous" APPLICATION CACHE", tous les fichiers en cache que j'ai listés et que j'attends. L'ensemble de fichiers est d'environ 50 KO, sous limite des ressources hors ligne que j'ai trouvé.
est-ce censé fonctionner, c.-à-d. suis-je censé pouvoir créer une application iOS hors ligne en utilisant seulement HTML/CSS/JS? Et Où dois-je aller pour comprendre pourquoi ça ne fonctionne pas hors ligne?
(lié mais ne sonne pas tout à fait la même chose pour moi, car il s'agit de Safari et non une application autonome: " ne peut pas obtenir une application web pour travailler hors ligne sur iPod ")
13 réponses
je confirme ce nom 'cache.le Manifeste a résolu le problème de la mise en cache hors ligne dans ios 4.3. L'autre nom n'a tout simplement pas fonctionné.
j'ai trouvé que déboguer des applications HTML5 hors ligne était pénible. J'ai trouvé le code de cet article m'a aidé à comprendre ce qui ne va pas avec mon application:
http://jonathanstark.com/blog/2009/09/27/debugging-html-5-offline-application-cache /
débogage HTML 5 Cache D'Application hors ligne par Jonathan Stark
si vous cherchez à fournir un accès hors ligne à votre application web, le Le Cache d'Application disponible dans HTML5 est mortel. Cependant, c'est un PITA géant à déboguer, surtout si vous êtes encore à essayer d'obtenir votre tête autour de lui.
si vous êtes aux prises avec le manifeste de cache, ajoutez le JavaScript suivant à votre page HTML principale et visualisez la sortie dans la console en utilisant Firebug dans Firefox ou Debug > Show Error Console dans Safari.
si vous avez des questions, PLMK dans les commentaires.
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);
parfois un groupe de cache d'application se trouve dans un mauvais état dans MobileSafari - il télécharge chaque élément dans le cache et déclenche ensuite un événement d'erreur générique de cache à la fin. Un groupe de cache d'application, selon les spécifications, est basé sur l'URL absolue du Manifeste. J'ai trouvé que lorsque cette erreur se produit, changer le chemin vers le manifeste (par exemple, cache2.manifest, etc) Vous donne un nouveau groupe de cache et contourne le problème. Je peux garantir que toutes nos applications Web fonctionnent hors ligne en plein écran avec 4.2 et 4.3.
aucune application Web hors ligne (à partir de iOS 4.2) ne peut fonctionner sans connexion internet (qui signifie aussi le mode Avion) en utilisant <meta name="apple-mobile-web-app-capable" content="yes" />
dans la section HTML head. J'ai vérifié cela avec chaque exemple que j'ai vu et ceux qui utilisent Safari pour rendre le site fonctionne bien, mais quand vous jetez dans cette étiquette meta, il ne fonctionnera pas. Essayez de votre application et vous verrez ce que je veux dire.
j'ai trouvé que le nettoyage de la cache Safari après avoir activé le mode Avion pour être un moyen efficace de tester si l'application fonctionne vraiment hors ligne.
j'ai parfois été dupé en pensant que le cache d'application fonctionnait alors qu'il ne l'était pas.
j'ai eu du mal avec ce problème iOS 4.3" no offline cache " depuis que j'ai mis à jour mon iPad à 4.3.1 à partir de 4.2. J'ai vu dans un autre post sur ce site qu'il fonctionnait à nouveau en 4.3.2. Donc j'ai mis à jour par iPad à nouveau, maintenant à iOS 4.3.3. Mais je ne pouvais toujours pas obtenir la mise en cache hors ligne pour fonctionner jusqu'à ce que je renommé mon fichier manifeste en "cache.manifester." Puis la mise en cache a recommencé à fonctionner et j'ai pu lancer mon application HTML5 hors ligne depuis l'écran D'accueil. Je n'ai pas besoin de mettre le favicon.ico dans la cache manifester. Et j'ai aussi eu plein écran Aller (mettant le "apple-mobile-Web-capable d'application" à "Oui").
j'ai plusieurs applications Web qui fonctionnent hors ligne et on/offline.
quand j'éteins le mode aéroport, je reçois une demande pour le manifeste et d'autres fichiers.
Je ne reçois pas de requêtes pour des images, JavaScript, CSS ou des fichiers AJAX.
si vous voyez des demandes pour vos ressources, IOS ne fait pas les mettre en cache.
Safari en général est plus difficile avec des manifestes.
je vous suggère D'essayer le Safari sur votre ordinateur.
j'ai rencontré le même problème aujourd'hui sur iOS 4.3. J'ai pu régler le problème en ajoutant un favicon.le fichier ico et son ajout au manifeste.
j'ai écrit une application hors ligne qui semble toujours fonctionner dans 4.2 et 4.2.1; le poteau est un peu poussiéreux, mais le code fonctionne toujours:
http://kentbrewster.com/backchannel /
Remy Sharp a un nouveau poste avec code qui fonctionne aussi, ici:
http://remysharp.com/2011/01/31/simple-offline-application /
son application:
après des jours de tâtonnements pour obtenir des applications Web hors ligne pour travailler sur un iPhone / iPod Touch en utilisant L'authentification HTTP du serveur web, j'ai découvert ces pépites utiles:
-
assurez-vous que Safari est à la racine de L'URL de l'application web lorsque vous cliquez sur"Ajouter à L'écran D'accueil". J'ai utilisé jQuery Mobile et j'ajoutais parfois le lien avec"/#pageId". Causé des ennuis.
-
lancez vos appels Ajax en série. Ce cela pourrait n'être important que si votre application web utilise L'authentification HTTP, mais mon application lançait un tas d'appels Ajax sur le chargement de page en parallèle et cela a causé l'application de s'accrocher à"apple-touch-startup-image".
-
les appels Ajax sont "réussis" lorsqu'ils sont hors ligne (du moins en utilisant
Prototype.js
). Test pour un morceau de données réel dans la réponse Ajax, pas seulement sur le statut HTTP. J'ai utilisé ceci pour tester l'affichage de données en cache (SQL) ou en direct. -
Dans le manifeste utilisation en RÉSEAU":\n*\n". D'après ce que j'ai pu trouver, c'est une déclaration fourre-tout pour tout ce qui n'est pas explicite dans la section "CACHE:". Utilisez Chrome pour vous assurer que votre manifeste est correct. Regardez la console de Chrome pour les erreurs.
-
ne sont Pas directement liés, mais a trébuché moi pour un peu, openDatabase.les appels de transaction() sont asynchrones! C'est-à-dire la ligne du code JS après transaction (
execute()
,error()
,success()
) s'exécutera avant la fonctionsuccess()
.
bonne chance!
j'ai trouvé cette solution qui a semblé fonctionner pour moi, puisque j'ai également rencontré ce problème pendant mon développement. Ce correctif a très bien fonctionné pour moi jusqu'à présent et aussi pour d'autres personnes avec qui j'ai demandé de le tester, et je suis capable de le faire fonctionner hors ligne (en mode avion) et hors de l'écran d'accueil après la mise en cache et ainsi de suite. J'ai écrit un post à ce sujet sur mon site:
http://www.offlinewebapp.com/solved-apple-mobile-web-app-capable-manifest-error/
- supprimez l'icône de votre application Web actuelle sur l'écran d'accueil.
- allez dans Paramètres et videz le cache de votre navigateur Safari.
- double tapotez votre bouton maison pour ouvrir la barre multitâche. Trouvez le Safari, tenez votre doigt vers le bas sur elle, et la sortie.
s'il vous plaît faites-moi savoir si cela fonctionne aussi pour vous! Bonne chance!
j'ai écrit une application et il fonctionne très bien à travers le navigateur mobile, mais en ajoutant le bureau... Ne marche pas. Je suppose qu'apple a abandonné IOS4 et tous les efforts sont maintenant sur OS5. Honte: (
j'ai un contournement potentiel pour cela - cela semble un peu fou, mais voilà... Je travaille avec la cache.manifeste et applications plein écran beaucoup (voici un test si vous avez besoin: http://www.mrspeaker.net/2010/07/12/argy-bargy/ - ajouter à l'écran d'accueil puis activer le mode de vol et il se lance - au moins, à partir de iOS 4.2.1)
une chose étrange que j'ai trouvé est que parfois, il semble qu'une sorte de "méta" information dans les fichiers peuvent les gâcher d'être cache - avez-vous déjà remarqué qu'à bash, si vous faites un "ls", certains fichiers (en fonction de vos paramètres de couleur) sont mis en évidence sans raison apparente? Les fichiers peuvent avoir des méta-données que le système d'exploitation (je pense) ajoute automatiquement - et il y a des moyens de les supprimer... Je ne me souviens pas pourquoi, mais voici plus de détails: Bande de métadonnées à partir des fichiers Snow Leopard
après m'avoir arraché les cheveux un jour et avoir refusé d'abandonner parce que je le savais DOIT avoir travaillé... Chrome disait qu'il avait chargé tous les fichiers, mais il a fini avec une erreur générique. À la fin, j'ai recréé la structure du projet avec des fichiers vierges et copié/collé le contenu. Cela a fonctionné - le cache a commencé comme prévu!
quand j'ai regardé les fichiers, j'ai remarqué qu'il y avait des méta-informations. J'ai essayé d'effacer cette information et le projet original a fonctionné à nouveau. Je ne suis pas sûr que ce soit la raison pour laquelle il a fonctionné à nouveau - peut-être était-ce juste une coïncidence.
parce que ça a marché, je n'y ai pas trop pensé. Le même problème est réapparu quelques mois plus tard et le truc du copier/coller a fonctionné à nouveau. J'étais occupé, donc je n'ai pas enquêté, mais j'ai juré d'aller au fond des choses la prochaine fois.... mais je n'ai pas eu encore.
Phew. Enfin bref, je suis content d'avoir pu écrire ça quelque part...
[mise à jour: mois et mois plus tard - je n'ai pas été en mesure de reproduire ce, donc je ne pense pas que c'est les métadonnées]