为什么 react-router 在服务器中不起作用？刷新页面后显示404错误答案

【问题标题】：Why react-router does not work in the server? It shows 404 error after refreshing the page为什么 react-router 在服务器中不起作用？刷新页面后显示404错误
【发布时间】：2017-03-24 05:54:12
【问题描述】：

我有部署在服务器中的项目，但是反应路由器无法正常工作。但是，它在本地服务器上运行良好。我不知道为什么？我的意思是，当我转到不同的页面并刷新时，它会显示 404 错误。拜托，有人帮忙！！！例如：https://sciencepark.kz/researchpage

我的反应路由器代码

const App=(props)=>{
    return(
        <Router history={browserHistory}>
            <Route path={"/"} component={Root}>
                <IndexRoute component={Layout}/> // make default page appears in main page
                <Route path={"newspage"} component={NewsPageContainer}/> //passing params
                <Route path={"researchpage"} component={ResearchPageContainer}/> //passing params
                <Route path={"servicepage"} component={ServicePage}/> //passing params
                <Route path={"businessincubatorpage"} component={BusinessIncubatorPage}/> //passing params
                <Route path={"startuppage"} component={StartUpPageContainer}/> //passing params
                <Route path={"fullinfomedia(/:id)"} component={FullInfoMediaContainer}/> //passing params
                <Route path={"fullinfonews(/:id)"} component={FullInfoNewsContainer}/> //passing params
                <Route path={"fullinfostartups(/:id)"} component={FullInfoStartUpsContainer}/> //passing params
                <Route path={"fullinforesearches(/:id)"} component={FullInfoResearchesContainer}/> //passing params
                <Route path={"layout"} component={Layout}/>
            </Route>
            <Route path={"layout"} component={Layout}/>
        </Router>
    )
  };

【问题讨论】：

标签： reactjs server react-router

【解决方案1】：

代码中的 browserHistory 可能需要一个基本名称。看看类似问题的答案是否适合您：https://stackoverflow.com/a/36765496/4772334

【讨论】：

【解决方案2】：

您需要使用 useRouterHistory 添加 basename。

const browserHistory = useRouterHistory(createHistory)({
     basename: '/myPage/public'
    });

//中间件

const middleware = [
  ...
  ...
 routerMiddleware(browserHistory) 
];

// 为 Redux 应用所有中间件

const enhancers = composeEnhancers(
  applyMiddleware(...middleware)
);

【讨论】：