Comment résoudre le problème d'échange d'images dans iOS 8 avec Keep-Alive + HTTP Pipe-lining?

Depuis iOS8, les sites que j'ai gérés connaissent un problème intermittent dans lequel les images échangent des emplacements avec d'autres images. Cela a été mentionné à plusieurs endroits, mais sans solution apparente:

https://discussions.apple.com/thread/6574663

http://tech.vg.no/2011/12/14/safari-on-ios-5-randomly-switches-images/

http://tech.vg.no/2012/02/01/safari-on-ios-5-randomly-switches-images-part-3/

il apparaît que c'était un problème dans iOS5 dans le passé. Notre serveur exécute Lightspeed avec un revêtement de tuyau et reste en vie. L'administrateur de mon serveur a confirmé que le revêtement des tuyaux restitue les actifs dans l'ordre où ils ont été demandés. Il a mentionné que la désactivation de la persistance pourrait résoudre le problème, mais augmenterait massivement la charge du serveur, ce qui serait vraiment une mauvaise chose.

Tous mes éléments transmettent également correctement la longueur du contenu.

Je suis vraiment dans une impasse maintenant pour une solution à cela. Avec autant de mes utilisateurs utilisant iOS, cela commence à être extrêmement frustrant pour tout le monde.

Cela n'a commencé qu'à se produire avec l'introduction d'iOS8 qui a apporté des modifications assez lourdes à Safari. Dans chaque version, sur 8, le problème est toujours là. Comme je l'ai dit, c'est intermittent et nos utilisateurs commencent à nous blâmer car «aucun autre site n'a le problème».

Je me demandais si quelqu'un pouvait faire la lumière là-dessus? Quelqu'un d'autre a-t-il rencontré ce problème et / ou trouvé une solution?

Voici un lien vers mon site en question.

Nous avons également rencontré ce problème et la solution pour nous a été de supprimer toutes les balises de notre code HTML et d'utiliser à la place des classes CSS avec une propriété background. Voici un exemple:

.img_logo {
  background: url(../images/logo.png?v=20150427) no-repeat;
  width: 175px;
  height: 49px;
  display: block;
}

Je me sens un peu maladroit, je sais, mais c'était la seule façon de résoudre le problème pour nous. Un inconvénient est que nous avons dû supprimer le "alt" pour les images mais je suppose que vous pouvez résoudre cela avec du javascript si nécessaire.

J'espère que cela t'aides!

Je traitais ce problème sur un nouveau site Web que nous venons de lancer. Tout avait l'air bien dans FF / Opera / Chrome, etc. mais j'ai eu des problèmes majeurs de permutation d'images dans iOS8 +. J'ai remarqué que de nombreux sites signalant ce problème exécutent le serveur Web Litespeed. Je suis passé à Apache pendant un moment pour tester, et bien sûr, le site Web s'est très bien chargé. Mon hôte (wiredtree.com, excellent service) et moi avons examiné certaines des options de configuration dans Litespeed et désactivé ces deux options:

• Activer la compression
• Activer la compression dynamique

Après avoir désactivé ces deux, les sites Web se sont très bien chargés sans aucun problème. Il a fallu un très léger coup de performance, mais ça vaut vraiment le coup.

Au début, nous avons essayé de désactiver keep-alive pour désactiver efficacement le pipeline HTTP, mais cela n'a pas résolu le problème. Ce qui précède est la seule chose que j'ai vue qui offre une vraie solution.

J'espère que cela peut aider quelqu'un à faire face aux mêmes problèmes!

Pas une réponse, mais une approche pour résoudre le problème:

1. Reproduisez le problème vous-même à l'aide d'une version de développement de l'application à l'aide des serveurs Web en production. Assurez-vous de couvrir cela.
2. Créez une nouvelle entrée de nom d'hôte / CNAME et l'hôte virtuel correspondant sur le serveur Web ou, si nécessaire pour l'étape 3, un serveur HTTP distinct sur un port distinct. Ceci est connu comme le "serveur HTTP de test"
3. Pointez votre version de test / développement vers ce nouveau serveur HTTP et reproduisez le problème. N'allez pas à l'étape 4 tant que vous ne pouvez pas le faire!
4. Maintenant, sur ce serveur HTTP de test, via des redirections ou une configuration intelligente (comme possible avec Apache), désactivez les keepalives, la compression, https, la mise en cache, le pipelining et tout ce à quoi vous pouvez penser. Reproduisez le problème et notez tous les tuples de configuration qui le font et ceux qui ne le font pas.
5. Échangez le serveur Litespeed avec Apahce. Encore une fois, cela devrait être assez trivial pour un bon administrateur système. ( hum ). Reproduisez le problème.

Si vous pouvez reproduire le problème tout au long de l'étape 5, et qu'aucun ensemble de modifications de configuration ou de logiciel serveur ne fait la différence, le problème est iOS et probablement rien que vous puissiez faire. (Mais c'est peu probable.)

Si toutefois, il existe un ensemble de changements de configuration qui ne dépend pas de Litespeed (c'est-à-dire, se produit également avec Apache), alors nous pouvons faire un contournement: Utilisez les BrowserMatchdirectives pour détecter le (jeu de) navigateurs particulier; définissez les paramètres de configuration pour cet ensemble BrowserMatch. Vous trouverez des exemples de ce genre de choses qui remontent aux navigateurs IE 3.0 et Netscape.

Si le problème s'avère être Litespeed, utilisez l'approche ci-dessus et signalez un bogue avec le support Litespeed. Vous payez pour le support, n'est-ce pas?

l'utilisation du protocole http / 2 semble avoir résolu le problème dans mon cas. Mais, je suis sûr qu'il pourrait y avoir une solution / correctif réel à ce problème.