Python如何制作区块链浏览器？Flask+Web3.py

pip install Flask web3

app.py

from flask import Flask, render_template, request, redirect, url_for
from web3 import Web3
from web3.exceptions import Web3Exception # 引入异常处理

app = Flask(__name__)

# 连接到以太坊节点
# 推荐使用Infura、Alchemy等服务，它们提供稳定的API接口
# 记得替换 YOUR_INFURA_PROJECT_ID 为你自己的项目ID
# infura_url = "https://mainnet.infura.io/v3/YOUR_INFURA_PROJECT_ID"
# w3 = Web3(Web3.HTTPProvider(infura_url))

# 开发测试时，也可以连接本地Ganache或Geth节点
# w3 = Web3(Web3.HTTPProvider('http://127.0.0.1:8545')) # Ganache默认端口

# 确保连接成功，如果连接失败，这里会抛出异常或返回False
try:
    # 尝试连接到Infura公共节点，如果你的Infura ID是空的，这里会失败
    # 也可以直接用一个公共的测试网节点，例如 Goerli
    w3 = Web3(Web3.HTTPProvider('https://goerli.infura.io/v3/YOUR_INFURA_PROJECT_ID'))
    if not w3.is_connected():
        print("警告：未能连接到以太坊节点，请检查网络或Infura ID。")
        w3 = None # 设置为None，后续逻辑会处理
except Web3Exception as e:
    print(f"连接Web3时发生错误: {e}")
    w3 = None


@app.route('/')
def index():
    if not w3 or not w3.is_connected():
        return "未能连接到区块链网络，请检查后端服务配置或网络连接。", 500

    try:
        latest_block_number = w3.eth.block_number
        latest_block = w3.eth.get_block(latest_block_number)
        # 简化处理，只传递部分信息给模板
        block_info = {
            'number': latest_block.number,
            'hash': latest_block.hash.hex(),
            'timestamp': latest_block.timestamp,
            'transactions_count': len(latest_block.transactions),
            'miner': latest_block.miner,
            'gas_used': latest_block.gasUsed,
            'gas_limit': latest_block.gasLimit,
            'parent_hash': latest_block.parentHash.hex()
        }
        return render_template('index.html', block=block_info)
    except Exception as e:
        return f"获取最新区块信息失败: {e}", 500

@app.route('/block/<int:block_number>')
def get_block_details(block_number):
    if not w3 or not w3.is_connected():
        return "未能连接到区块链网络。", 500
    try:
        block = w3.eth.get_block(block_number, full_transactions=False) # full_transactions=False 减少数据量
        if not block:
            return "区块未找到。", 404

        block_info = {
            'number': block.number,
            'hash': block.hash.hex(),
            'timestamp': block.timestamp,
            'transactions_count': len(block.transactions),
            'miner': block.miner,
            'gas_used': block.gasUsed,
            'gas_limit': block.gasLimit,
            'parent_hash': block.parentHash.hex(),
            'transactions': [tx.hex() for tx in block.transactions] # 只显示交易哈希
        }
        return render_template('block_details.html', block=block_info)
    except Exception as e:
        return f"获取区块 {block_number} 详情失败: {e}", 500

@app.route('/tx/<string:tx_hash>')
def get_transaction_details(tx_hash):
    if not w3 or not w3.is_connected():
        return "未能连接到区块链网络。", 500
    try:
        # 确保哈希格式正确
        if not tx_hash.startswith('0x') or len(tx_hash) != 66:
            return "无效的交易哈希格式。", 400

        tx = w3.eth.get_transaction(tx_hash)
        if not tx:
            return "交易未找到。", 404

        tx_receipt = w3.eth.get_transaction_receipt(tx_hash) # 获取交易收据以获得状态、gas消耗等

        tx_info = {
            'hash': tx.hash.hex(),
            'block_number': tx.blockNumber,
            'from': tx['from'],
            'to': tx['to'],
            'value': w3.from_wei(tx.value, 'ether'), # 转换为ETH
            'gas_price': w3.from_wei(tx.gasPrice, 'gwei'), # 转换为Gwei
            'gas_limit': tx.gas,
            'nonce': tx.nonce,
            'input': tx.input, # 智能合约调用数据
            'status': '成功' if tx_receipt and tx_receipt.status == 1 else '失败',
            'gas_used': tx_receipt.gasUsed if tx_receipt else 'N/A'
        }
        return render_template('transaction_details.html', tx=tx_info)
    except Exception as e:
        return f"获取交易 {tx_hash} 详情失败: {e}", 500

@app.route('/address/<string:address>')
def get_address_details(address):
    if not w3 or not w3.is_connected():
        return "未能连接到区块链网络。", 500
    try:
        # 确保地址格式正确
        if not w3.is_address(address):
            return "无效的以太坊地址格式。", 400

        balance_wei = w3.eth.get_balance(address)
        balance_eth = w3.from_wei(balance_wei, 'ether')

        # 简单展示，不获取所有交易（这会非常慢且消耗资源）
        # 实际项目中，需要通过第三方API或索引服务获取地址交易历史
        address_info = {
            'address': address,
            'balance': balance_eth
        }
        return render_template('address_details.html', address=address_info)
    except Exception as e:
        return f"获取地址 {address} 详情失败: {e}", 500

