Next.js: Canary Command-R refresh shows 404

Created on 20 Feb 2018  路  4Comments  路  Source: vercel/next.js

When clicking around it works fine. But when I press Command-R I get a 404. Why?

Is there something I need to setup with routes for SSR?

Most helpful comment

I did the following and it works:

    server.get('*', (req, res) => {
      // https://github.com/zeit/next.js/issues/1189
      const parsedUrl = parse(req.url, true)
      const { pathname, query } = parsedUrl

      if (pathname.length > 1 && pathname.slice(-1) === '/') {
        app.render(req, res, pathname.slice(0, -1), query)
      } else {
        handle(req, res, parsedUrl)
      }
    })

All 4 comments

OK It has to do with

http://localhost:3000/my-community/

vs

http://localhost:3000/my-community

The http://localhost:3000/my-community works fine. How do I use that to make both work?

I did the following and it works:

    server.get('*', (req, res) => {
      // https://github.com/zeit/next.js/issues/1189
      const parsedUrl = parse(req.url, true)
      const { pathname, query } = parsedUrl

      if (pathname.length > 1 && pathname.slice(-1) === '/') {
        app.render(req, res, pathname.slice(0, -1), query)
      } else {
        handle(req, res, parsedUrl)
      }
    })

You can also use https://www.npmjs.com/package/connect-slashes if you're running express and it'll add the / at the end of your url for you. It solves a few bugs that your hand made code might not cover.

It's something that has to be handled in userland, we basically enforce without / at the end.

Was this page helpful?
0 / 5 - 0 ratings

Related issues

jesselee34 picture jesselee34  路  3Comments

irrigator picture irrigator  路  3Comments

rauchg picture rauchg  路  3Comments

sospedra picture sospedra  路  3Comments

renatorib picture renatorib  路  3Comments