未捕获到的SyntaxError：react-router中出现意外的令牌<，最后带有斜杠

Question

I am creating a new app with react-router and I've confronted with this follow trouble: When I insert a URL with http://localhost:3000/app/ , trailing slash in the end of URL, it returns the message Uncaught SyntaxError: Unexpected token < , however when I insert the same URL but without trailing slash in the end, http://localhost:3000/app , it works!

How can I keep a pattern of not use the trailing slash in the end of URL and redirect all who has this kind to URLs which not have this?

Answer 1

To solve this can make changes in server-side, in this case I am using Node.js and Express.js as my server, with a function to treat the URL and to redirect this to this URL already treated:

app.use(function(req, res, next) {
  if (req.path.length > 1 && /\/$/.test(req.path)) {
    var query = req.url.slice(req.path.length)
    res.redirect(301, req.path.slice(0, -1) + query)
  } else {
    next()
  }
});

This function is receiving requisition, response and next matching route as parameters. If string URL was bigger than one and if the last parameter of this string URL is / , it makes a 301 redirect to this URL without / , else it continuous the call to the next matching route.