HashHistory与BrowserHistory

时间:2016-12-13 20:36:11

标签: reactjs browser-history webpack-dev-server

我正在使用Node与Webpack-Dev-Server和React-Router。

在我的<?php $json = <<<JSON [ { "series": { "title": "Brooklyn Nine-Nine", "images": [ { "coverType": "fanart", "url": "http://thetvdb.com/banners/fanart/original/269586-15.jpg" }, { "coverType": "banner", "url": "http://thetvdb.com/banners/graphical/269586-g3.jpg" }, { "coverType": "poster", "url": "http://thetvdb.com/banners/posters/269586-13.jpg" } ], "year": 2013 } }, { "series": { "title": "The Middle", "images": [ { "coverType": "fanart", "url": "http://thetvdb.com/banners/fanart/original/95021-16.jpg" }, { "coverType": "banner", "url": "http://thetvdb.com/banners/graphical/95021-g14.jpg" }, { "coverType": "poster", "url": "http://thetvdb.com/banners/posters/95021-8.jpg" } ], "year": 2009 } }, { "series": { "title": "New Girl", "images": [ { "coverType": "fanart", "url": "http://thetvdb.com/banners/fanart/original/248682-43.jpg" }, { "coverType": "banner", "url": "http://thetvdb.com/banners/graphical/248682-g20.jpg" }, { "coverType": "poster", "url": "http://thetvdb.com/banners/posters/248682-14.jpg" } ], "year": 2011 } } ] JSON; $json = json_decode($json); // echo '<pre>' .print_r($json, 1) .'</pre>'; foreach ($json as $item) { echo 'Title: ' .$item->series->title .'<br/>'; foreach ($item->series->images as $img) { if ( $img->coverType == "banner" ) { echo 'Image Cover Type: ' .$img->coverType .'<br/>'; echo 'URL: ' .$img->url .'<br/>'; } } } ?> 文件中,我有:

app.js

使用<Router history={browserHistory}> <Route path="/" component={Layout}> <IndexRoute component={FindFriends} /> <Route path="/you" component={YouAndYourFriends} /> </Route> </Router> 浏览器会返回错误:browserHistory

当我将Cannot GET /you更改为browserHistory时,一切正常。

我的错误在哪里?或者您应该使用hashHistory做什么?

1 个答案:

答案 0 :(得分:3)

我有这个问题。 通过将以下内容添加到我的webpack.config.js

来解决此问题
devServer: {
  historyApiFallback: true,
  contentBase: path.join(__dirname, "dist"), // Not Related but important
}

您还可以通过命令行切换此选项: https://webpack.github.io/docs/webpack-dev-server.html#the-historyapifallback-option

就我而言,我把它放在配置文件中就可以了。

祝你好运!