JSON响应被捕获所有URL而被破坏并返回404页面

Question

我有一个像这样的React / Express设置（简化为简洁）：

const path = require('path')
const express = require('express')

const CLIENT_BUILD_PATH = path.join(__dirname, '../build')

const serialize = data => JSON.stringify({ data })

const app = express()
app.use(express.static(CLIENT_BUILD_PATH))

app.get('/api/get/data', (request, response) => {
  Promise.resolve(loadData()).then(data => {
    console.log(data)
    response.writeHead(200, {'Content-Type': 'application/json'})
    response.end(serialize(data))
  }).catch((error) => {
    response.writeHead(200, {'Content-Type': 'application/json'})
    response.end(serialize({}))
  })
})

// Catch all route
app.get('*', (request, response) => {
  response.sendFile(path.join(CLIENT_BUILD_PATH, 'index.html'))
})

当访问URL /api/get/data时，我想返回普通的JSON。

EG

{
  "foo": "bar",
}

但是，返回的是React的404页面。

loadData()解决得很好，我可以看到data登录控制台。但不知何故，所有路线都会覆盖响应（或其他东西）。我想无论如何，我无法弄明白。

更新：loadData()的结构如下：

const loadData = () => {
  return new Promise((resolve, reject) => {
    ...
    resolve(data)
  })
}

Answer 1

ExpressJs具有JSON响应的缩写功能。在响应中使用.json()以获得所需的结果，例如：

response.json(data);