Question

我正在使用React js（Admin on Rest）进行API调用（GET）。

我在调用localhost时检查了API服务器：5001 / cites，服务器返回城市数据，但我不知道客户端的错误，这里是浏览器的日志：

failure.js:18 Error: The X-Total-Count header is missing in the HTTP Response. This header is necessary for pagination. If you are using CORS, did you declare X-Total-Count in the Access-Control-Allow-Headers header?

at convertHTTPResponseToREST (http://localhost:3000/static/js/bundle.js:33928:28)
at http://localhost:3000/static/js/bundle.js:33966:21

和

failure.js:18 Error: The Content-Range header is missing in the HTTP Response. This header is necessary for pagination. If you are using CORS, did you declare Content-Range in the Access-Control-Allow-Headers header?

at convertHTTPResponseToREST (http://localhost:3000/static/js/bundle.js:33010:28)
at http://localhost:3000/static/js/bundle.js:33037:21

是的，有人可以帮忙吗？感谢

Answer 1

Admin-on-rest需要一种方法来确定总共有多少结果，即使您的API仅返回结果的一部分 - 以构建分页控制器。例如，如果API返回10个结果，但提到总共有100个结果，则admin-on-rest将显示10个页面链接。

simpleRestClient和jsonServerRestClient都希望在X-Total-Count或Content-Range中的回复标题中看到此信息。

如果您的API不包含这些标头，您可以：

更新您的API以将总数包含在X-Total-Count标题中，或
编写自己的RESt客户端以获取有关其他地方（例如在响应正文中）记录总数的信息

Answer 2

更新您的后端 API 函数以获取 X-Total-Count 并将其设置为响应标题

示例：

exports.findAll = (req, res) => {
  var total = Data.countAll()// your count all function
  Data.findAll({ where: condition })
    .then(data => {
      res.set('Access-Control-Expose-Headers', 'X-Total-Count')
      res.set('X-Total-Count', total)
      res.send(data);
    })
    .catch(err => {
      res.status(500).send({
        message:
          err.message || "Some error occurred while retrieving data."
      });
    });
};

API调用时React JS（Admin on Rest）错误

2 个答案: