# Как разрабатывать приложения с использованием Blockscout: основы

By [denis-skripnik.eth](https://paragraph.com/@denis-skripnik) · 2024-03-31

---

Как разрабатывать приложения с использованием Blockscout
--------------------------------------------------------

[https://t.me/blind\_dev](https://t.me/blind_dev)

### Вводные

*   Язык - Javascript (node.js)
    
*   На примере Optimism.
    

### Ищем блок-эксплорер в нужном блокчейне

Идём на [https://blockscout.com/](https://blockscout.com/)

![](https://storage.googleapis.com/papyrus_images/fb7899bf794467d33f27e0c44e8beab9ce1727f98ba214a6c39566b57f27c9e5.png)

"Use the Explorer":

![](https://storage.googleapis.com/papyrus_images/441cc0f69f451d8a4f626c6958c59ccb97dbb9cde7d3915db5eed073cd615812.png)

"View all":

![](https://storage.googleapis.com/papyrus_images/c08a4ccfd9473349a742e13a9cfc1b461105c5f77dc39c92916a27713d506250.png)

И выбираете (можно в том числе отфильтровать).

Я выберу Optimism, нажав по "Blockscout explorer":

![](https://storage.googleapis.com/papyrus_images/3f1ca95ca9a519b156bd8baa1fb509e069fa0860bb3f9ee0fbfc1a4c34925a72.png)

Смотрим в адресную строку. И после слеша добавляем api-docs. Должно получиться что-то типа [https://optimism.blockscout.com/api-docs](https://optimism.blockscout.com/api-docs)

![](https://storage.googleapis.com/papyrus_images/22f09e47580229cf798a5a24e78a52fe211c9a63317a5c7641a7c8369457b4da.png)

Существует и вариант 2: нажимаем на главной официального сайта "Visit the docs" и разворачиваем "API":

![](https://storage.googleapis.com/papyrus_images/16c9d33097ff2c0c739c606113f468458d038ffb3f9fb6d7f80c5b463c717f25.png)

Тут даже больше вариантов, например, GraphQL:

![](https://storage.googleapis.com/papyrus_images/3c2f24957df3a2a62f2d7e1ed8c01cf8bf51304d8224c93f5e1cf95a6ecaa8a8.png)

Но мы будем работать с REST API:

![](https://storage.googleapis.com/papyrus_images/d39c3136c596af491f3765e1982981d48fe921cf5af99aada6cdd681ec7b6d69.png)

Тут дан пример Ethereum...

### Работа с REST API Blockscout Optimism

Переходим: [https://optimism.blockscout.com/api-docs](https://optimism.blockscout.com/api-docs)

![](https://storage.googleapis.com/papyrus_images/7864b23b7e9d407ce6916b0d7ab6887385c3d826b36b8d38cdfb0f4d949012b1.png)

И выбираем интересное нам. Например, хотим получать текущий блок в сети...

Тогда открываем "get ​/blocks":

![](https://storage.googleapis.com/papyrus_images/eda14fb0a12ad637a12fc8c3c0292f63e302e8157ec7e4c5ae5e581742cff78d.png)

"Try it out":

![](https://storage.googleapis.com/papyrus_images/fcaa5912075b58957a3561ba43ab8b73b2d57375922c77dcf0c0085f36e7effd.png)

Можете заполнить поле типа, но я оставлю пустым, и кликну по "Execute":

![](https://storage.googleapis.com/papyrus_images/55d5ec1e12d9063adaa4bc58b1601403d46b09a6b3cbd48e4d774ccfe0c373c2.png)

Есть и вывод в удобном формате:

![](https://storage.googleapis.com/papyrus_images/ab6b229216509555422ef3b7522f2e3d92aef030560672439709f841ba71dd00.png)

В "Request URL" можете скопировать Url. У меня это [https://optimism.blockscout.com/api/v2/blocks?type=block%20%7C%20uncle%20%7C%20reorg](https://optimism.blockscout.com/api/v2/blocks?type=block%20%7C%20uncle%20%7C%20reorg):

![](https://storage.googleapis.com/papyrus_images/32e68853ab67c9b26c4219ef6fdebeefb1bddb0d28322e4f92a1baabc21c39f2.png)

Обратите на height внимание - это номер блока...

Допустим, также хочу узнать транзакции по блоку. Жму "get ​/blocks​/{block\_number\_or\_hash}​/transactions":

![](https://storage.googleapis.com/papyrus_images/7bfd97a4e41e7d29fbeeef300b7d805b79f516fdadb25b6ef2b88219eb438b2e.png)

Вставляю и "Execute":

![](https://storage.googleapis.com/papyrus_images/8f83045f2ba4c3240368d3526f20418b84630f4f3a31535bda1287ab59936dd6.png)

Содержимое:

![](https://storage.googleapis.com/papyrus_images/8990a6b1a1cc2848394b03dc8032e596742d2d4f36c7bb3c22f04b8f97afe945.png)

Request URL [https://optimism.blockscout.com/api/v2/blocks/118150735/transactions](https://optimism.blockscout.com/api/v2/blocks/118150735/transactions)

### Пишем код

В папке с проектом как всегда npm init, заполняем данными и

npm i axios

![](https://storage.googleapis.com/papyrus_images/cd89889a416c112b65c6c0c806101ec98839ba3fc573a18008ff0d75a05b82d2.png)

Далее создаём, открываем js файл и заполняем кодом. Я ниже напишу его с комментариями, чтоб было понятно, а пока вот скрин:

![](https://storage.googleapis.com/papyrus_images/4e53e5beb4d6440258a0e36b6e0c12c010b41fa8a688baccd2919fba387a7a37.png)

Код:

// Подключаем axios

const axios = require('axios');

// Основная функция: main

async function main() {

// вызываем url с блоком:

> const res = await axios.get('[https://optimism.blockscout.com/api/v2/blocks?type=block%20%7C%20uncle%20%7C%20reorg](https://optimism.blockscout.com/api/v2/blocks?type=block%20%7C%20uncle%20%7C%20reorg)');

// Получаем массив и первый его элемент:

const block = res.data.items\[0\];

// Если такого элемента нет, завершаем функцию, не возвращая ничего.

if (typeof block === 'undefined') return;

// Выводим на экран номер и хеш блока:

console.log(\`Block number: ${block.height}, hash: ${block.hash}\`);

// Получаем транзакции по блоку

const page = await axios.get(\`[https://optimism.blockscout.com/api/v2/blocks/${block.height}/transactions\\\`](https://optimism.blockscout.com/api/v2/blocks/$%7Bblock.height%7D/transactions%5C%60));

// Получаем список транзакций

const txs = page.data.items;

// Переводим в строку и выводим:

console.log(txs);

} // закрываем код функции.

> setInterval(main, 3000); // вызываем функцию раз в 3 секунды.

Можно было бы делать цикл по блокам с проверками и так далее, но решил вам показать упрощённый вариант, который смогут понять многие, ну или хотя бы который не будет напрягать...

Пример отображения результатов:

![](https://storage.googleapis.com/papyrus_images/111660965b62d6df11984426b8b56c2f5fc07689d239ce725402027a518f99ce.png)

### Всё

С вами был незрячий программист и автор обзоров.

Подписывайтесь на [https://t.me/blind\_dev](https://t.me/blind_dev) - здесь новости по моим разработкам и новые статьи.

Благодарю за внимание, и прошу распространять обзор.

Также буду рад донатам в виде минтов…

---

*Originally published on [denis-skripnik.eth](https://paragraph.com/@denis-skripnik/blockscout-3)*
