How to rewrite url when using routers

[barisusakli]

Hello, trying to rewrite the url to redirect requests but having some problems when the url doesn't have a trailing slash. Here is a minimal app to demonstrate.

const express = require('express')
const app = express()
const port = 3000
const router = express.Router()

const subFolder = '/forum'

app.use(subFolder, rewrite);

function rewrite(req, res, next) {
    console.log(req.path)
    if (req.path !== '/') {
        return next()
    }
    req.url = '/categories'
    app.handle(req, res, next);
}

router.get('/regular-page', (req, res) => res.send('Hello World!'))
router.get('/categories', (req, res) => res.send('Categories'));
app.use(subFolder, router);

app.listen(port, () => console.log(`Example app listening on port ${port}!`))

The goal is to redirect localhost:3000/forum and localhost:3000/forum/ to localhost:3000:/forum/categories. Right now only localhost:3000/forum/ works. The other just 404s.

Thanks.

[dougwilson]

I can help fix your code, but need to know: given the url /forum/foo do you want that not rewritten or rewritten to /categories/foo ?

[barisusakli]

Hi @dougwilson /forum/foo should just go to /forum/foo only want to rewrite /forum and /forum/ everything else should go to their regular handlers, so /forum/regular-page says Hello World!

[barisusakli]

This seems to work, gonna test it in our main app 🤔

const express = require('express')
const app = express()
const port = 3000

const router = express.Router()

const subFolder = '/forum'

router.use('/', rewrite); // changed from app.use(subFolder, rewrite)

function rewrite(req, res, next) {
    console.log(req.path)
    if (req.path !== '/') {
        return next()
    }
    req.url = '/categories'
    app.handle(req, res, next);
}

router.get('/regular-page', (req, res) => res.send('Hello World!'))
router.get('/categories', (req, res) => res.send('Categories'));
app.use(subFolder, router);

app.listen(port, () => console.log(`Example app listening on port ${port}!`))

[dougwilson]

Hi @barisusakli there is a lot going on between your examples that may be causing the mix up. For example, when you app.use(path, fn), the req.url with in the fn will have the path chopped off it, and if you alter the req.url property within that fn, you're only going to alter that portion of the url, as after fn exits, the path is still restored back to the front of the URL. This is by design.

In your second example, you've moved the .use(path, fn) from the app and onto the router that is mounted under /forum and then are looping the request back through the top of your app. This it's great because (1) it will re-invoke all your middlewares, which may not be desirable and (2) it can cause a loop condition.

Ideally, you'll want to do the URL rewrite in a .use that is mounted at the point of the rewrite. Since you are trying to rewrite /forum to /forum/category, the point of the rewrite can just be be /forum, so you can mount it there.

Because you're using a router pattern, and /forum will always enter into the mount point with a non-empty path, you can just put a .use at the top of your router to change / to /categories:

router.use(function rewrite(req, res, next) {
    if (req.url === '/') req.url = '/categories'
    next()
})

Here is the completed app:

const express = require('express')
const app = express()
const port = 3000
const router = express.Router()

const subFolder = '/forum'

router.use(function rewrite(req, res, next) {
    if (req.url === '/') req.url = '/categories'
    next()
})
router.get('/regular-page', (req, res) => res.send('Hello World!'))
router.get('/categories', (req, res) => res.send('Categories'));
app.use(subFolder, router);

app.listen(port, () => console.log(`Example app listening on port ${port}!`))

I hope this helps!

[barisusakli]

@dougwilson thanks for the detailed reply.