Join FlipAndroid.COM Telegram Group: https://t.me/joinchat/F_aqThGkhwcLzmI49vKAiw


Sigue recibiendo 404's para apple-touch-icon.png

Seguimos recibiendo 404's para los siguientes dos archivos:

/apple-touch-icon-precomposed.png: 685 Time(s) /apple-touch-icon.png: 523 Time(s) 

He estado recorriendo mi archivo de sitio web móvil para el culpable de este 404, y no hay lugar en mi código que está dirigiendo a apple-touch-icon.png .

Realización de una Find in folder... en Sublime El texto 2 proporciona cero resultados para apple-touch-icon :

 Searching 100 files for "apple-touch-icon" 0 matches across 0 files 

Estamos utilizando las etiquetas meta de Apple para webapps:

 <meta name="apple-mobile-web-app-capable" content="yes"> <meta name="apple-mobile-web-app-status-bar-style" content="black"> 

¿El uso de estas metaetiquetas hará que un iPhone busque un apple-touch-icon por defecto? No estamos proporcionando un icono, pero ¿deberíamos serlo? Realmente queremos eliminar este 404.

Navegando por la documentación para desarrolladores de Apple, no proporcioné ninguna sugerencia que reforzara mi teoría.

La trama se agrava aún más cuando descubrimos que esto está sucediendo en iOS y Android, independientemente del navegador. Firefox, Safari y Chrome están intentando encontrar este apple-touch-icon .

Utilicé HTML5 Mobile Boilerplate como iniciador para mi WebApp, que tiene un archivo llamado helper.js . helper.js tiene esta función dentro de la misma que he eliminado de nuestro código:

 /** * iOS Startup Image helper */ MBP.startupImage = function() { var portrait; var landscape; var pixelRatio; var head; var link1; var link2; pixelRatio = window.devicePixelRatio; head = document.getElementsByTagName('head')[0]; if (navigator.platform === 'iPad') { portrait = pixelRatio === 2 ? 'img/startup/startup-tablet-portrait-retina.png' : 'img/startup/startup-tablet-portrait.png'; landscape = pixelRatio === 2 ? 'img/startup/startup-tablet-landscape-retina.png' : 'img/startup/startup-tablet-landscape.png'; link1 = document.createElement('link'); link1.setAttribute('rel', 'apple-touch-startup-image'); link1.setAttribute('media', 'screen and (orientation: portrait)'); link1.setAttribute('href', portrait); head.appendChild(link1); link2 = document.createElement('link'); link2.setAttribute('rel', 'apple-touch-startup-image'); link2.setAttribute('media', 'screen and (orientation: landscape)'); link2.setAttribute('href', landscape); head.appendChild(link2); } else { portrait = pixelRatio === 2 ? "img/startup/startup-retina.png" : "img/startup/startup.png"; portrait = screen.height === 568 ? "img/startup/startup-retina-4in.png" : portrait; link1 = document.createElement('link'); link1.setAttribute('rel', 'apple-touch-startup-image'); link1.setAttribute('href', portrait); head.appendChild(link1); } //hack to fix letterboxed full screen web apps on 4" iPhone / iPod if ((navigator.platform === 'iPhone' || 'iPod') && (screen.height === 568)) { if (MBP.viewportmeta) { MBP.viewportmeta.content = MBP.viewportmeta.content .replace(/\bwidth\s*=\s*320\b/, 'width=320.1') .replace(/\bwidth\s*=\s*device-width\b/, ''); } } }; 

Después de quitar esto, todavía conseguimos 404's. Estoy confundido. Cualquier ayuda es muy apreciada.

  • ¿Hay alguna manera de habilitar JavaScript Error / Debug Console para Safari en Android?
  • WebApp usando webRTC para videochat multiplataforma en iOS Browser y Android Chrome
  • Evitar que la barra de direcciones se oculte en los navegadores móviles
  • Cómo inhabilitar el zoom en Chrome en Android?
  • ¿Hay una manera de detener Mobile Safari insertando comas en campos numéricos en formularios HTML?
  • One Solution collect form web for “Sigue recibiendo 404's para apple-touch-icon.png”

    ¿El uso de estas metaetiquetas hará que un iPhone busque un icono de apple-touch por defecto? No estamos proporcionando un icono, pero ¿deberíamos serlo? Realmente queremos eliminar este 404.

    Sí. Cuando agregas

     <meta name="apple-mobile-web-app-capable" content="yes"> <meta name="apple-mobile-web-app-status-bar-style" content="black"> 

    A su sitio, significa que el usuario puede crear un marcador en su pantalla de inicio que no se abre en Safari, sino en una vista web que parece una aplicación "nativa". Debe proporcionar estas imágenes como una especie de icono de aplicación para la pantalla de inicio.

    Esta podría ser la pista que estaba buscando: http://developer.apple.com/library/ios/#documentation/AppleApplications/Reference/SafariWebContent/ConfiguringWebApplications/ConfiguringWebApplications.html

    FlipAndroid es un fan de Google para Android, Todo sobre Android Phones, Android Wear, Android Dev y Aplicaciones para Android Aplicaciones.