Javascript 使用URL响应路由器打开页面

我对react编程是新手。我试图自己解决这个问题，但我坚持了以下问题

我有以下代码

import { BrowserRouter as Router, Route, Switch } from 'react-router-dom'; 

class Main extends Component {

render() {   
        return ( 
    <Router>
     <Switch>
       <Route exact path='/' component={Content} />   
       <Route path='/user/:id' component={User} /> 
       <Route path='*' component={NotFound} />
     </Switch>  
    </Router>
    );
}

export default Main

---

如果出现该错误，则表示服务器正在尝试处理路由。因此，您应该确保服务器允许SPA处理路由

例如，如果您使用的是

express

，则可能需要执行以下操作：

app.use(express.static(path.join(__dirname, 'client/build')));

app.get('/api/whatever', (req,res) => {
  // Whatever your api does
});

// Allow the SPA to take care of the routing
app.get('*', (req,res) =>{
    res.sendFile(path.join(__dirname+'/client/build/index.html'));
});

---

这是使用

create react app

？但不要尝试在控制台中出现任何错误？您是使用服务器端语言还是只使用react js app？当您将整个url复制并粘贴到浏览器中时，浏览器会询问您的服务器上是否存在具有此路由的文件。当然不是因为你在做水疗。因此，您的服务器需要将index.html返回到任何传入的请求中。@apokryfos当然除了“静态”资产；-）（即js文件、css文件、图像等）谢谢。我在网页中添加了以下内容后进行了管理<代码>输出：{publicPath:'/'}，devServer:{\historyApiFallback:true}@ketan您从来没有提到过使用webpack dev server的事实。事实上，您明确表示您正在使用自己的express server“_(ツ)_/不管怎样，我很高兴知道您发现了问题。@ketan鉴于您提供的信息量，我认为我的答案应该标记为已接受。因为问题实际上是服务器阻止客户端处理路由。

app.use(express.static('dist'));

app.get('*', (req, res) => {
    res.sendFile(path.join(__dirname, './index.html'));
});

app.listen(port, function (err) {
  if (err) {
        console.log(err);
    } else {
        open('http://localhost:' + port);
    }
})

app.use(express.static(path.join(__dirname, 'client/build')));

app.get('/api/whatever', (req,res) => {
  // Whatever your api does
});

// Allow the SPA to take care of the routing
app.get('*', (req,res) =>{
    res.sendFile(path.join(__dirname+'/client/build/index.html'));
});