将现有的Node.js Express API与react-admin连接

时间:2018-07-15 14:52:54

标签: node.js reactjs express react-admin

我有一个现有的nodejs并为购物车提供了Express API。我想将此API与react-admin集成在一起。 https://github.com/marmelab/react-admin。 我已将以下代码添加到app.js文件中,以从数据库加载类别。

// in src/App.js
import React from 'react';
import { Admin, Resource } from 'react-admin';
import restProvider from 'ra-data-simple-rest';

import { CategoriesList } from './categories';

const App = () => (
  <Admin dataProvider={restProvider('http://localhost:5000/api')}>
    <Resource name="categories" list={CategoriesList} />
  </Admin>
);

export default App;

但是它总是抛出以下错误:

HTTP响应中缺少Content-Range标头。简单的REST数据提供程序期望对资源列表的响应包含此标头以及构建分页的结果总数。如果您使用的是CORS,是否在Access-Control-Expose-Headers标头中声明了Content-Range?

此外,修改了服务器端的代码,使其包含以下标头:

/**
 * GET request to retrieve all categories
 */
router.get('/api/categories', async (req, res) => {
    try {
        const categories = await Category.find({});
        res.setHeader('Access-Control-Expose-Headers', 'Content-Range');
        res.setHeader('Content-Range', 5);
        res.send({ data: categories, total: 5 });
    } catch (error) {
        console.log(`error in getting categories ${error}`);
    }
})

任何人以前都使用过react-admin。我在这里想念什么?

谢谢

1 个答案:

答案 0 :(得分:1)

是的,您的Content-Range标头是错误的。它必须具有以下格式:

Content-Range: categories 0-5/5

请参见https://github.com/marmelab/react-admin/tree/master/packages/ra-data-simple-rest