React中实现13位EAN格式QR链接重定向至产品页失败（报404）求助

看起来你遇到的是路由匹配顺序或者规则精度的问题，导致直接访问mypage.com/[13位EAN]时触发404。下面给你一套针对Express.js的可行解决方案，应该能快速搞定你的需求：

核心方案：正则匹配+前置路由 #

在你的app.js里，一定要把这个重定向路由放在所有其他根路径路由（比如首页路由、静态文件路由）的最前面，这样它会优先匹配符合规则的路径：

// 精确匹配根路径下的13位纯数字EAN
app.get(/^\/(\d{13})$/, (req, res) => {
  const ean = req.params[0];
  // 固定QR码场景推荐用301永久重定向，搜索引擎也会同步更新索引
  res.redirect(301, `/products/${ean}`);
});

为什么这个方案能解决问题？ #

• 正则/^\/(\d{13})$会严格匹配根路径下的13位数字，不会误匹配/about或/1234这类不符合规则的路径
• 前置路由能避免被其他宽泛路由（比如app.get('/', ...)）或静态文件路由拦截，确保符合规则的请求先进入重定向逻辑
• 301重定向适合QR码这种固定链接场景，用户下次访问时浏览器会直接跳转到目标路径

排查你之前失败的可能原因 #

1. 路由顺序错误：如果你的重定向路由写在了express.static或者其他根路径路由之后，这些路由会先匹配并返回结果，导致你的重定向逻辑永远不会触发
2. 匹配规则太宽泛：比如之前用了app.get('/:ean', ...)，这种写法会匹配所有单段路径，不仅会和/contact这类正常路由冲突，还可能被静态文件的404逻辑覆盖
3. 正则规则不精确：比如没加^和$限定开头结尾，导致匹配到/1234567890123abc这类无效路径，最终触发404

额外兼容提示 #

如果需要兼容路径末尾带斜杠的情况（比如/4345674299043/），可以微调正则：

app.get(/^\/(\d{13})\/?$/, (req, res) => {
  const ean = req.params[0];
  res.redirect(301, `/products/${ean}`);
});

这个正则会同时匹配带或不带末尾斜杠的13位EAN路径。

内容的提问来源于stack exchange，提问作者ezfazio