我想为我的网站创建一个返回 JSON 的 Express API。为了实现这一点，我更改了默认 users.js 路由中的代码。 这是 routes/users.js 的代码：

var express = require('express');
var router = express.Router();

/* GET users listing. */
router.get('/categories', function(req, res, next) {
  res.json([
    {user_id: 1, name: "Jack"},
    {user_id: 2, name: "John"}
  ]);
});

module.exports = router;

我在 App.js 组件中获取并打印此 JSON：

import React, { Component } from 'react';
import TopBar from './Components/TopBar';
import Timeline from './Components/Timeline';
import './App.css';

class App extends Component {
  constructor(props) {
    super(props);
    this.state = {
      users: [],
    }; 
  }

  componentDidMount() {
    fetch('/users')
    .then(res => res.json())
    .then(users => this.setState({users}));
  }

  render() {
    return (
      <div className="App">
        <TopBar/>
        <Timeline/>
        {this.state.users.map(user => 
          <li key={user.user_id}>{user.name}</li>
        )}
      </div>
    )
  };
}

export default App;

它运行正常，没有任何错误，但我还想获取类别列表，因此我创建了一个 routes/categories.js 文件，其中包含以下代码：

var express = require('express');
var router = express.Router();

/* GET categories listing. */
router.get('/', function(req, res, next) {
  res.json([
    {category_id: 1, name: "Math"},
    {category_id: 2, name: "English"},
    {category_id: 3, name: "Business"},
    {category_id: 4, name: "Politics"}
  ]);
});

module.exports = router;

问题是，当我尝试从 Categories.js 组件中的此路由获取 JSON 时，它不起作用。这是组件的代码：

import React, { Component } from 'react';

class Categories extends Component {
    constructor(props) {
        super(props);
        this.state = {
          categories: [],
        }; 
      }

      componentDidMount() {
        fetch('/categories/')
        .then(res => res.json())
        .then(categories => this.setState({categories}));
        console.log(this.state.categories);
      }
      render() {
          return (
              <>
                {this.state.categories.map(category => 
                    <li key={category.category_id}>{category.name}</li>
                )}
              </>
          )
      }
}

export default Categories;

我收到以下错误：

Failed to load resource: the server responded with a status of 404 (Not Found)
localhost/:1 Uncaught (in promise) SyntaxError: Unexpected token < in JSON at position 0

我不知道这是语法错误还是我没有在 Express 中使用正确的设计模式。谢谢阅读。