koa2+react搭建ssr时,服务端做重定向时不能正确拿到StaticRouter处理过后的context
发布于 1 个月前 作者 chtic123 547 次浏览 来自 问答

最经在搭一个koa2+react的ssr架构,遇到个问题,path="/“需要重定向到path=”/home" jsx里面用到<Route path="/" render={() => <Redirect to="/home" />} /> ssr用到的代码如下 ssr-entry.js 1516951924(1).jpg server.js 1516952176(1).jpg

可以看到我现在是那ctx.url判断写死重定向到/home的 但实际上按照react-router V4的官方文档,

我应该在const app = await serverBundle(store, routerContext, ctx.url);之后去判断routerContext.url是否存在。 但是当我按照官方文档的写法,访问path="/"的路径,routerContext依然是{}。 1516952527(1).jpg 1516952891(1).jpg 可以看到访问/的时候,打印的routerContext依然为{}

希望我表述清楚了,求大牛给支个招,是我少做了哪一步吗?之前用express做过是没问题的。

6 回复

似乎发现了问题所在,当我尝试在ssr-entry.js里面将参数都打印一下的时候发现 好像在server.js里面打印的console.log('routerContext ==> ', routerContext)会在ssr-entry所有的console执行之前打印。 但那都不是异步方法,这是为何?有大神知道的吗?加不加async都一样

楼主,你这样<Redirect to="/home" /> 只是走的前端路由,是不会发送到后端的。

@MaelWeb 我是按照react-router官方的SSR实例写的,在Route里面render一个<Redirect to="/home" />,然后在服务端用StaticRouter处理的,是哪里写错了吗

问题已经解决了,囧。 在这里说一下吧 往往这种不合常理的事都是一些低级错误,气哭,希望大家别都能细心一点,别犯我这样的错误了吧。 react-router的官方实例写的很清楚,是需要经过ReactDomServer.renderToString处理之后的context才能在里面获取到Redirect的上下文,但我是serverBundle方法之后就去判断的,所以会拿不到,因为没有经过render啊,哈哈哈哈哈,尴尬。 归结主要的原因一个是文档没有看清楚,二是对aysnc/await与Promise的配合使用还理解的不够透彻,又认真的看了一遍aysnc的原理,很多东西都豁然开朗,再去看我的代码一下就发现了问题所在~

最近也在初学服务端渲染,有个问题想请教下吗?.. 我觉得整体view层可以分成三块-- 单独的APP一块, 然后服务器和浏览器的router各一块 这样可以吗?
然后遇到个问题走不动了…webpack这玩意儿打包出来的ES6的export的东西,commonjs咋拿到呀… 卡住了…webpack文档太多了,已经老眼昏花了… 嗯…可以伸手要点资料啊…参考之类的么?..么么哒:D

回到顶部