Как вытащить данные с https://www.cbr.ru/scripts/XML_daily.asp (они там в XML) если используешь NextJS(Nodejs), а он не дружит с DOMParse?

не понимаю, как работать с xml на nextjs. Как вытащить данные с https://www.cbr.ru/scripts/XML_daily.asp (они там в XML) если используешь NextJS, а он не дружит с DOMParse?

Вот код:

import { parseStringPromise } from 'xml2js';

export default async function handler(req, res) {
  try {
    // Загружаем данные с API ЦБ РФ
    const response = await fetch('https://www.cbr.ru/scripts/XML_daily.asp');
    if (!response.ok) {
      throw new Error(`Ошибка при загрузке данных: ${response.statusText}`);
    }

    const xmlText = await response.text();

    // Парсим XML с помощью xml2js
    const result = await parseStringPromise(xmlText, { explicitArray: false });
    console.log(result);
    // Проверяем, что данные существуют
    if (!result || !result.ValCurs || !result.ValCurs.Valute) {
      throw new Error('Некорректный формат данных');
    }

    // Извлекаем данные о валютах
    const valuteList = result.ValCurs.Valute;
    const currencyList = [];

    for (const valute of valuteList) {
      const charCode = valute.CharCode;
      const name = valute.Name;
      const value = valute.Value;

      currencyList.push({ CharCode: charCode, Name: name, Value: value });
    }

    // Возвращаем первые 5 валют
    res.status(200).json(currencyList.slice(0, 5));
  } catch (error) {
    console.error('Ошибка при загрузке данных:', error);
    res.status(500).json({ error: error.message || 'Ошибка при загрузке данных' });
  }
}

ещё код:

"use client"
import React, { useEffect, useState } from 'react';
import CurrencyBlock from '../components/CurrencyBlock';

export default function Home() {
  const [currencies, setCurrencies] = useState([]);
  const [error, setError] = useState(null);

  useEffect(() => {
    // Загружаем данные с API-маршрута
    const fetchData = async () => {
      try {
        const response = await fetch('/currencies');
        if (!response.ok) {
          throw new Error(`Ошибка при загрузке данных: ${response.statusText}`);
        }

        const data = await response.json();
        setCurrencies(data);
      } catch (error) {
        console.error('Ошибка при загрузке данных:', error);
        setError(error.message);
      }
    };

    fetchData();
  }, []);

  return (
    <div style={styles.container}>
      <h1>Курсы валют ЦБ РФ</h1>
      {error ? (
        <p style={{ color: 'red' }}>{error}</p>
      ) : (
        <div style={styles.grid}>
          {currencies.map((currency, index) => (
            <CurrencyBlock key={index} currency={currency} />
          ))}
        </div>
      )}
    </div>
  );
}

const styles = {
  container: {
    padding: '20px',
    fontFamily: 'Arial, sans-serif',
  },
  grid: {
    display: 'flex',
    flexWrap: 'wrap',
    justifyContent: 'center',
  },
};

Ещё код:

const CurrencyBlock = ({ currency }) => {
  return (
    <div style={styles.block}>
      <h3>{currency.CharCode}</h3>
      <p>{currency.Name}</p>
      <p>Курс: {currency.Value} RUB</p>
    </div>
  );
};

const styles = {
  block: {
    border: '1px solid #ccc',
    borderRadius: '5px',
    padding: '10px',
    margin: '10px',
    width: '200px',
    textAlign: 'center',
  },
};

export default CurrencyBlock;

Ловлю ошибку здесь:

// Возвращаем первые 5 валют
res.status(200).json(currencyList.slice(0, 5));

Error: Cannot read properties of undefined (reading 'status')

Версия: NextJs 15.1


Ответы (0 шт):