在服务器上呈现react-router v4和redux时,浏览器历史logging需要DOM错误

我试图为我的应用程序服务器呈现内容,使用react-router v4,redux和express,但我得到Browser history needs a DOM在terminalBrowser history needs a DOM错误。 我也使用react-router-config来保持我的路由更有条理。 看到一个解决scheme,build议应该在服务器上创build存储,所以我试图从store.js文件复制代码到服务器,但它没有工作。 我能做些什么来解决这个非常不愉快的错误?

routes.js

 const routes = ( { component: App, routes: [ { path: '/', exact:true, component: Home }, { path: '/login', exact:true, component: Login }, { path: '/registration', exact:true, component: Registration }, { path: '/person/:id', exact:true, component: UserPage }, { path: '/myPage', exact:true, component: MyPage }, { path: '/goodBye', exact:true, component: GoodBye }, { path: '*', component: NoMatch } ] } ); 

App.js

 import React from 'react'; import ReactDOM from 'react-dom'; //import '../styles/app.scss' import {Provider} from 'react-redux'; import {Grid} from 'react-bootstrap'; import store from './store/store'; import routes from './routes'; import { createBrowserHistory } from 'history'; import { syncHistoryWithStore } from 'react-router-redux'; import { renderRoutes } from 'react-router-config'; import { BrowserRouter as Router} from 'react-router-dom'; import { ConnectedRouter, Switch } from 'connected-react-router'; class App extends React.Component { render() { return ( <Provider store={store}> <Grid fluid={true}> <ConnectedRouter history={createBrowserHistory()}> <Switch> {renderRoutes(routes)} </Switch> </ConnectedRouter> </Grid> </Provider> ); } } const isBrowser = typeof window !== 'undefined'; if(isBrowser) { ReactDOM.render(<App/>, document.getElementById('root')); } 

路由处理程序

 import express from 'express'; import React, {Component} from 'react'; import { renderToString } from 'react-dom/server'; import routes from '../../js/routes'; import {StaticRouter} from 'react-router'; import { renderRoutes } from 'react-router-config'; import { Provider } from 'react-redux'; import store from '../../js/store/store'; const router = express.Router(); router.get('*',(req,res) => { let context = {}; const content = renderToString( <Provider store={store}> <StaticRouter location={req.url} context={context}> {renderRoutes(routes)} </StaticRouter> </Provider> ); if(context.status === 404) { res.status(404); } res.render('index', {title: 'Express', data: store.getState(), content }); });