首页 文章

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

提问于
浏览 次
5

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

问题是我在反应中使用路由时，如果我重新加载页面，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服务器 .

EDIT

我已经用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

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

javascript reactjs react-router symfony

1 回答

  • 4

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

    为此，参数必须allow slashes，例如：

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

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

    回复于

相关问题