Dans Chrome for desktop, les outils de développement disposent d'options permettant de désactiver complètement le cache lorsque les outils de développement sont ouverts et d'effectuer manuellement un rechargement lorsque vous cliquez longtemps sur le bouton de rechargement (avec les outils de développement ouverts).
Existe-t-il une telle technique pour Chrome pour Android? Que faire si je veux forcer le navigateur à télécharger un fichier javascript ou css au lieu d’utiliser un fichier en cache lors du développement?
Afficher la page en mode navigation privée désactivera le cache. C'était le seul moyen de forcer l'actualisation d'une feuille de style sans vider manuellement le cache via les paramètres.
Aussi une option:
puis rechargez la page.
Vous pouvez utiliser l'option Request Desktop Site dans le menu de l'application (à droite de la barre d'adresse) pour forcer le rechargement de la page.
Appuyez simplement dessus, attendez l'actualisation, puis désélectionnez-la.
En mentionnant cela parce que vous avez mentionné "en cours de développement".
Vous pouvez contrôler l'appareil mobile via votre navigateur Chrome Desktop.
Visitez chrome://inspect/#devices
sur votre bureau. Et Inspect
le périphérique connecté à votre bureau. D'accord quand on lui demande la permission.
Vous devriez maintenant voir une fenêtre Devtool à part entière pour la page en cours sur le périphérique mobile.
Maintenant, utilisez le raccourci de rechargement dur (Cmd + Maj + R) sur le bureau pour effectuer un rechargement dur sur un appareil mobile!
N'oubliez pas de vous assurer que le paramètre "Réduire l'utilisation des données" est désactivé, car il semble que les données mises en cache (depuis des serveurs Google?) Soient téléchargées, même si votre cache local est vidé.
Je sais que c’est une vieille question, mais j’ai trouvé que la réponse acceptée ne me convenait pas.
Une autre solution consisterait à ajouter à l’URL un nouveau paramètre, comme website.com?a=1
, website.com?a=2
, etc.
Si vous avez déjà des paramètres, vous utiliserez bien sûr une esperluette website.com?q=test&a=1
À partir de 2018, à partir de centre d'aide Google (testé sur Chrome 63):
Comme mentionné dans une autre réponse, les incognito tabs sont également très utiles pour le développement.
Les versions récentes de Chrome mettent en cache de manière très agressive. Même les techniques de contournement du cache telles que " http: // url? Updated = datecode " ont cessé de fonctionner. Vous devez vider le cache ou lancer une fenêtre de navigation privée à chaque fois (et vous assurer que Data-Saver est désactivé).
Remote Debugging vous permet d'utiliser les outils de développement de bureau:
https://developers.google.com/chrome-developer-tools/docs/remote-debugging
Comment réinitialiser toutes les données d'une URL/d'un site Web donné sur Chrome Mobile pour Android:
1 - Ouvrez le menu Chrome, puis tapez sur l'icône "i (info)"
2 - appuyez sur "Paramètres du site"
3 - Appuyez sur l'icône de la corbeille
C'est ça, même le plus profondément encaissé prestataire de services car cette URL mourra.
La seule méthode fiable que j'ai trouvée et qui n'exige pas de brancher le téléphone sur un PC est la suivante:
1. Forcer l'arrêt de l'application Chrome.
Cela doit être effectué en premier et vous ne pouvez pas rouvrir Chrome tant que ces étapes ne sont pas terminées. Il y a plusieurs façons de forcer l'arrêt. La plupart des lanceurs à la maison vous laisseront accéder à "Infos application" en maintenant votre doigt appuyé sur l'icône chrome et en sélectionnant une icône "i". Vous pouvez également accéder aux paramètres Android et simplement rechercher "Chrome".
Une fois dans "Infos application", sélectionnez "Forcer l'arrêt" comme indiqué ci-dessous:
2. Effacer le cache de Chrome
Sélectionnez "Stockage" sur le même écran:
Enfin, sélectionnez "Effacer le cache".
Lorsque vous revenez à l'application Chrome, la page doit se recharger et servir une version non mise en cache.
De plus, j'ai trouvé un site qui facilite le test si vous avez effacé votre cache: https://refreshyourcache.com/en/cache-test/
Je ne suis aucunement affilié à celle-ci. Notez que la méthode pour effacer le cache mentionné sur ce site est en fait obsolète et n'est plus valide.
J'ai trouvé une solution qui fonctionne, mais c'est moche.
Cliquez sur le menu à trois points et sélectionnez "Périphériques distants" dans le menu "Autres outils":
Dans le panneau qui s'ouvre, sélectionnez votre appareil, puis le bouton "Inspecter" en regard du nom de l'onglet sur votre téléphone à actualiser:
Dans la fenêtre qui s'ouvre, cliquez sur l'onglet "Réseau" et cochez la case "Désactiver le cache":
Rechargez la page sur votre téléphone ou utilisez le bouton de rechargement de la fenêtre de DevTools.
Remarque: si votre téléphone ne figure pas dans la liste des périphériques:
- assurez-vous que la connexion USB utilise le mode de transfert de fichiers et ne charge pas simplement
- essayez de redémarrer ADB ou exécutez
adb devices
pour voir si le périphérique est détecté
Voici une autre solution simple qui peut fonctionner lorsque d’autres échouent:
Aujourd'hui, une solution assez simple côté développeur a fonctionné pour moi lorsque le problème de la mise en cache était un fichier CSS mis en cache: créez en principe une copie de fichier HTML temporaire et accédez-y pour mettre à jour le cache CSS.
Cette astuce permet de rafraîchir le fichier CSS, du moins dans le navigateur par défaut Android bleu-globe-miniatures (mais très probablement son jumeau, le navigateur officiel Chrome également, et tous les autres navigateurs que nous rencontrons sur " "smart" avec leur tendance à la mise en cache agressive).
Détails:
Au début, j’ai essayé certaines des solutions assez simples partagées ici, mais sans succès (par exemple, effacer l’histoire récente du site spécifique, mais pas des mois et des mois). Mon dernier CSS ne serait toutefois pas appliqué après l'actualisation. Et cela même si j’avais déjà utilisé l’astuce numéro-version dans l’appel de fichier CSS dans la section head du code HTML, ce qui m’avait permis d’éviter ces caching agressifs par le passé. (exemple: link rel = "stylesheet" href = "style.css? v = 001" où vous mettez à niveau ce numéro de pseudo-version chaque fois que vous modifiez un fichier CSS, par exemple 001, 002, 003, 004 ... (devrait être fait dans chaque fichier html du site)
Cette fois (août 2019), la mise à jour du numéro de version du fichier CSS ne suffisait plus et certaines des mesures plus simples mentionnées ici ne fonctionnaient pas pour moi. Je ne pouvais même pas accéder à certaines d'entre elles (sur un emprunt Android téléphone).
Finalement, j'ai essayé quelque chose de relativement simple qui a finalement résolu le problème:
J'ai fait une copie du fichier index.html du site en lui attribuant un nom différent (indexcopy.html), puis je l'ai téléchargé, consulté sur l'appareil Android, puis je suis revenu à la page d'origine, puis actualisé (avec le bouton d'actualisation à gauche de la barre d'adresse), et voilà: cette fois, l'actualisation a finalement fonctionné.
La dernière version du fichier CSS était maintenant appliquée lors de l'actualisation de la page html en question, car la copie en cache du fichier CSS avait été remplacée lorsque le fichier CSS était appelé à partir d'une page html portant un nom différent et n'existant nulle part dans l'historique du navigateur.