Если вы работали с Javascript после 2015 года, вы, вероятно, знакомы с его (теперь) родным fetch()интерфейсом для передачи запросов и ответов через HTTP. Fetch становится все более широко используемым с каждым днем, быстро появляются улучшения и дополнения. Эта статья будет касаться менее известного предшественника / современника, с которым вы можете столкнуться или даже захотите использовать. В частности, SuperAgent.

В документации SuperAgent это описывается следующим образом:

«Легковесный прогрессивный ajax API, созданный для обеспечения гибкости, удобочитаемости и низкой кривой обучения после того, как вы были разочарованы многими существующими API запросов. Он также работает с Node.js! »

На мой взгляд, его преимущества перед сопоставимыми API-интерфейсами заключаются в удобочитаемости структуры запроса и встроенных функций. Структура запроса / ответа очень проста в реализации и, что наиболее важно для меня, легко запоминается. Одна часть кривой обучения, необходимой для использования fetch(), - это запоминание структуры запроса публикации / исправления. Это не обязательно интуитивно:

fetch(url, { 
 method: ‘POST’,
 headers: { 
  ‘auth’: ‘1234’ 
 }, 
 body: JSON.stringify({ 
  name: ‘dean’, 
  login: ‘dean’, 
 })
})
.then(function (data) {
  console.log(‘Request success: ‘, data); 
}) 
.catch(function (error) { 
  console.log(‘Request failure: ‘, error); 
});

Этот пример может быть немного сложно проанализировать из-за немного разных требований к синтаксису для разных частей запроса, например. тело должно быть "строковым", метод HTTP должен быть строкой. В SuperAgent JSON является форматом по умолчанию для запроса / ответа с сохранением необходимого шага .then(response => response.json() & body: JSON.stringify{} при использовании fetch(). Несколько примеров:

образец запроса SuperAgent "получить", за которым следует эквивалентный fetch()

                    SuperAgent
request
   .get('/search')
   .then(res => { // res.body, res.headers, res.status})
   
                      Fetch
fetch('http://example.com/movies.json')
  .then(function(response) {
    return response.json();
  })
  .then(function(myJson) {
    console.log(JSON.stringify(myJson));
  });

образец запроса SuperAgent на "публикацию"

request.post('/user')
    .set('Content-Type', 'application/json')
    .send('{"name":"tj","pet":"tobi"}')
    .then(callback)
    .catch(errorCallback)

SuperAgent также поддерживает отдельные параметры запроса в запросе, где в fetch() они должны быть добавлены к URL-адресу с помощью интерполяции. Пример использования запроса:

В заключение, есть несколько незначительных отличий в способах работы и внешнего вида Native fetch() по сравнению с SuperAgent. Одно большое отличие состоит в том, что fetch(), будучи встроенным, всегда будет поддерживаться Mozilla, и у них есть отличная документация. Я нашел документацию SuperAgent (https://visionmedia.github.io/superagent/#browser-and-node-versions) более чем адекватной. Библиотека была разработана для работы с Node, но может вызывать проблемы, когда функции становятся ошибками. (src = интернет-форумы). Я продолжаю использовать fetch() на данный момент и с нетерпением жду прогресса в его удобстве использования, но если бы мне было на 100% комфортно работать и с SuperAgent.