我正在尝试使用 react-admin
创建管理面板.
这是我所做的:
class AdminPanel extends React.Component{
render() {
return(
<div>
<Admin dataProvider={restProvider('http://localhost:8080')}>
<Resource name="u/all" list={PostList}/>
</Admin>
</div>
);
}
}
在另一个js文件中,我定义了PostList
。
在我的服务器中,我正在调试 /u/all
是否受到任何打击。越来越多了。
但是react.js给了我错误,说:错误:HTTP响应中缺少Content-Range header 。简单的 REST 数据提供程序期望资源列表的响应包含此 header 以及构建分页的结果总数。如果您使用 CORS,您是否在 Access-Control-Expose-Headers header 中声明了 Content-Range?
我该如何解决这个问题?
PostList.js:
export const PostList = (props) => (
<List {...props}>
<Datagrid>
<TextField source="userID" />
<TextField source="username" />
<DateField source="firstName" />
<TextField source="middleName" />
<TextField source="lastName" />
<TextField source="profileImageURL" />
<TextField source="joiningTime" />
<EditButton basePath="/posts" />
</Datagrid>
</List>
);
我的服务器端 CORS:
@Bean
public WebMvcConfigurer corsConfigurer() {
return new WebMvcConfigurer() {
@Override
public void addCorsMappings(CorsRegistry registry) {
registry
.addMapping("/**")
.allowedOrigins("http://localhost:3000","http://localhost:3001")
.exposedHeaders("Content-Range");
}
};
}
添加公开的 header 后仍然出现错误:
最佳答案
答案写着in the react-admin documentation :
The simple REST client expects the API to include a Content-Range header in the response to getList calls. The value must be the total number of resources in the collection. This allows react-admin to know how many pages of resources there are in total, and build the pagination controls.
Content-Range: posts 0-24/319
If your API is on another domain as the JS code, you’ll need to whitelist this header with an Access-Control-Expose-Headers CORS header.
Access-Control-Expose-Headers: Content-Range
关于javascript - HTTP 响应中缺少 react-admin,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/59876500/