Блог

Я пытаюсь создать пользовательский поставщик данных для своего API. Я могу войти в систему и GET_LIST, но не могу обработать полученные данные. Я адаптировал требуемый формат вывода для ответов API, а также включил заголовок Content-Range.

С Postman возвращаются все заголовки, но, похоже, они отсутствуют в «ответе», который я получаю в методе convertHTTPResponse.

Поскольку заголовки являются пустыми, список не будет отображаться и показывать ошибку:

Предупреждение: отсутствует перевод для ключа: «Не удается прочитать свойство ‘hasOwnProperty’ неопределенного»

Конечно, что-то очевидное для опытных разработчиков, пожалуйста, помогите!

Редактировать: исправлено путем сохранения заголовков перед преобразованием res.json()

myDataProvider.js

 export default (apiUrl, httpClient = fetchUtils.fetchJson) => {
    let url = '';
    const token = localStorage.getItem('token');
    const options = {
        headers: new Headers({
            Accept: 'application/json',
            Authorization: 'Bearer '   token
        }),
    };
    switch (type) {
        case GET_LIST:
            {
                const {
                    page,
                    perPage
                } = params.pagination;
                const {
                    field,
                    order
                } = params.sort;
                const query = {
                    sort: JSON.stringify([field, order]),
                    range: JSON.stringify([
                        (page - 1) * perPage,
                        page * perPage - 1,
                    ]),
                    filter: JSON.stringify(params.filter),
                };
                url = `${apiUrl}/${resource}?${stringify(query)}`;
                break;
            }
        default:
            throw new Error(`Unsupported Data Provider request type ${type}`);
    }

    let headers;
    return fetch(url, options)
        .then(res => {
            headers = res.headers;
            return res.json();
        })
        .then(response => {
            //console.log(headers);
            switch (type) {
                case GET_LIST:
                    return {
                        data: response.data.map(resource => ({ ...resource, id: resource.uuid })),
                        total: parseInt(headers.get('content-range').split('/').pop(), 10)
                    };
                default:
                    return {
                        data: response
                    };
            }
        });
};
  

URL-адрес вызова API:

 http://localhost:9000/users?filter={}amp;range=[0,9]amp;sort=['uuid','DESC']
  

Результат с Postman:

 {
    "data": [
        {
            "uuid": "ff1xxa-ddsa-4232-b453-ed44e4dfc11d",
            "email": "fr2r32442231y@domain.net",
            "created_at": "2019-03-27T23:11:48.000Z",
            "updated_at": "2019-03-27T23:11:48.000Z",
        }
    "total": 74,
    "limit": 9,
    "offset": 0,
    "order": "DESC",
    "sort": "uuid",
    "success": true
}
  

Запрашивать заголовки с помощью Postman:

 Authorization:"Bearer token123"
cache-control:"no-cache"
Postman-Token:"5e0442c7-698d-46e2-8656-50f4b10de970"
User-Agent:"PostmanRuntime/7.6.1"
Accept:"*/*"
Host:"localhost:9000"
cookie:"connect.sid=s:mfwRL0cVcIcBhqqGy1w6epkxjEh0nRzr.cP03XewB3Na+6esVOvN/BE5gL8gQvO+bWCIkC5Vbq44"
accept-encoding:"gzip, deflate"
  

Заголовки ответа с Postman:

 Access-Control-Allow-Origin:"*"
Access-Control-Expose-Headers:"Content-Range,X-Content-Range"
X-DNS-Prefetch-Control:"off"
X-Frame-Options:"SAMEORIGIN"
Strict-Transport-Security:"max-age=15552000; includeSubDomains"
X-Download-Options:"noopen"
X-Content-Type-Options:"nosniff"
X-XSS-Protection:"1; mode=block"
Content-Range:"users 0-9/74"
Content-Type:"application/json; charset=utf-8"
Content-Length:"13063"
ETag:"W/"3307-8yJ9evfC/wq64GCJcSnFIwWEGC8""
Date:"Thu, 11 Apr 2019 14:03:13 GMT"
Connection:"keep-alive"