PWA - references to the non-existent resources

Question

User-823298864 posted

Hello All,

We have been working on a PWA for my company and while all seems to be going well, we've run into a snag where testing on gtmatrix/pingdom, etc keeps showing us a link error  for non-existent resources. We've scoured the whole app and find no reference and it seems related either to the manifest or sw.js. The test keeps returning https://www.example.com/undefined. Has anyone run into anything like this before or can maybe point me in the right direction? Here's a look at my manifest; TIA

{
    "dir": "ltr",
    "name": "Example",
    "scope": "/",
    "display": "minimal-ui",
    "start_url": "https://www.example.com/",
    "short_name": "Example",
    "theme_color": "#000000",
    "description": "Example Company",
    "orientation": "any",
    "background_color": "transparent",
    "related_applications": [],
    "prefer_related_applications": false,
    "icons": [
	{
            "src": "/pwa/images/wp-content/uploads/2017/02/icon-512x512.png",
            "type": "image/png",
            "sizes": "512x512"
        },
        {
            "src": "/pwa/images/wp-content/uploads/2017/02/cropped-icon-270x270.png",
            "type": "image/png",
            "sizes": "270x270"
        },
        {
            "src": "/pwa/images/wp-content/uploads/2017/02/cropped-icon-32x32.png,qx24813.pagespeed.ce.SOJ0tpCReW.png",
            "sizes": "32x32",
            "type": "image/png"
        },
        {
            "src": "/pwa/images/wp-content/uploads/2017/02/xcropped-icon-192x192.png,qx24813.pagespeed.ic._yojioWGpP.png",
            "sizes": "192x192",
            "type": "image/png"
        },
        {
            "src": "/pwa/images/wp-content/uploads/2017/02/xcropped-icon-180x180.png,qx24813.pagespeed.ic.fbZCitKYRb.png",
            "type": "image/png",
            "sizes": "180x180"
        }
    ],
    "lang": "en"
}

 

Answer 1

User753101303 posted

Hi,

Does it go away if you stop registering your service worker ? If yes, add your code back step by step or better handle wrong things that could happen at every step.

It seems to be browser based so my guess is that your js code ends up in returning some undefined object (maybe because sw registration is disabled there ???)

Answer 2

User-627724879 posted

Do you know which resources are being reported as 404? Or do you have a clue which ones are undefined?

I am also wondering if you may be driving your service worker to pre-cache or cache some assets dynamically using a variable of some sort. That variable may not be properly initialized.

Check the network tab in your developer tools. See if you see any 404 requests in the waterfall.

Answer 3

User-823298864 posted

Thanks for the replies. The service worker does register and the only link being returned as a 404 was the example.com/undefined. We tried to find where that link was coming from and we were unable to do so. There were no 404's except the example.com/undefined in the waterfall. The workaround at the moment is that we added a 304. It has fixed the problem but it feels like a hack.