shadowwalker / next-pwa

Zero config PWA plugin for Next.js, with workbox 🧰
MIT License
3.84k stars 320 forks source link

How can I handle external requests like analytics, facebook etc? All these requests give me an error. #169

Closed turrione closed 3 years ago

turrione commented 3 years ago

Summary

I have added this fantastic package to my application. Everything works fine except external requests. I am somewhat confused and do not know how to handle the problem.

next.config.js

const withPWA = require('next-pwa')
const runtimeCaching = require('next-pwa/cache')

const nextConfig = {
    poweredByHeader: false,
    pwa: {
        dest: 'public',
        runtimeCaching,
    },
    webpack: function (config) {
        config.module.rules.push({
            test: /\.md$/,
            use: 'raw-loader',
        })

        return config
    },
};
module.exports = withPWA(nextConfig)

worker/index.js

'use-strict'
self.addEventListener('fetch', function (event) {
    if (event.request.url.search("www.facebook.com") != -1 || event.request.url.search("connect.facebook.net") != -1) {
        return event.respondWith(fetch(event.request))
    } else if (event.request.url.search("www.google.com") != -1 || event.request.url.search("google.es") != -1 || event.request.url.search("doubleclick.net") != -1) {
        return event.respondWith(fetch(event.request));
    }

    else {
        return event.respondWith(
            fetch(event.request).catch(function (error) {
                console.log('[PWA Builder] Network request Failed. Serving content from cache: ' + error);

                //Check to see if you have it in the cache
                //Return response
                //If not in the cache, then return error page
                return caches.open('pwabuilder-offline').then(function (cache) {
                    return cache.match(event.request).then(function (matching) {
                        var report = !matching || matching.status == 404 ? Promise.reject('no-match') : matching;
                        return report
                    });
                });
            })
        );
    }
});

Expected Behaviors

That requests to google for analytical issues and other requests such as facebook for marketing issues can be produced without problems

Screenshots

fetch-issues
shadowwalker commented 3 years ago

If you remove your custom worker, does it work?

turrione commented 3 years ago

If you remove your custom worker, does it work?

Thanks for answering. No, even though I remove the custom worker, all external requests fail.

shadowwalker commented 3 years ago

It's hard to determine the nature of this issue with the current information, the runtime caching shouldn't affect external requests. Do you have a deployed link?

aldoarya commented 2 years ago

Hello, sorry to comment on Closed Issue, but I think it haven't resolved yet. This also happen to me and I am really confused on what to do with it.

Any update on this?