Nuxt.js路由
Nuxt.js路由
提问于 2020-09-14 02:21:00
我正在从SEO迁移到Nuxt.js，并且我试图保持相同的urls，这样我就可以保持ASP.NET评级
我当前的URL是
www.url.com/#computers/#laptops/#dell?page=1
所有#都是动态值，因此URL也可能是
www.url.com/#phones/#smartphones/#apple?page=1
将所有这些URL指向一个页面项目并能够获取每个#和QueryString值的最简单方法是什么？
提前感谢
回答 1
Stack Overflow用户
发布于 2020-09-14 02:43:47
您可以使用nuxt中的serverMiddleware来实现这一点
为您的中间件创建一个文件：
middleware/server/seoMiddleware.js
将其添加到serverMiddleware块中的nuxt.config.js中：
serverMiddleware: [
'~/middleware/server/seoMiddleware.js'
]创建一个文件来处理301的列表：
middleware/server/301.js
在301.js中使用正则表达式添加路径映射
export default [
{ from: '/(#[\w\d]+)\/(#[\w\d]+)\/(#[\w\d]+)', to: 'items', capture: true }
]打开你的seoMiddleware.js
const redirects = require('./301.js').default
export default function (req, res, next) {
const redirect = redirects.find(redirect => req.url.test(redirect.from))
if (redirect) {
const to = redirect.capture ? applyCapturesToUrl(req.url, redirect) : redirect.to
res.writeHead(301, { Location: to })
res.end()
}
// failover
next()
}
const applyCapturesToUrl(url, redirect) {
const matches = url.match(redirect.from)
return `/${redirect.to}/` + matches.map(match => match.replace('#', '')).join('/')
}我们在这里使用了一些简单的正则表达式来根据您的URL结构创建捕获组，并使用serverMiddleware截获请求并在找到匹配的情况下返回301 (永久重定向)。我们使用next()进行故障切换，如果未找到匹配项，则允许请求通过。我们在重定向对象上使用capture标志，这样我们就知道当我们处理捕获组时，如果没有它，我们只能进行简单的模式匹配。
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/63874125
复制相关文章
相似问题
腾讯云开发者
