render.js 2.0 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354
  1. import { ssrMiddleware } from 'quasar/wrappers'
  2. // This middleware should execute as last one
  3. // since it captures everything and tries to
  4. // render the page with Vue
  5. export default ssrMiddleware(({ app, resolve, render, serve }) => {
  6. // we capture any other Express route and hand it
  7. // over to Vue and Vue Router to render our page
  8. app.get(resolve.urlPath('*'), (req, res) => {
  9. res.setHeader('Content-Type', 'text/html')
  10. render(/* the ssrContext: */ { req, res })
  11. .then(html => {
  12. // now let's send the rendered html to the client
  13. res.send(html)
  14. })
  15. .catch(err => {
  16. // oops, we had an error while rendering the page
  17. // we were told to redirect to another URL
  18. if (err.url) {
  19. if (err.code) {
  20. res.redirect(err.code, err.url)
  21. } else {
  22. res.redirect(err.url)
  23. }
  24. } else if (err.code === 404) {
  25. // hmm, Vue Router could not find the requested route
  26. // Should reach here only if no "catch-all" route
  27. // is defined in /src/routes
  28. res.status(404).send('404 | Page Not Found')
  29. } else if (process.env.DEV) {
  30. // well, we treat any other code as error;
  31. // if we're in dev mode, then we can use Quasar CLI
  32. // to display a nice error page that contains the stack
  33. // and other useful information
  34. // serve.error is available on dev only
  35. serve.error({ err, req, res })
  36. } else {
  37. // we're in production, so we should have another method
  38. // to display something to the client when we encounter an error
  39. // (for security reasons, it's not ok to display the same wealth
  40. // of information as we do in development)
  41. // Render Error Page on production or
  42. // create a route (/src/routes) for an error page and redirect to it
  43. res.status(500).send('500 | Internal Server Error')
  44. }
  45. })
  46. })
  47. })