Соберите сотни файлов json из url и объедините в один файл json в JavaScript

#javascript #json #cors

#javascript #json #cors

Вопрос:

Я пытаюсь 1) получить сотни отдельных файлов json с этого веб-сайта https://bioguide.congress.gov / который содержит законодателей в США, 2) обрабатывает их и 3) объединяет их в большой json, содержащий все отдельные записи.

Некоторые файлы, с которыми я работаю (у каждого отдельного законодателя есть свой URL-адрес, содержащий их данные в формате файла json), можно найти по этим URL-адресам:

 https://bioguide.congress.gov/search/bio/F000061.json
https://bioguide.congress.gov/search/bio/F000062.json
https://bioguide.congress.gov/search/bio/F000063.json
https://bioguide.congress.gov/search/bio/F000064.json
https://bioguide.congress.gov/search/bio/F000091.json
https://bioguide.congress.gov/search/bio/F000092.json
 

Мой подход заключается в создании цикла for для перебора различных идентификаторов и объединения всех записей в массив объектов. К сожалению, я застрял, пытаясь получить доступ к данным.

До сих пор я пробовал следующие методы, но получаю ошибку CORS.

Использование выборки:

 url = "https://bioguide.congress.gov/search/bio/F000061.json"

fetch(url)
    .then((res) => res.text())
    .then((text) => {
      console.log(text);
    })
    .catch((err) => console.log(err));
 

Использование режима no-cors в fetch и получение пустого ответа:

 url = "https://bioguide.congress.gov/search/bio/F000061.json"

const data = await fetch(url, { mode: "no-cors" })
 

Использование d3:

 url = "https://bioguide.congress.gov/search/bio/F000061.json"

const data = d3.json(url);
 

Я получаю ошибку, связанную с CORS blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource. , со всеми из них.

Я был бы признателен за любые предложения и советы по решению этой проблемы. Спасибо.

Ответ №1:

Следуя тому, что @code говорит в своем ответе, вот надуманный (но проверенный) пример NodeJS, который получает диапазон данных (60-69) с сервера один раз в секунду и компилирует его в один файл JSON.

 import express from 'express';
import fetch from 'node-fetch';
import { writeFile } from 'fs/promises';

const app = express();

const port = process.env.PORT || 4000;

let dataset;
let dataLoadComplete;

app.listen(port, () => {
  console.log(`Server running on port ${port}`);
});


function getData() {

  return new Promise((res, rej) => {

    // Initialise the data array
    let arr = [];

    dataLoadComplete = false;

    // Initialise the page number
    async function loop(page = 0) {

      try {

        // Use the incremented page number in the url 
        const uri = `https://bioguide.congress.gov/search/bio/F00006${page}.json`;

        // Get the data, parse it, and add it to the
        // array we set up to capture all of the data
        const response = await fetch(uri);
        const data = await response.json();
        arr = [ ...arr, data];

        console.log(`Loading page: ${page}`);

        // Call the function again to get the next
        // set of data if we've not reached the end of the range,
        // or return the finalised data in the promise response 
        if (page < 10) {
          setTimeout(loop, 1000,   page);
        } else {
          console.log('API calls complete');
          res(arr);
        }

      } catch (err) {
        rej(err);
      }

    }

    loop();

  });

}

// Call the looping function and, once complete,
// write the JSON to a file
async function main() {
  const completed = await getData();
  dataset = completed;
  dataLoadComplete = true;
  writeFile('data.json', JSON.stringify(dataset, null, 2), 'utf8');
}

main(); 

Комментарии:

1. Вы, вероятно, не хотели бы делать код «пригодным для выполнения», иначе он создаст вводящие в заблуждение ошибки, поскольку он выполняется на стороне клиента.

2. Я объяснил, что это был скрипт NodeJS, а не на стороне клиента. @code

3. Да, я просто предположил, что вы не сделаете его работоспособным, чтобы избежать путаницы.

4. Зачем вам нужен экспресс-сервер?

5. Хорошо, это нормально. Я не хотел создавать никаких проблем.

Ответ №2:

Ну, вы получаете CORS ошибку (совместное использование ресурсов разных источников), потому что веб-сайт, на который вы отправляете запрос AJAX (bioguide.congress.gov ) явно не включен CORS , что означает, что вы не можете отправлять AJAX-запросы (на стороне клиента) на этот веб-сайт из соображений безопасности.

Если вы хотите отправить запрос на этот сайт, вы должны отправить запрос со стороны сервера (например, PHP, Node, Python и т. Д.).

Подробнее по теме