Use-case: When router.base is not default, when going to /, instead of 404, redirect to router.base as a Nuxt connect middleware example

[renoirb]

What problem does this feature solve?

This is maybe an edge-case, and the point of nuxt.config.js' router.base is for when a Web server will serve Nuxt elsewhere than the domain root.

But when in local development, hitting localhost, when router.base is not / returns a 404.

What does the proposed changes look like?

We can use that situation to document how nuxt hooks works.

NOTE I have a functioning connect middleware, . Let's add this to the docs.

How to use example

PS: In the gist, I've added comments.

1. Setup Nuxt config

   // file: nuxt.config.js
   import hooks from './hooks'
   export default {
     router: {
       base: '/portal',
     },
     hooks: hooks(this),
   }

2. Hooks module setup

   // file: hooks/index.js
   import render from './render'
   export default (nuxtConfig) => ({
     // e.g. 'render:context'
     render: render(nuxtConfig),
   })

3. Render hooks module

   // file: hooks/render.js
   import redirectRootToPortal from './route-redirect-portal'
   export default (nuxtConfig) => {
     const router = Reflect.has(nuxtConfig, 'router') ? nuxtConfig.router : {}
     const base = Reflect.has(router, 'base') ? router.base : '/portal'
     return {
       setupMiddleware(app) {
         app.use('/', redirectRootToPortal(base))
       },
     },
   }

4. Middleware code

   // file: hooks/route-redirect-portal.js
   import parseurl from 'parseurl'
   export default (desiredContextRoot) => function projectHooksRouteRedirectPortal(req, res, next) {
     const desiredContextRootRegExp = new RegExp(`^${desiredContextRoot}`)
     const _parsedUrl = Reflect.has(req, '_parsedUrl') ? req._parsedUrl : null
     const url = _parsedUrl !== null ? _parsedUrl : parseurl(req)
     const startsWithDesired = desiredContextRootRegExp.test(url.pathname)
     const isNotProperContextRoot = desiredContextRoot !== url.pathname
     if (isNotProperContextRoot && startsWithDesired === false) {
       const pathname = url.pathname === null ? '' : url.pathname
       const search = url.search === null ? '' : url.search
       const Location = desiredContextRoot + pathname + search
       res.writeHead(302, {
         Location,
       })
       res.end();
     }
     next()
   }

[renoirb]

Ping, I've fleshed out a complete working example. Updated here, and in the Gist.

[renoirb]

Ping @clarkdo I could include this in hare.

[clarkdo]

@renoirb Good job!

[renoirb]

Thanks for the feedback Clark.

I added you just to double check if I'm on the right track before spending time writing docs with possibly misunderstanding mistakes.

Before writing, can you confirm if you see issues in my example related to:

1. Passing this as reference from nuxt.config.js when I'm {hooks: hooks(this)}.
   What about defaults and handling?
   I guess that since I already Reflect.has() and give an empty object, mistakenly not setting a value won't break.
   Won't that pollute/put weight into the execution stack?

2. How certain can we be about connect’s http.ServerResponse’s _parsedUrl property?
   Should I just drop the parseurl dependency deduplication?

3. Lastly

   • Should I make this a docs page somewhere in particular, recommendations in where to put?
   • Should I make this a package we can optionally load in packages/ maybe as optionnal hooks. If that's planned

Thanks again for your time, and advice!

[debs-obrien]

Thanks for your contributions. We are now closing this repo as docs have now moved to nuxtjs.org using content module. Please continue your contributions on that site especially focusing on the guides folder which is the new docs. Thanks

https://github.com/nuxt/nuxtjs.org/blob/master/README.md

[renoirb]

Wait, I thought the PR documenting this was already merged. What this a ticket about a PR, and we forgot to close?

I'll spend time looking this up this weekend

[debs-obrien]

that would be great thanks. just trying to archive repo and make sure old issues are dealt with or closed