Feature request: App icons für iOS PWAs


Harald Schneider

Unfortunately iOS does not recognize app manifests. So if you install a PWA under iOS, it shows a screenshot as an icon instead of the app icon.

It can be fixed with this code in AppOptons/HTML/Custom_metadata:

Full story here: https://stackoverflow.com/questions/49568333/pwa-icons-are-not-used-in-ios-11-3

BTW: I tried the fallback option, mentioned in the article above, but it did not work under iOS 12.2

Can this be included automatically in AB's build process for browser apps?


DecSoft

Hello Harald,

I think it's possible to add that into the app's HTML file, however, what about the answer to the StackOverflow question?

FYI, when testing my PWA on localhost with a dummy SSL certificate, Safari won't use the icon when adding to homescreen. Instead it takes a screenshot of the page as the icon. Once the PWA was uploaded to the live server, with full HTTPS, the icon worked fine. Testing on iOS11.3, iPad 6th gen

Maybe the above fix the issue? Or maybe the this other answer too:

TerPro's answer is correct but as a fallback you can put a file named "/apple-touch-icon.png" in the root directory.


Harald Schneider
I used full HTTPS and I tried the fallback with the apple-touch-icon-png in the root, the www folder and the platform-www folder. No luck ...

DecSoft

Hello Harald,

So you try with the below...

And you see it working properly? Also in other iOS versions? If so... there is not a problem to automatically add such piece of code in the app's HTML.



Harald Schneider
Yes, it works perfectly! It is recommended by Apply since they support PWAs.

DecSoft

It's done, Harald.



Harald Schneider
Perfect. Tested it. works like a charm. Thank you so much! :-)

DecSoft
Very good! :-)

Todo el mundo puede leer el foro de soporte de DecSoft para aprender del mismo, sin embargo, sólo los clientes de DecSoft pueden abrir nuevos hilos. Compre una o más licencias de productos de DecSoft y obtendrá este y otros beneficios.

Este sitio utiliza "cookies" útiles para almacenar sus preferencias.

Bien. Ocultar esta nota. Obtener más información.