diff --git a/packages/vue-ssr/README.md b/packages/vue-ssr/README.md index 7876772..b70856f 100644 --- a/packages/vue-ssr/README.md +++ b/packages/vue-ssr/README.md @@ -84,7 +84,7 @@ VueSSR.createApp = function (context) { // no matched routes if (!matchedComponents.length) { - reject({ code: 404 }) + reject({ code: 404, message: 'Not found' }) } // Can use components prefetch here... @@ -152,6 +152,60 @@ VueSSR.createApp = function (context) { } ``` +### Set status code for custom 404 error template + +`NotFound.vue` + +```vue + + + +``` + +`routes.js` + +```javascript +import NotFound from '/imports/ui/views/NotFound'; + +export default [ + // ... + { + path: '*', + name: 'not-found', + component: NotFound, + }, +]; +``` + +`vue-ssr.js` + +```javascript +VueSSR.createApp = function (context) { + return new Promise((resolve, reject) => { + const { app, router } = CreateApp() + // Set the URL in the router + router.push(context.url) + + router.onReady(() => { + // name of wildcard route + if (router.currentRoute.name === 'not-found') { + context.statusCode = 404; + } + + // ... + + resolve(app) + }) + }) +} +``` + --- LICENCE ISC - Created by Guillaume CHAU (@Akryum) diff --git a/packages/vue-ssr/server/index.js b/packages/vue-ssr/server/index.js index de7e855..212af22 100644 --- a/packages/vue-ssr/server/index.js +++ b/packages/vue-ssr/server/index.js @@ -64,8 +64,9 @@ patchSubscribeData(VueSSR) const renderer = createRenderer() -function writeServerError (sink) { - sink.appendToBody('Server Error') +function writeServerError (sink, { code = 500, message = 'Server Error' } = {}) { + sink.setStatusCode(code) + sink.appendToBody(message) } WebApp.rawConnectHandlers.use(cookieParser()) @@ -125,9 +126,11 @@ onPageLoad(sink => new Promise((resolve, reject) => { const head = ((appendHtml && appendHtml.head) || context.head) || '' const body = ((appendHtml && appendHtml.body) || context.body) || '' const js = ((appendHtml && appendHtml.js) || context.js) || '' + const statusCode = ((appendHtml && appendHtml.statusCode) || context.statusCode) || 200 const script = js && `` + sink.setStatusCode(statusCode) sink.renderIntoElementById(VueSSR.outlet, html) sink.appendToHead(head) sink.appendToBody([body, script]) @@ -137,7 +140,7 @@ onPageLoad(sink => new Promise((resolve, reject) => { ) }).catch(e => { console.error(e) - writeServerError(sink) + writeServerError(sink, e) resolve() }) } catch (error) {