如何使用express和react路由器发送GET/POST请求？

目前，我已将express设置为提供一个静态html页面，其中安装了react组件。我也在使用react路由器，因为我有嵌套的路由。例如：

我有一个应用程序组件（绿色轮廓）。在该组件中，我呈现一个页眉组件（橙色轮廓）和一个页脚组件（红色轮廓），并通过this.props.children传入一个审阅组件（蓝色轮廓）

myserver.js文件（express）：

const express = require('express');

const app = express();

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

const PORT = process.env.PORT || 3000;

app.listen(PORT, function() {
  console.log(`Listening on port ${PORT}...`);
});

import React from 'react';
import ReactRouter, {
  Router,
  Route,
  browserHistory,
  IndexRoute,
} from 'react-router';

import App from '../components/App';
import Home from '../components/Home';
import Review from '../components/Review';
import Game from '../components/Game';

const routes = (
  <Router history={browserHistory}>
    <Route path="/" component={App} >
      <IndexRoute component={Home} />
      <Route path="/game/:id" component={Game} />
      <Route path="/game/:id/review" component={Review} />
      <Route path="*" component={Home} />
    </Route>
  </Router>
);

export default routes;

My routes.js文件（反应路由器）：

const express = require('express');

const app = express();

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

const PORT = process.env.PORT || 3000;

app.listen(PORT, function() {
  console.log(`Listening on port ${PORT}...`);
});

import React from 'react';
import ReactRouter, {
  Router,
  Route,
  browserHistory,
  IndexRoute,
} from 'react-router';

import App from '../components/App';
import Home from '../components/Home';
import Review from '../components/Review';
import Game from '../components/Game';

const routes = (
  <Router history={browserHistory}>
    <Route path="/" component={App} >
      <IndexRoute component={Home} />
      <Route path="/game/:id" component={Game} />
      <Route path="/game/:id/review" component={Review} />
      <Route path="*" component={Home} />
    </Route>
  </Router>
);

export default routes;

从“React”导入React；
导入路由器{
路由器，
路线,，
浏览历史，
IndexRoute，
}来自“反应路由器”；
从“../components/App”导入应用程序；
从“../components/Home”导入Home；
从“../components/Review”导入审查；
从“../components/Game”导入游戏；
常数路由=(
);
导出默认路径；

我的问题是，我希望能够发出GET/POST请求（从游戏组件GET显示来自db的所有评论，并从评论组件POST创建新评论），但这应该在哪里发生？我无法判断它是否必须发生在我的express routes中，因为在我看来，express所做的一切似乎都是呈现静态html页面，然后react router接管之后处理要显示的组件

---

非常感谢您的任何帮助

对于

GET

请求，您可以在单独的函数中加载初始数据，而不是在安装组件后使用

componentDidMount

加载该数据，如下所示：

class Game extends React.Component {  
  constructor() {
    this.state = { data: [] }
  }

  loadCommentsFromServer() {
    $.ajax({
       ....
      }
    });
  }

  componentDidMount() {
    this.loadCommentsFromServer();
    setInterval(this.loadCommentsFromServer, this.props.pollInterval);
  }
}

---

您只需为

POST

设置另一个功能即可

我只想分享我的经验，希望能有所帮助。我从不在反应路线上做请求，尽管它可以。所以，我更喜欢在组件内部的

componentDidMount（）

方法上执行此操作，在您的情况下，它将在游戏组件上执行

我考虑的是使组件可重用，特别是当组件的大小取决于请求时。在组件内部实现请求的好处是，无论您在路由路径上的何处装载组件，当它装载时，组件都会自动调用请求

根据我的经验，您也可以在express上以服务器端请求的形式发出请求，因为存在需要从服务器端执行请求处理的特定条件。例如，当从客户端向公共API请求时，处理跨源资源共享（CORS）问题，使用OAuth等身份验证请求处理，等等

如果您的请求非常简单，我认为组件内部的请求就足够了。

---

希望能有帮助。谢谢你

这方面运气好吗？如何访问location.query行上的react组件中的POST参数以访问GET参数？