Bitcoin address UTXO extractor based on Blockstream's API

index.pug

.container.py-5
  h2 Bitcoin address UTXO query
  form.mt-3
    .form-group
      label(for='address') Bitcoin address
      input.form-control#address(type='text', name='address')
    input.btn.btn-primary(type='submit', value='Get UTXOs')

  table.table.mt-5
    thead:  tr #[th txid:vout] #[th value] #[th block height] #[th block time]
    tbody
  
  div.csv.mt-5
    h4 CSV
    p Format: #[em txid,vout,satoshis,block_height]
    textarea.form-control(rows=6)

script.js

$('form').submit(e => {
  e.preventDefault()
  const address = $(e.target).find('[name=address]').val()
  fetch(`https://blockstream.info/api/address/${address}/utxo`)
  .then(r => r.json())
  .then(utxos => {
    $('tbody').empty().append(utxos.map(utxo => `
      <tr>
        <td>${utxo.txid}:${utxo.vout}</td>
        <td>${+utxo.value/100000000}</td>
        <td>${utxo.status.confirmed ? '#'+utxo.status.block_height : 'unconfirmed'}</td>
        <td>${utxo.status.confirmed ? new Date(utxo.status.block_time*1000).toLocaleString() : ''}</td>
      </tr>
    `))
    $('textarea').val(utxos.map(utxo => [utxo.txid, utxo.vout, utxo.value, utxo.status.block_height || '-1'].join(',')).join("\n"))
    $('table,.csv').show()
  })
  .catch(console.error)
})

style.css

table, .csv { display: none }

Available at https://codepen.io/anon/pen/YBRder

Plain HTML version, jQuery-free: https://gist.github.com/shesek/f0f73fb74b0083c46cf625570536e7aa