stock-management-demo/src-ssr/middlewares/render.js

71 lines
2.1 KiB
JavaScript

import { defineSsrMiddleware } from '#q-app/wrappers';
// This middleware should execute as last one
// since it captures everything and tries to
// render the page with Vue
export default defineSsrMiddleware(({ app, resolve, render, serve }) =>
{
// we capture any other Express route and hand it
// over to Vue and Vue Router to render our page
app.get(resolve.urlPath('*'), (req, res) =>
{
res.setHeader('Content-Type', 'text/html');
render(/* the ssrContext: */ { req, res })
.then(html =>
{
// now let's send the rendered html to the client
res.send(html);
})
.catch(err =>
{
// oops, we had an error while rendering the page
// we were told to redirect to another URL
if (err.url)
{
if (err.code)
{
res.redirect(err.code, err.url);
}
else
{
res.redirect(err.url);
}
}
else if (err.code === 404)
{
// Should reach here only if no "catch-all" route
// is defined in /src/routes
res.status(404).send('404 | Page Not Found');
}
else if (process.env.DEV)
{
// well, we treat any other code as error;
// if we're in dev mode, then we can use Quasar CLI
// to display a nice error page that contains the stack
// and other useful information
// serve.error is available on dev only
serve.error({ err, req, res });
}
else
{
// we're in production, so we should have another method
// to display something to the client when we encounter an error
// (for security reasons, it's not ok to display the same wealth
// of information as we do in development)
// Render Error Page on production or
// create a route (/src/routes) for an error page and redirect to it
res.status(500).send('500 | Internal Server Error');
if (process.env.DEBUGGING)
{
console.error(err.stack);
}
}
});
});
});