Browse the Block Chain
In this example, we retrieve the last 10 block from the Bitcoin block chain and render a summary page. We start with the chain property to get the URL of the latest block. We then use the prev_block_url to load the previous, hence traversing the block chain back block by block.
From the command line, we retrieve the latest block using the curl and json commands:
curl -s https://api.blockcypher.com/v1/btc/main | json latest_url | xargs curl -s
Here we use the json command to extract the latest_url property from the chain and pass it to curl using xargs (invokes a command passing the stdin parameters). This can be chained further to go one block back:
curl -s https://api.blockcypher.com/v1/btc/main | json latest_url | xargs curl -s | json prev_block_url | xargs curl -s
We can continue chaining calls, but it quickly gets very long. Here's a short Javascript program which can be run in the browser to do the same thing using JQuery:
// Displays the block, for now we just do an alert to show the block's height.
function showBlock(block) {
alert(block.height);
}
// Gets the JSON data returned by the previous JQuery.get, parse it and returns a
// new promise to get the next block.
function printAndGetNext(block) {
showBlock(block);
return $.get(block.prev_block_url);
}
// First gets the blockchain data using JQuery.get, parses it and returns a promise to get
// the latest block. We queue several then() calls right after to get each block one after
// another and display them.
$.get("http://api.blockcypher.com/v1/btc/main").then(function(chain) {
return $.get(chain.latest_url);
}).then(printAndGetNext).then(printAndGetNext).then(printAndGetNext);
The above JQuery.get calls our APIs and utilizes the URLs returned by every call. We allow cross-origin resource sharing which enables requests from your domain.
To improve on the above code, we add more details and a loop to get 10 blocks, instead of 3:
// Displays the block by rendering a div summarizing some of its most important details
function showBlock(b) {
var total = b.total / 100000000
$('#10-latest-blocks').before("<div>Block at "+b.height+" transferred "+ total+" in "+b.n_tx+" transactions.</div>");
}
// Gets the JSON data returned by the previous JQuery.get, parse it and returns a
// new promise to get the next block.
function printAndGetNext(block) {
showBlock(block);
return $.get(block.prev_block_url);
}
// Gets the blockchain data and parse it, returning a promise to get the latest block
var initiate = $.get("https://api.blockcypher.com/v1/btc/main").then(function(chain) {
return $.get(chain.latest_url);
});
// We continue by looping on the promise returned above and chaining 10 calls to print
// the block and get the next one.
var next = initiate;
for (var n = 0; n < 10; n++) { next = next.then(printAndGetNext); }