Ajax-запрос в TypeScript: примеры использования Fetch, Axios и XMLHttpRequest

Вот несколько примеров выполнения запросов Ajax в TypeScript с использованием различных библиотек и методов:

  1. Использование Fetch API:

    fetch('https://api.example.com/data')
    .then(response => response.json())
    .then(data => {
    // Process the response data
    console.log(data);
    })
    .catch(error => {
    // Handle any errors
    console.error(error);
    });
  2. Использование библиотеки Axios:

    import axios from 'axios';
    axios.get('https://api.example.com/data')
    .then(response => {
    // Process the response data
    console.log(response.data);
    })
    .catch(error => {
    // Handle any errors
    console.error(error);
    });
  3. Использование XMLHttpRequest:

    const xhr = new XMLHttpRequest();
    xhr.open('GET', 'https://api.example.com/data');
    xhr.onreadystatechange = () => {
    if (xhr.readyState === XMLHttpRequest.DONE) {
    if (xhr.status === 200) {
      const data = JSON.parse(xhr.responseText);
      // Process the response data
      console.log(data);
    } else {
      // Handle error
      console.error('Request failed');
    }
    }
    };
    xhr.send();

Эти примеры демонстрируют три часто используемых метода выполнения запросов Ajax в TypeScript. Fetch API — это современный встроенный API JavaScript для выполнения HTTP-запросов. Axios — популярная библиотека, предоставляющая более простой и удобный API для выполнения запросов. XMLHttpRequest – это традиционный подход, который работает во всех современных браузерах.