Clover13 Posted January 17 Share Posted January 17 I actually posted this last night and then deleted it thinking it was fixed, but it wasn't. I've tried everything I can think of to get the PWA app icon and splash screen to display correctly, but can't seem to figure it out. Device: iPhone 13 Pro Max I've uploaded various sizes (full size, 512x512), solid background color, transparent background, etc. Each iteration I've manually deleted all S3 images generated and cleared the CF cache. I've also cleared my browser cache. I've manually checked the S3 linked images and they appear correct, however when I open my site and "Add to Home" the background of the logo is always white and the splash screen is always just a blank white screen. The app/site opens fine. The share logo in the browser menu (i.e. where you'll find "Add to Home") is correct. Any ideas? Link to comment Share on other sites More sharing options...
opentype Posted January 17 Share Posted January 17 I’ve never seen a splash screen on any IPS website on my iPhone.  Link to comment Share on other sites More sharing options...
Clover13 Posted January 17 Author Share Posted January 17 (edited) 7 minutes ago, opentype said: I’ve never seen a splash screen on any IPS website on my iPhone.  I have 3 sites. Site 1: Incorrect app icon Correct splash screen icon Correct splash screen background color Site 2: Correct app icon Correct splash screen icon Incorrect splash screen background color Site 3: Incorrect app icon Incorrect splash screen icon Incorrect splash screen background color  Consistently inconsistent. Edit: I have not done cleanup procedures and rebuilds on the first two sites. I'm trying to figure out Site 3 and then apply it to the others. Edited January 17 by Clover13 Link to comment Share on other sites More sharing options...
Marc Stridgen Posted January 17 Share Posted January 17 Are they always consistently inconsistent on a consistent server? Clover13 1 Link to comment Share on other sites More sharing options...
Clover13 Posted January 17 Author Share Posted January 17 3 minutes ago, Marc Stridgen said: Are they always consistently inconsistent on a consistent server? Yes, consistently the same result on each site. Also, all three sites are running on the same server with the same setup of all software including IPS. Link to comment Share on other sites More sharing options...
Stuart Silvester Posted January 17 Share Posted January 17 If you're using a CDN with default cache-control headers for static files, it's very likely that the device itself is caching these resources. The good news is that the current beta (4.7.15) introduces cache-busting for web app icons, so that may resolve your issue after upgrading. Clover13 and SeNioR- 2 Link to comment Share on other sites More sharing options...
Clover13 Posted January 17 Author Share Posted January 17 3 minutes ago, Stuart Silvester said: If you're using a CDN with default cache-control headers for static files, it's very likely that the device itself is caching these resources. The good news is that the current beta (4.7.15) introduces cache-busting for web app icons, so that may resolve your issue after upgrading. I am deleting the CDN files (S3) so it forces an entire rebuild the next time I upload images via the IPS AdminCP and purging the entire site cache in CF. When I visit the physical links in no-cache private/incognito browser window, they do appear correctly. Part of me wonders if the Apple device is just not interpreting it correctly OR if there is something specific about each image required in the IPS AdminCP for setting up the PWA (i.e. certain exact sizing is required, or certain image properties are required, etc).  Link to comment Share on other sites More sharing options...
Stuart Silvester Posted January 17 Share Posted January 17 14 minutes ago, Clover13 said: I am deleting the CDN files (S3) so it forces an entire rebuild the next time I upload images via the IPS AdminCP and purging the entire site cache in CF. When I visit the physical links in no-cache private/incognito browser window, they do appear correctly. Part of me wonders if the Apple device is just not interpreting it correctly OR if there is something specific about each image required in the IPS AdminCP for setting up the PWA (i.e. certain exact sizing is required, or certain image properties are required, etc).  Right, but if your Cloudfront/Cloudflare configuration said "Cache this static image for 1 year" for example; The device (iPhone) itself is going to cache that resource for a long time and not check the CDN/Website for a newer version. SeNioR- and Clover13 2 Link to comment Share on other sites More sharing options...
Clover13 Posted January 17 Author Share Posted January 17 38 minutes ago, Stuart Silvester said: Right, but if your Cloudfront/Cloudflare configuration said "Cache this static image for 1 year" for example; The device (iPhone) itself is going to cache that resource for a long time and not check the CDN/Website for a newer version. Clearing my Safari history and website data should get rid of it though, no? Link to comment Share on other sites More sharing options...
teraßyte Posted January 17 Share Posted January 17 17 minutes ago, Clover13 said: Clearing my Safari history and website data should get rid of it though, no? No, because you request the image from Cloudflare, and Cloudflare already has it cached for 1 year. Link to comment Share on other sites More sharing options...
Clover13 Posted January 17 Author Share Posted January 17 34 minutes ago, teraßyte said: No, because you request the image from Cloudflare, and Cloudflare already has it cached for 1 year. Even if you purge your entire CF cache for the site? Link to comment Share on other sites More sharing options...
teraßyte Posted January 17 Share Posted January 17 7 minutes ago, Clover13 said: Even if you purge your entire CF cache for the site? Sorry, I missed that part in your previous reply. If you cleared also the CDN's cache too, then yes, it should work. Clover13 1 Link to comment Share on other sites More sharing options...
Randy Calvert Posted January 17 Share Posted January 17 Remember… order of operations matters. Once a change is made on the server, the cdn cache needs popped and then the local browser cache needs popped if it’s there also.  If you do it out of order, you could end up redownloading an old/bad object again unintentionally. Clover13 1 Link to comment Share on other sites More sharing options...
Clover13 Posted January 18 Author Share Posted January 18 Well, not sure if this definitively indicates anything, but the PWA does display both the app icon saved to the Home Screen and the splash screen correctly with my device simulated on Safari Developer Tools ala XCode Simulator 15.2 with iOS 17.2 on my iPhone 13 Pro Max. The PWA also shows correctly on Browserstack's simulator for my device. So either the simulators are off or there is something on my device that is either not displaying correctly or something is cached somewhere other than Safari website data. Also worth noting, 15.2/17.2 on an iPhone 15 did not display the splash screen correctly. Not sure if there is a new size for their latest device that is missing from the meta tags and images generated. Will keep tinkering, but that's as close as I can simulate my device vs completely different behavior on the same actual physical device. Link to comment Share on other sites More sharing options...
Stuart Silvester Posted January 18 Share Posted January 18 Give the beta a try, see if the new way we handle the icons flushes out the cache. It's unlikely we'll be making any other changes to the beta before final release. Clover13 1 Link to comment Share on other sites More sharing options...
KT Walrus Posted January 18 Share Posted January 18 Perhaps reading this web.dev article will help you to understand manifest updates on various devices. https://web.dev/learn/pwa/update Not sure if article is updated to reflect latest OS/browser versions. Link to comment Share on other sites More sharing options...
Clover13 Posted February 2 Author Share Posted February 2 This does appear to be fixed across all three of my sites now with the latest release after rebuilding the images. I did notice some nuances when doing a second update where I had to reupload the same images again to force a third rebuild, but eventually everything look good. Correct app icon when saved to home screen. Correct splash screen icon on startup Correct splash screen background color on startup Thanks! Link to comment Share on other sites More sharing options...
Marc Stridgen Posted February 2 Share Posted February 2 Glad to hear it 🙂 Link to comment Share on other sites More sharing options...
Recommended Posts