Express.js - 可以找到我的路线

Posted 2023-02-27

【中文标题】Express.js - 可以找到我的路线

【英文标题】：Express.js - can find my route

【发布时间】：2018-03-23 21:28:33

【问题描述】：

我正在使用 react.js 和 express.js 并在我的 fetch 请求中收到 404 错误。

我只是想让我的路线返回testing express.js...

[app.js]

'use strict';

const NODE_ENV = process.env.NODE_ENV;
const PORT = process.env.PORT;

const next = require('next');
const express = require('express');
const api = require('./api');

const client = next( dev: NODE_ENV === 'development' );
const clientHandler = client.getRequestHandler();
const app = express();

client.prepare().then(() => 
  app.use('/api', api);
  app.get('*', (req, res) => clientHandler(req, res));
);

const listener = app.listen(PORT, err => 
  if (err) throw err;
  console.log('listening on port: %d', listener.address().port); //eslint-disable-line
);

[/api/index.js]

'use strict';

const express = require('express');
const app = express();

app.get('/api/test', function (req, res) 
    res.send('testing express.js...');
);

module.exports = app;

[Body.js]

import React from 'react';

export default class Body extends React.Component 
  constructor(props) 
    super(props);    
    this.fetchContacts = this.fetchContacts.bind(this);
  

  componentDidMount() 
    this.fetchContacts();
  

  async fetchContacts() 
        const res = await fetch('/api/test');
    const contacts = await res.json();
    log(contacts);
    this.setState( contacts );
  

  render() 
    return <div>hello world!</div>;
  

问题：为什么会出现 404 错误？

【参考方案1】：

为了让你的/api/test 路由正常工作，你需要改变这个：

app.get('/api/test', function (req, res) 
    res.send('testing express.js...');
);

到这里：

app.get('/test', function (req, res) 
    res.send('testing express.js...');
);

您的路由器已经在查看/api，所以当您在路由器上为/api/test 设置路由时，您实际上是在为/api/api/test 创建路由。要修复它，请进行上述更改。

---

此外，您的 index.js 文件不应使用 app 对象。它应该使用express.Router() 对象，尽管app 对象也是一个路由器，所以它可能有点工作，但它不应该这样做。

【讨论】：

哇，我不敢相信，哈哈。我发誓我试过 3 次...谢谢！

【参考方案2】：

这不是在 nodejs 上加载 react JS 文件的方法，请遵循这个基本（React + NodeJS）指南：

https://blog.yld.io/2015/06/10/getting-started-with-react-and-node-js/#.Wd7zSBiWbyg

或者使用“create-react-app”：

https://medium.com/@patriciolpezjuri/using-create-react-app-with-react-router-express-js-8fa658bf892d