Created
July 15, 2018 18:28
-
-
Save drenther/2e9a589abee11c0bcc7916b57f4c047d to your computer and use it in GitHub Desktop.
Custom express server with ssr-caching
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
const { join } = require('path'); | |
const express = require('express'); | |
const next = require('next'); | |
const cache = require('lru-cache'); // for using least-recently-used based caching | |
const PORT = 8000; | |
const dev = process.env.NODE_ENV !== 'production'; | |
const app = next({ dev }); | |
const handle = app.getRequestHandler(); | |
const ssrCache = new cache({ | |
max: 20, // not more than 20 results will be cached | |
maxAge: 1000 * 60 * 5, // 5 mins | |
}); | |
app.prepare().then(() => { | |
const server = express(); | |
server.get('/', (req, res) => { | |
renderAndCache(req, res, '/'); | |
}); | |
server.get('/movie/:id', (req, res) => { | |
const queryParams = { id: req.params.id }; | |
renderAndCache(req, res, '/movie', queryParams); | |
}); | |
server.get('*', (req, res) => { | |
if (req.url.includes('/sw')) { | |
const filePath = join(__dirname, 'static', 'workbox', 'sw.js'); | |
app.serveStatic(req, res, filePath); | |
} else if (req.url.startsWith('static/workbox/')) { | |
app.serveStatic(req, res, join(__dirname, req.url)); | |
} else { | |
handle(req, res, req.url); | |
} | |
}); | |
server.listen(PORT, err => { | |
if (err) throw err; | |
console.log(`> Live @ https://localhost:${PORT}`); | |
}); | |
}); | |
async function renderAndCache(req, res, pagePath, queryParams) { | |
const key = req.url; | |
// if page is in cache, server from cache | |
if (ssrCache.has(key)) { | |
res.setHeader('x-cache', 'HIT'); | |
res.send(ssrCache.get(key)); | |
return; | |
} | |
try { | |
// if not in cache, render the page into HTML | |
const html = await app.renderToHTML(req, res, pagePath, queryParams); | |
// if something wrong with the request, let's skip the cache | |
if (res.statusCode !== 200) { | |
res.send(html); | |
return; | |
} | |
ssrCache.set(key, html); | |
res.setHeader('x-cache', 'MISS'); | |
res.send(html); | |
} catch (err) { | |
app.renderError(err, req, res, pagePath, queryParams); | |
} | |
} |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment