Requisições HTTP utilizando o AXIOS

npm i axios

<script src="https://unpkg.com/axios/dist/axios.min.js"></script>

const axios = require('axios').default;

import axios from 'axios'

axios.get('https://catfact.ninja/fact')

axios.get('https://catfact.ninja/fact')
  .then(function (response) {
    // aqui acessamos o corpo da resposta:
    console.log(response.data);
  })
  .catch(function (error) {
    // aqui temos acesso ao erro, quando alguma coisa inesperada acontece:
    console.log(error);
  })

https://api.aluroni.com.br/pratos

axios.get('https://api.aluroni.com.br/pratos')
  .then(function (resposta) {
    // aqui acessamos o corpo da resposta:
    console.log(resposta.data) // lista de todos os pratos do Aluroni
  })

axios.get('https://api.aluroni.com.br/pratos/42')
  .then(function (resposta) {
    // aqui acessamos o corpo da resposta:
    console.log(resposta.data) // obtemos os dados do prato cujo o id (identificador único) é 42
  })

axios.post('https://api.aluroni.com.br/pratos', {
    nome: 'Lasanha',
    descricao: 'O jantar mais gostoso do mundo inteirinho!'
})
  .then(function () {
    // se tudo der certo, o prato vai ser criado!
  })

axios.put('https://api.aluroni.com.br/pratos/42', { // dependendo da API, pode ser um PATCH ao invés do PUT
    nome: 'Lasanha',
    descricao: 'O jantar mais gostoso do UNIVERSO!'
})
  .then(function () {
    // se tudo der certo, o prato vai ser atualizado!
  })

axios.delete('https://api.aluroni.com.br/pratos/42')
  .then(function () {
    // se tudo der certo, o prato vai ser removido!
  })

export const http = axios.create({
    baseURL: 'https://api.aluroni.com.br,
    headers: {'User-Agent': 'AluroniAdmin'}
  });

http.get('pratos')
http.get('pratos/42')
http.post('pratos', {...dados})
http.put('pratos/42', {...dados})
http.delete('pratos')

// Adiciona um interceptador de requisição
http.interceptors.request.use(function (config) {
    // Faça algo antes do pedido ser enviado
    return config;
  }, function (error) {
    // Faça algo com caso algo dê errado
    return Promise.reject(error);
  });
// Adiciona um interceptor de resposta
http.interceptors.response.use(function (response) {
    // Qualquer código de status que esteja dentro do intervalo de 2xx faz com que esta função seja acionada
    // Faça algo com os dados de resposta
    return response;
  }, function (error) {
    // Qualquer código de status que esteja fora do intervalo de 2xx faz com que esta função seja acionada
    //Faça algo com erro de resposta
    return Promise.reject(error);
  });