Один и тот же вызов POST API в различных библиотеках JavaScript.

Я тестировал API, используяБессонница, очень классное приложение, которое позволяет выполнять HTTP-запросы к службам REST API или GraphQL API.

У них есть красивая кнопка, которая генерирует код для репликации запроса API из приложения, где вы визуально проектируете все данные своего запроса.

Внутри он используетhttps://github.com/Kong/httpsnippetкоторый представляет собой генератор фрагментов HTTP-запросов для многих языков и библиотек, написанный на JavaScript. Очень крутой проект.

Как бы то ни было, в экспорте было несколько фрагментов кода. Я хочу показать один и тот же вызов API в разных библиотеках.

Во-первых, вот описание вызова API. Я отправляю запрос POST вapi.randomservice.comвеб-сайт (это случайный URL, который я только что придумал) на/dogконечная точка.

В эту конечную точку я отправляю объект с двумя свойствами:

{
  name: 'Roger',
  age: 8
}

в кодировке JSON.

Я также прохожуcontent-typeчтобы установить контент какapplication/jsonиauthorizationзаголовок для аутентификации моего запроса с помощью токена-носителя, назначенного мне через панель управления API.

XHR

Первый пример кода:XHR, который мы можем использовать в браузере изначально, а в Node.js, используяhttps://www.npmjs.com/package/xmlhttprequest:

const data = JSON.stringify({
  name: 'Roger',
  age: 8
})

const xhr = new XMLHttpRequest() xhr.withCredentials = true

xhr.addEventListener(‘readystatechange’, function() { if (this.readyState === this.DONE) { console.log(this.responseText) } })

xhr.open(‘POST’, https://api.randomservice.com/dog) xhr.setRequestHeader(‘content-type’, ‘application/json’) xhr.setRequestHeader(‘authorization’, ‘Bearer 123abc456def’)

xhr.send(data)

API-интерфейс Fetch

Затем у нас есть тот же код с использованиемПолучить API, другой API, изначально доступный в браузере и в Node.js с использованиемhttps://www.npmjs.com/package/node-fetch:

fetch('https://api.randomservice.com/dog', {
  method: 'POST',
  headers: {
    'content-type': 'application/json',
    authorization: 'Bearer 123abc456def'
  },
  body: {
    name: 'Roger',
    age: 8
  }
})
  .then(response => {
    console.log(response)
  })
  .catch(err => {
    console.log(err)
  })

Модуль узла HTTPS

Далее роднойhttpsМодуль Node.js:

const http = require('https')

const options = { method: ‘POST’, hostname: api.randomservice.com, port: null, path: ‘/dog’, headers: { ‘content-type’: ‘application/json’, authorization: ‘Bearer 123abc456def’, ‘content-length’: ‘32’ } }

const req = http.request(options, res => { const chunks = []

res.on(‘data’, chunk => { chunks.push(chunk) })

res.on(‘end’, () => { const body = Buffer.concat(chunks) console.log(body.toString()) }) })

req.write(JSON.stringify({ name: ‘Roger’, age: 8 })) req.end()

Вrequestбиблиотека

Вот то же самое с использованиемrequestБиблиотека узлов:

const request = require('request')

const options = { method: ‘POST’, url: https://api.randomservice.com/dog, headers: { ‘content-type’: ‘application/json’, authorization: ‘Bearer 123abc456def’ }, body: { name: ‘Roger’, age: 8 }, json: true }

request(options, (error, response, body) => { if (error) throw new Error(error)

console.log(body) })

Axios

Вот то же самое с использованиемAxios, популярная библиотека как для Node, так и для браузера:

const axios = require('axios')

axios.post(https://api.randomservice.com/dog, { name: ‘Roger’, age: 8 }, { headers: { ‘content-type’: ‘application/json’, authorization: ‘Bearer 123abc456def’ } ) .then((res) => { console.log(res.data) }) .catch((error) => { console.error(error) })

Скачать мою бесплатнуюРуководство для начинающих по JavaScript


Больше руководств по js: