Pixabay API CORB проблема

Question

При получении доступа к API Pixabay из моего приложения Javascript (React) я получаю перекрестную блокировку чтения (CORB).

Вот мой код выборки:

fetch(`https://pixabay.com/api/?key=${API_KEY}&q=travel&image_type=photo&pretty=true`)
  .then(res => res.json())
  .then(
    result => {
      console.log(result);
      // set url array in state to be used by a gallery component..
    },
    error => {
      console.log(error);
    }
  );

Выборка возвращает данные в порядке, но каждый из отдельных URL-адресов изображений, используемых в простом теге img, выдает ошибку CORB.

Что мне нужно сделать, чтобы разблокировать мой запрос?

Answer 1

Я полагаю, вы используете ссылки на сайт Pixabay как sr c для своих изображений (hit.pageURL). Разве вы не хотели использовать hit.previewURL?

const API_KEY = '123456789abcdef';

fetch(`https://pixabay.com/api/?key=${API_KEY}&q=travel&image_type=photo&pretty=true`)
  .then(res => res.json())
  .then(
    result => {
      // Just for the demo
      const html = result.hits.map(
        hit => `<a href="${hit.pageURL}"><img src="${hit.previewURL}"></a>`
      ).join('');
      document.body.innerHTML = html;
    },
    error => {
      console.log(error);
    }
  );