Symfony和React路由器,找不到路由

Question

我正在使用Symfony3,我使用自己的react-router使用React.js创建一个包.

问题是当我在react中使用路由时,如果我重新加载页面,symfony路由模块发送'No Route Found'

我的路由是索引页面的/ admin和下一页的/ admin/data.

当我加载页面/管理员一切都很好,我点击链接转到/ admin/data,一切正常,反应动态发送给我,但现在当我刷新(F5)页面/管理员/数据时,Symfony拦截它并尝试在其代码中找到路由并重定向到/ 404"No Route Found".

我知道在AngularJs上,框架使用了ancors Path"localhost:// admin /#/ data",这似乎更容易管理但反应路由器使用"localhost:// admin/data"

我的symfony路由:

admin:
  path: /admin
  defaults: { _controller: BiBundle:Admin:default }

我的React路由:

import { Router, browserHistory } from "react-router";

<Router history={browserHistory}>
  <Route path="/admin" component={App}>
    <IndexRoute components={{content: DashboardPage}} />
    <Route path="data/list"
      components={{content: DataListPage}} />
    <Route path="*"
      components={{content: _ => <h1>Page not found.</h1>}} />
  </Route>
</Router>

我在/ admin页面上的链接:

<Link to={'/admin/data/list'}>Data</Link>

我正在考虑修改我的.htaccess以将所有/ admin/*重定向到/ admin,但这个问题似乎有些过分.

我也在使用Apache2服务器.

编辑

我已经用hashHistory替换了browserHistory

import { Router, hashHistory } from "react-router";

<Router history={hashHistory}>
  <Route path="/" component={App}>
    <IndexRoute components={{content: DashboardPage}} />
    <Route path="data/list"
      components={{content: DataListPage}} />
    <Route path="*"
      components={{content: _ => <h1>Page not found.</h1>}} />
  </Route>
</Router>

它有结果改变我在AngularJs中使用的路径(或足够接近),所以现在我有/ admin#/和/ admin#/ data/list,所以symfony总是catch/admin和react-router catch#/或#/ admin/data

你怎么看 ？这是好方法吗？

Answer 1

为了使您的AJAX路由可以直接从url访问（即/admin/data在浏览器URL中键入）而无需重定向到服务器端，您需要使基本路由（呈现React应用程序的Symfony路由）采用代表AJAX路由的参数。

为此，参数必须允许斜杠，例如：

admin:
    path: /admin/{reactRouting}
    defaults: { _controller: BiBundle:Admin:default, reactRouting: null }
    requirements:
        reactRouting: ".+"

对于更复杂的路由，您应该查看可以帮助您的FOSJsRoutingBundle。