Fetch API

Request HTTP (GET JSON)


ViaCEP API: https://viacep.com.br/ws/58015430/json/

$ curl -i https://viacep.com.br/ws/58015430/json/
HTTP/1.1 200 OK
Server: nginx/1.12.2
Date: Thu, 10 May 2018 19:27:14 GMT
Content-Type: application/json; charset=utf-8
Transfer-Encoding: chunked
Connection: keep-alive
Access-Control-Allow-Origin: *
Access-Control-Allow-Methods: GET, OPTIONS
Access-Control-Allow-Headers: Content-Type, X-Request-With, X-Requested-By
Access-Control-Allow-Credentials: true
Access-Control-Max-Age: 86400
Expires: Thu, 10 May 2018 20:27:14 GMT
Cache-Control: max-age=3600
Cache-Control: public

{
  "cep": "58015-430",
  "logradouro": "Avenida Primeiro de Maio",
  "complemento": "até 469/470",
  "bairro": "Jaguaribe",
  "localidade": "João Pessoa",
  "uf": "PB",
  "unidade": "",
  "ibge": "2507507",
  "gia": ""
}

get-viacep-json/:


function getCEP(url) {
  fetch(url)
    .then(res => res.json())
    .then(json => showContent(json))
}

function showContent(cep) {
  console.log(cep.localidade)
}

getCEP('https://viacep.com.br/ws/58015430/json/')

Request HTTP (GET JSON Async)


ViaCEP API: https://viacep.com.br/ws/58015430/json/

$ curl -i https://viacep.com.br/ws/58015430/json/
HTTP/1.1 200 OK
Server: nginx/1.12.2
Date: Thu, 10 May 2018 19:27:14 GMT
Content-Type: application/json; charset=utf-8
Transfer-Encoding: chunked
Connection: keep-alive
Access-Control-Allow-Origin: *
Access-Control-Allow-Methods: GET, OPTIONS
Access-Control-Allow-Headers: Content-Type, X-Request-With, X-Requested-By
Access-Control-Allow-Credentials: true
Access-Control-Max-Age: 86400
Expires: Thu, 10 May 2018 20:27:14 GMT
Cache-Control: max-age=3600
Cache-Control: public

{
  "cep": "58015-430",
  "logradouro": "Avenida Primeiro de Maio",
  "complemento": "até 469/470",
  "bairro": "Jaguaribe",
  "localidade": "João Pessoa",
  "uf": "PB",
  "unidade": "",
  "ibge": "2507507",
  "gia": ""
}

get-viacep-json-async/:


async function getCEP(url) {
  const response = await fetch(url)
  const json = await response.json()
  showContent(json)
}

function showContent(cep) {
  console.log(cep.localidade)
}

getCEP('https://viacep.com.br/ws/58015430/json/')

Request HTTP (POST JSON, Token)


SendGrid API V3: https://sendgrid.com/docs/API_Reference/Web_API_v3/Mail/index.html:

$ curl --request POST \
  --url https://api.sendgrid.com/v3/mail/send \
  --header 'Authorization: Bearer YOUR_API_KEY' \
  --header 'Content-Type: application/json' \
  --data '{"personalizations": [{"to": [{"email": "example@example.com"}]}],"from": {"email": "example@example.com"},"subject": "Hello, World!","content": [{"type": "text/plain", "value": "Heya!"}]}'
{
  "personalizations": [
    {
      "to": [
        { "email": "example@example.com" }
      ]
    }
  ],
  "from": { "email": "example@example.com" },
  "subject": "Hello, World!",
  "content": [
    {
      "type": "text/plain",
      "value": "Heya!"
    }
  ]
}

SendGrid API Keys - Create API Key

post-sendgrid-json/:


async function sendMail(email, title, body) {
  const url = 'https://api.sendgrid.com/v3/mail/send'
  const data = {
    "personalizations": [
      {
        "to": [
          { "email": "example@example.com" }
        ]
      }
    ],
    "from": { "email": "example@example.com" },
    "subject": title,
    "content": [
      {
        "type": "text/plain",
        "value": body
      }
    ]
  }
  const init = {
    method: 'POST',
    headers: {
      'Authorization': 'Bearer YOUR_API_KEY',
      'Content-Type': 'application/json'
    },
    body: data
  }
  const response = await fetch(url, init)
  const json = await response.json()
  console.log(response)
}

sendMail(email, "Hello, World!", "Heya!")

References