# 搜索功能
@app.route('/search', methods=['GET'])
def search():
    query = request.args.get('query', '').strip()
    if not query:
        return redirect(url_for('index'))

    # 尝试作为区块号
    if query.isdigit():
        return redirect(url_for('get_block_details', block_number=int(query)))
    # 尝试作为交易哈希
    elif query.startswith('0x') and len(query) == 66:
        return redirect(url_for('get_transaction_details', tx_hash=query))
    # 尝试作为地址
    elif query.startswith('0x') and len(query) == 42: # 以太坊地址长度
        return redirect(url_for('get_address_details', address=query))
    else:
        return "未识别的查询类型（请输入区块号、交易哈希或地址）。", 400

if __name__ == '__main__':
    app.run(debug=True)

templates/index.html

templates

templates/base.html

<!DOCTYPE html>
<html lang="zh-CN">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>{% block title %}简易区块链浏览器{% endblock %}</title>
    <style>
        body { font-family: sans-serif; margin: 20px; background-color: #f4f7f6; color: #333; }
        .container { max-width: 900px; margin: 0 auto; background-color: #fff; padding: 20px; border-radius: 8px; box-shadow: 0 2px 4px rgba(0,0,0,0.1); }
        h1, h2 { color: #007bff; }
        .data-item { margin-bottom: 10px; border-bottom: 1px dashed #eee; padding-bottom: 5px; }
        .data-item strong { display: inline-block; width: 120px; color: #555; }
        a { color: #007bff; text-decoration: none; }
        a:hover { text-decoration: underline; }
        .search-box { margin-bottom: 20px; padding: 15px; background-color: #e9ecef; border-radius: 5px; display: flex; align-items: center; }
        .search-box input[type="text"] { flex-grow: 1; padding: 8px; border: 1px solid #ccc; border-radius: 4px; margin-right: 10px; }
        .search-box button { padding: 8px 15px; background-color: #28a745; color: white; border: none; border-radius: 4px; cursor: pointer; }
        .search-box button:hover { background-color: #218838; }
        .error-message { color: red; font-weight: bold; }
    </style>
</head>
<body>
    <div class="container">
        <header>
            <h1><a href="/">简易区块链浏览器</a></h1>
            <div class="search-box">
                <form action="/search" method="GET" style="display: flex; width: 100%;">
                    <input type="text" name="query" placeholder="搜索区块号 / 交易哈希 / 地址" size="50">
                    <button type="submit">搜索</button>
                </form>
            </div>
        </header>
        <main>
            {% block content %}{% endblock %}
        </main>
    </div>
</body>
</html>

templates/index.html

{% extends "base.html" %}

{% block title %}最新区块 - 简易区块链浏览器{% endblock %}

{% block content %}
    <h2>最新区块信息</h2>
    {% if block %}
    <div class="data-item"><strong>区块号:</strong> <a href="{{ url_for('get_block_details', block_number=block.number) }}">{{ block.number }}</a></div>
    <div class="data-item"><strong>哈希:</strong> {{ block.hash }}</div>
    <div class="data-item"><strong>时间戳:</strong> {{ block.timestamp | int | timestamp_to_datetime }}</div>
    <div class="data-item"><strong>交易数量:</strong> {{ block.transactions_count }}</div>
    <div class="data-item"><strong>矿工:</strong> <a href="{{ url_for('get_address_details', address=block.miner) }}">{{ block.miner }}</a></div>
    <div class="data-item"><strong>Gas使用量:</strong> {{ block.gas_used }}</div>
    <div class="data-item"><strong>Gas限制:</strong> {{ block.gas_limit }}</div>
    <div class="data-item"><strong>父区块哈希:</strong> {{ block.parent_hash }}</div>
    {% else %}
    <p class="error-message">未能加载区块信息。</p>
    {% endif %}

    <script>
        // 简单的过滤器，将Unix时间戳转换为可读日期
        // 在实际Flask应用中，你可能需要在Python后端处理或使用Jinja2的过滤器
        // 这里只是一个前端的简单示例，实际需要后端处理或更复杂的JS库
        if (typeof Jinja2 === 'undefined') { // 避免重复定义
            var Jinja2 = {};
            Jinja2.filters = {
                timestamp_to_datetime: function(timestamp) {
                    const date = new Date(timestamp * 1000);
                    return date.toLocaleString();
                }
            };
        }
        // 为了让Jinja2过滤器在HTML中生效，通常需要在Python后端注册
        // 例如：app.jinja_env.filters['timestamp_to_datetime'] = lambda ts: datetime.fromtimestamp(ts).strftime('%Y-%m-%d %H:%M:%S')
    </script>
{% endblock %}