[404（未找到），尝试将信息发布到heroku

信息发布到heroku"/>

[404（未找到），尝试将信息发布到heroku

我有一个具有明确后端的React应用程序。我正在尝试从前端到后端进行读取。此访存是一个登录名，我在其中传递了各种凭据来检查我的clearDB以查看用户是否合法。由于某种原因，我收到未找到的404。好消息是404表示我的后端和前端通信良好，但坏消息是它无法正确访问路由。我在这里提供了一些文件。如果您需要其他文件，请告诉我。一如既往，感谢您的支持，并期待进行讨论。

文件夹结构：

DemoApp
  >bin
  >classes
  >client
    ->build
    ->node_modules
    ->public
    ->public
    ->src
    ->package.json
    ->static.json
  >Design
  >node_modules
  >public
  >routes
    ->api.js
  >views
  app.js
  package.json

控制台日志：

Login.js:69 POST https://<hostname>.herokuapp/api/login 404 (Not Found)

app.js（NodeJS后端）：

...
const corsOptions = {
   origin: 'http://localhost:3000',
   credentials: true
}
app.use(cors(corsOptions))

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

app.get('*', function(request, response) {
    response.sendFile(path.join(__dirname, '/client/build', 'index.html'));
});

package.json（位于客户端文件夹中：] >>

{
  "name": "app",
  "version": "0.1.0",
  "private": true,
  "dependencies": {
    "@testing-library/jest-dom": "^4.2.4",
    "@testing-library/react": "^9.5.0",
    "@testing-library/user-event": "^7.2.1",
    "bootstrap": "^4.4.1",
    "email-validator": "^2.0.4",
    "owasp-password-strength-test": "^1.3.0",
    "password-validator": "^5.0.3",
    "prop-types": "^15.7.2",
    "react": "^16.13.1",
    "react-bootstrap": "^1.0.1",
    "react-dom": "^16.13.1",
    "react-dropdown": "^1.7.0",
    "react-router-dom": "^5.1.2",
    "react-scripts": "3.4.1",
    "semantic-ui-react": "^0.88.2"
  },
  "scripts": {
    "start": "react-scripts start",
    "build": "react-scripts build",
    "test": "react-scripts test",
    "eject": "react-scripts eject"
  },
  "eslintConfig": {
    "extends": "react-app"
  },
  "browserslist": {
    "production": [
      ">0.2%",
      "not dead",
      "not op_mini all"
    ],
    "development": [
      "last 1 chrome version",
      "last 1 firefox version",
      "last 1 safari version"
    ]
  }
}
static.json

{
  "root": "build/",
   "routes": {
    "/assets/*": "/assets/",
    "/**": "index.html"
  }
}
Login.js（REACT Component）：

const url = '/api/login'

fetch(url, {
 method: 'POST',
 credentials: 'include',
 headers: {
     'Content-Type': 'application/json'
 },
 body: JSON.stringify(user)
 })
api.js（NodeJS后端路由）

   .
   .
   .

    var connection = mysql.createPool('mysql://<username>:<password>@<host>/<database name>?reconnect=true')
    router.post('/login', function(req,response,next) {
        const query1 = "SELECT * FROM users WHERE username = TRIM(?)"
        connection.query(query1, [req.body.username], function(err, result) {
            if (err) {
                response.json({'message': 'Incorrect Username/Password', 'status': 0})
            } else {
                req.session.username = req.body.username
                response.json({'message': 'You have successfully logged in', 'status': 1})
            }
        })
    })

我有一个具有明确后端的React应用程序。我正在尝试从前端到后端进行读取。此访存是登录名，我在其中传递了各种凭据以检查我的clearDB ...

如果您在不同于app.js的另一个文件中声明路由器，则应告诉您的应用使用该路由器。