support service worker / pwa's

[jamemackson]

follow up to conversation with @lukemelia on slack...

so to get the service worker working with the lightning approach here’s what we had to do:

• alias ember-cli-deploy-redis to upload both index and sw.js to parallel nodes: app-name:{index|sw}:current-content

// config/deploy.js
  var moduleName = require('../package.json').name;
  var ENV = {
    pipeline: {
      alias: {
        redis: { as: ['redis-index', 'redis-sw']}
      }
    },
    "redis-index": {
      allowOverwrite: true,
      keyPrefix: `${moduleName}:index`,
      filePattern: 'index.html'
    },
    "redis-sw": {
      allowOverwrite: true,
      keyPrefix: `${moduleName}:sw`,
      filePattern: 'sw.js'
    },
    gzip: {
      // not required but makes troubleshooting a lot easier
      // be sure to add 'content-encoding: gzip' to response if gzip is enabled 
      ignorePattern: 'sw.js'
    },
    // … 
  };

• We then had to update our ember-lightning server to detect requests for sw.js and to respond with the appropriate content where it was always responding with the index.html content previously for any request of a given domain.

• One thing to note is that supporting the ref based preview url isn’t practical here for the service worker itself as we’d need to modify the path embedded in the index file to request this specific version of the service worker. This is certainly possible but isn’t anything that we tackled for now.

[jamemackson]

we also added webmanifest to the S3 plugin's filePattern to get the webmanifest working properly. Not exactly required for the service worker itself but as a part of making this all friendly to a PWA, I thought I'd still mention that as well.

    // deploy.js
    s3: {
      filePattern: '**/*.{js,css,png,gif,ico,jpg,xml,txt,svg,swf,eot,ttf,woff,woff2,otf,webmanifest}'
    },

[achambers]

Thanks @jamemackson

So it seems to me there's no changes needs to ember-cli-deploy per se. But maybe this is more of an educational thing that we need to include in the docs around best practices for deploying service workers.

[jamemackson]

luke had asked i share my experience in getting this working so that it might be supported out of the box. at minimum some documentation would be great 👍

[sescobb27]

Thanks for your advice, i just followed them and came with this, just in case someone needs it

// GET ServiceWorkers JS asset
app.get('/sw.js', (req, res, next) => {
  debug('getting service workers file');
  return redisClient.getAsync(`${APP_NAME}:sw:current-content`)
    .then((index) => {
      if (!index) {
        res.status(404);
        return res.type('txt').send('Not found');
      }
      res.type('js');
      return res.send(index);
    })
    .catch(next);
});

[achambers]

I've had success with having the lightning server simply forward the request to the CDN so that the service worker file is uploaded as an asset like anything else. No need to host in Redis.