Gzip compression problem in Safari and iOS, with express.js

Viewed 1149

Im having a serious problem with gzip compression. I use compression in my Node JS express.js server with:

app.use(compression());

The problem is it works great on most browsers and most platforms, but on Safari for Mac OS and in every mobile browser in iPhone it doesn't work. On Safari for Mac it gives me the following error:

Failed to load resource: cannot decode raw data.

It only happens with one javascript file, the rest is fine.

When I try to access the file via the url it loads only a part, then gets really weird, like random characters. In the console the error is the same.

The only noticeble difference I saw in headers was that in iOS and Safari for Mac the "Accept Encoding" property is set only to gzip and deflate. As in other browsers and OS's it is gzip, deflate and br.

When I remove the line of compression everything works flawlessly.

The website is https://kalidata.app?frame

1 Answers

I have the same problem, the only (ugly) workaround was to switch off compression for Safari on Mac users. Some files are transferred only partially. Sometimes it works, sometimes not. Safari on iOS works, Chrome && FF on Mac OS too.

expressApp.use(compression({

        // decide what to compress and what not:
        filter: (req, res) => {

            // is Mac OS -> look further
            if (req.headers['user-agent'] && (req.headers['user-agent'].indexOf('Mac OS X') > -1)){

                // not chrome && not firefox -> don't compress
                if((req.headers['user-agent'].indexOf('Chrome') == -1) && (req.headers['user-agent'].indexOf('Firefox') == -1))
                    return false;

            } 

            // fallback to standard filter function
            return compression.filter(req, res);

        }

    }));

Anyone having a better solution to this? Using Node 10.16.3 with the latest express and compression packages.

Related