在 koa2 中如何让 react 应用管理自己的路由?
发布于 1 个月前 作者 youngluo 567 次浏览 来自 问答

项目采用 koa2 作为中间层进行接口转发,前端采用 react 开发,最后将打包后的文件放到 koa2 的目录下作为静态资源访问,目前刷新浏览器会出现 404 情况,怎样操作才能让 react 管理自己的路由(非 SSR )

5 回复

当后端匹配到前端路由的时候给它重定向到首页,一般这个是由nginx来做~

react vue单页面应用,虽然url显示路由一直在切换,其实只是H5 history 的路由切换 。对面后端他本身根本没有跳转,还在当前页面,所以后端不管他怎么切换路由都重定向到首页就OK了。

get(/*, ctx => { ctx.render(‘index’) })

楼上已经说了…

www.example.com/#/auth/login 这个路由本质上是请求 /index.html 文件,然后由 React Router 再根据 # 后面的内容进行路由匹配

如果去掉 # 号, www.example.com/auth/login 实际上请求的是 /auth/login. 但服务器上没有这个文件,只能返回 404

所以要想去掉 #,就要做重定向

/#/auth/login >>> /auth/login

或者简单粗暴点的,把所有 404 的请求,都返回 index.html. 相当于把路由控制权,交还给了前端静态路由

已解决,感谢大家

回到顶部