javascript - 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。

例如

{
  "foo": "bar",
}

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

loadData() 解析得很好，我可以看到data 记录在控制台中。但不知何故，响应被全部路由覆盖(或某些东西)。反正我是想不通。

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

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

Answer 1

ExpressJs 有一个用于 JSON 响应的缩写函数。在响应上使用 .json() 以获得所需的结果，例如:

response.json(数据);