Typescript - Использование Fetch и Asyn c для доступа к базе данных Open Trivia

Question

Мы модифицируем игру викторины, которая использует TypeScript и свою собственную локальную базу данных, чтобы вместо нее использовать Открыть Trivia DB . Есть много асин c / await функций, с которыми я не хочу связываться (в случае, если требуется старая функциональность базы данных), и поэтому я привык использовать Fetch.

Вот мой код до сих пор:

public async getCategories() {
    let cats = null;
    let counts = null;
    if (!this.IS_USING_OTDB) {
        cats = await this.db.query('SELECT DISTINCT categoryid, category FROM questionsTest ORDER BY categoryid');
        counts = await this.db.query('SELECT categoryid, category, difficulty, count(*) FROM questionsTest GROUP by categoryid, category, difficulty ORDER BY count DESC');
        console.log(cats.rows, cats.rowCount, counts.rows);
    } else {
        console.log('Connecting to opentdb instead of postgres.');
        const fetchResult = await fetch('https://opentdb.com/api_category.php');
        console.log(fetchResult);
        const body = fetchResult.json;
        console.log(JSON.stringify(body));
    }
    // more code for processing here
}

Это работает само по себе, в том смысле, что оно не создает sh. Однако результат (консоль зарегистрирована fetchResult) не соответствует ожиданиям:

Response {
  size: 0,
  timeout: 0,
  [Symbol(Body internals)]: {
    body: PassThrough {
      _readableState: [ReadableState],
      readable: true,
      _events: [Object: null prototype],
      _eventsCount: 5,
      _maxListeners: undefined,
      _writableState: [WritableState],
      writable: true,
      allowHalfOpen: true,
      _transformState: [Object],
      [Symbol(kCapture)]: false
    },
    disturbed: false,
    error: null
  },
  [Symbol(Response internals)]: {
    url: 'https://opentdb.com/api_category.php',
    status: 200,
    statusText: 'OK',
    headers: Headers { [Symbol(map)]: [Object: null prototype] },
    counter: 0
  }
}

Стригифицированный JSON результат fetchResult.json также undefined.

, который Странно, так как ссылка https://opentdb.com/api_category.php немедленно возвращает следующее (и вы можете проверить это сами, нажав ссылку выше):

{"trivia_categories":[{"id":9,"name":"General Knowledge"},{"id":10,"name":"Entertainment: Books"},{"id":11,"name":"Entertainment: Film"},{"id":12,"name":"Entertainment: Music"},{"id":13,"name":"Entertainment: Musicals & Theatres"},{"id":14,"name":"Entertainment: Television"},{"id":15,"name":"Entertainment: Video Games"},{"id":16,"name":"Entertainment: Board Games"},{"id":17,"name":"Science & Nature"},{"id":18,"name":"Science: Computers"},{"id":19,"name":"Science: Mathematics"},{"id":20,"name":"Mythology"},{"id":21,"name":"Sports"},{"id":22,"name":"Geography"},{"id":23,"name":"History"},{"id":24,"name":"Politics"},{"id":25,"name":"Art"},{"id":26,"name":"Celebrities"},{"id":27,"name":"Animals"},{"id":28,"name":"Vehicles"},{"id":29,"name":"Entertainment: Comics"},{"id":30,"name":"Science: Gadgets"},{"id":31,"name":"Entertainment: Japanese Anime & Manga"},{"id":32,"name":"Entertainment: Cartoon & Animations"}]}

Как получить вышеуказанные результаты с выборки с URL? Я что-то пропустил?

Answer 1

fetchResult.json() - это метод, а не свойство, и он возвращает обещание.

Метод json () в миксине Body принимает поток ответа и считывает его до конца. Он возвращает обещание, которое разрешается с результатом анализа основного текста как JSON.

https://developer.mozilla.org/en-US/docs/Web/API/Body/json

Попробуйте это:

const fetchResult = await fetch('https://opentdb.com/api_category.php');
const data = await fetchResult.json();
console.log(data);