作者：MoeJue（xxx@example.com）

这是一个100%去中心化的区块链红包应用。用户可以连接钱包，设定金额和数量发送红包，然后通过链接分享给他人领取。所有数据和操作都基于区块链，完全不需要中心化服务器，整个过程安全、透明、可追溯。

如果你感兴趣，可以在 GitHub 上看看我的代码：redpacket‑dapp

功能亮点

• 🧧 发送红包: 连接钱包后，设置金额和数量发送红包到区块链
• 🎁 领取红包: 通过分享链接，别人可以连接钱包直接从区块链领取红包
• 🔗 智能合约: 使用 Solidity 编写的安全智能合约处理所有逻辑
• 🌐 多链支持: 支持本地测试网和 BSC 测试网
• 💼 Web3 集成: 使用 MetaMask 钱包连接
• 🚀 完全去中心化: 没有后端服务器，所有数据存储在区块链

技术栈

• 前端：React 19、React Router 6、TypeScript、Vite、Ethers v6
• 合约层：Hardhat、Solidity 0.8.x
• 工具：ESLint、Prettier
• 不需要后端: 零依赖服务器 ❌

快速启动

# 1. 安装项目依赖
npm install
cd react-dapp && npm install && cd ..

# 2. 启动本地区块链节点
npm run node

# 3. 编译智能合约
npx hardhat compile

# 4. 部署智能合约
npm run deploy

# 5. 启动前端
npm run frontend

目录结构

redpacket-web3/
├─ contracts/                # Solidity 智能合约
│  └─ RedPacket.sol
├─ react-dapp/               # React + Vite 前端
│  ├─ src/
│  │  ├─ components/         # 通用组件（钱包按钮、创建表单等）
│  │  ├─ config/             # ABI、合约地址配置
│  │  ├─ hooks/              # 自定义 hooks（useWallet）
│  │  ├─ pages/              # 页面（Home、ClaimPacket）
│  │  ├─ styles/             # 全局样式
│  │  ├─ utils/              # Web3 工具函数
│  │  └─ App.tsx             # 路由与布局
│  ├─ .env.example           # 前端所需的环境变量说明
│  └─ package.json
├─ scripts/
│  └─ deploy.js              # Hardhat 部署脚本（会自动写入前端配置）
├─ hardhat.config.js
└─ package.json              # 根目录脚本（Hardhat + 前端一键启动）

使用指南

创建红包

1. 打开前端并点击右上角「连接钱包」。
2. 填写红包总金额与份数，应用会在前端随机拆分金额。
3. 提交后在 MetaMask 中确认交易，等待区块确认。
4. 成功后可复制系统生成的领取链接，分享给朋友。

领取红包

1. 打开分享链接（URL 带有 /claim/{packetId}）。
2. 同样先连接钱包，然后点击「点击领取」。
3. 签名确认后等待区块打包，页面会显示结果与剩余份数。

环境变量

• dapp/.env（开发环境会自动忽略，请参考 .env.example）
  • VITE_RPC_URL：前端直连节点 RPC，默认为 http://127.0.0.1:8545
  • VITE_CONTRACT_ADDRESS：可覆盖部署脚本写入的地址
  • VITE_CHAIN_ID：前端提示使用的链 ID（十六进制）
• root/.env：若需要在 Hardhat 中引用私钥或 BSC RPC，可继续沿用原有写法。

智能合约（RedPacket.sol）

核心方法：

本文2026-01-10首发于阿珏酱のBlog，最后修改于2026-01-10

作者：MoeJue（xxx@example.com）

开始前，我们先简单了解一下基本的概念，我大致归纳为以下几个点 什么是Web3.0，和区块链又有什么关系？（上回的文章不就派上用场了）

需求：开发一个基于Python的Web 3.0图片上传系统。这个系统将允许用户上传图片，并将图片存储在去中心化的网络上，同时记录交易信息在区块链上。 本就是写着玩的，想过要写成用户认证文件操作集成全套管理的，让他‘终将成为图片上传服务的最终解决方案’ 实际下来却发现不是很实际，就作罢了，奈何我一直以来对图片这么执着

步骤概述

1. 环境设置：使用Python开发，安装必要的Python库。
2. IPFS集成：将图片上传到IPFS，获取图片的CID（Content Identifier）。
3. 区块链集成：将IPFS CID记录在区块链上。
4. Web接口：使用Flask创建一个Web接口，允许用户上传图片。

详细步骤

1. 环境设置

安装所需的Python库：

pip install flask web3 ipfshttpclient

2. IPFS集成

IPFS（InterPlanetary File System）是一种点对点的文件存储协议。我们可以使用ipfshttpclient库来与IPFS网络交互。

首先，确保你已经安装并运行了IPFS节点。如果还没有安装IPFS，可以在IPFS官网找到安装指南。

以下是上传图片到IPFS的代码示例：

import ipfshttpclient

def upload_to_ipfs(file_path):
    client = ipfshttpclient.connect('/ip4/127.0.0.1/tcp/5001')
    res = client.add(file_path)
    return res['Hash']

3. 区块链集成

使用web3.py库将IPFS CID记录到区块链上。我们将以太坊（Ethereum）作为示例区块链。

以下是一个简单的智能合约示例，用于存储IPFS CID：

pragma solidity ^0.8.0;

contract IPFSStorage {
    mapping(address => string[]) public userCIDs;

    function storeCID(string memory cid) public {
        userCIDs[msg.sender].push(cid);
    }

    function getCIDs() public view returns (string[] memory) {
        return userCIDs[msg.sender];
    }
}

编译并部署该合约后，使用以下Python代码与智能合约交互：

本文2024-06-17首发于阿珏酱のBlog，最后修改于2025-07-06

作者：MoeJue（xxx@example.com）

又是一个莫名其妙的词语的新起-。- 我大致归纳为以下几个点

什么是web3.0

Web 3.0（Web3）是下一代互联网的发展方向，旨在创建一个更加去中心化、用户控制和数据保护的网络环境。与之前的Web 1.0（静态网页）和Web 2.0（动态、交互式网页和社交媒体）不同，Web 3.0的核心理念和技术包括以下几个方面：

去中心化：

• 区块链技术：Web 3.0的核心是区块链技术，它提供了一个去中心化的账本，记录所有的交易和数据变化。这意味着数据不再由单一的中央服务器控制，而是分布在多个节点上。
• 分布式应用（DApps）：这些应用程序运行在区块链网络上，没有中心化的控制者。DApps的用户可以直接进行交易和互动，而无需通过中介机构。

用户控制和数据保护：

• 用户主权身份：在Web 3.0中，用户可以完全控制自己的数字身份和数据。通过加密技术，用户可以决定谁可以访问他们的数据以及如何使用这些数据。
• 数据所有权：用户的数据存储在去中心化的网络上，用户拥有数据的所有权，而不是由大公司集中管理和控制。

智能合约：

• 自动执行协议：智能合约是在区块链上运行的自动化协议，当满足特定条件时自动执行。这种技术可以用于各种场景，如金融交易、供应链管理和法律合同。 互操作性：

• 跨平台和跨链技术：Web 3.0致力于实现不同区块链和分布式网络之间的互操作性，使得数据和资产可以在不同平台之间无缝转移。

去信任化和透明度：

• 无信任机制：Web 3.0通过区块链技术实现了无信任机制，即参与者无需互相信任或依赖第三方中介，就能进行安全的交易和互动。
• 透明性：所有交易和数据变更记录在区块链上，公开透明且不可篡改，提高了信任度和安全性。

Web 3.0的应用场景

1. 去中心化金融（DeFi）：通过智能合约和区块链技术，提供无需中介的金融服务，如借贷、交易和投资。
2. 数字身份：用户可以创建和管理自己的数字身份，控制个人数据的访问和使用。
3. 供应链管理：通过区块链技术，实现供应链的透明和可追溯性，防止伪造和欺诈。
4. 内容创作和分发：艺术家、音乐家和作家可以直接与观众互动和交易，获得更公平的收益分配。

那什么又是区块链呢？

区块链技术是一种分布式账本技术（Distributed Ledger Technology, DLT），用于记录交易和信息的不可篡改、去中心化的数据库。区块链技术的核心思想是通过去中心化的方式实现数据的安全、透明和可信。

区块链的基本原理

1. 区块（Block）：

   • 区块是包含交易记录的数据包。每个区块包含多个交易和一个哈希值（用于唯一标识该区块）。
   • 区块还包含上一个区块的哈希值，从而将所有区块连接成链，形成区块链。

2. 链（Chain）：

   • 区块通过哈希值相互连接，形成一个链式结构。每个区块包含前一个区块的哈希值，这使得区块链中的数据难以篡改。
   • 如果试图更改一个区块中的数据，将导致该区块及其后续所有区块的哈希值发生变化，需要重新计算所有这些区块的哈希值，这几乎是不可能的。

3. 去中心化（Decentralization）：

   • 区块链网络中的所有节点（计算机）都保存一个完整的区块链副本，这些副本通过共识机制保持一致。
   • 没有中央机构控制或管理区块链，数据由所有节点共同维护。

4. 共识机制（Consensus Mechanism）：

   • 区块链网络使用共识机制来确保所有节点对区块链的状态达成一致。常见的共识机制包括工作量证明（Proof of Work, PoW）和权益证明（Proof of Stake, PoS）。
   • 工作量证明（PoW）：矿工通过解决复杂的数学问题来验证交易，并将其添加到区块链中。解决问题需要大量计算能力，确保了区块链的安全性。 权益证明（PoS）：验证者根据其持有的加密货币数量和其他因素来验证交易，并获得相应的奖励。

5. 加密技术（Cryptography）： -区块链使用加密技术确保数据的安全性和隐私性。每个交易都使用公钥和私钥进行签名和验证，确保只有合法的所有者才能发起交易。

   ---

   本文2024-06-17首发于阿珏酱のBlog，最后修改于2025-07-06

   ]]> 教程 https://zh.moejue.cn/posts/269/ Sat, 05 Jul 2025 08:20:55 +0000 xxx@example.com (MoeJue) https://zh.moejue.cn/posts/269/ 多链支持，真没你想的那么简单

   作者：MoeJue（xxx@example.com）

   一次多链钱包集成的实践反思

   总算是空闲下来可以整理一下代码了，Web3项目接入多链钱包连接功能，主要涉及 Ethereum、Polygon、BSC 和 Solana。乍一听好像只是“多做几套兼容逻辑”的事，但真正落地后才发现，很多东西其实没想得那么简单。

   this.networkConfigs = {
       ethereum: {
           chainId: '0x1', // 1
           chainName: 'Ethereum Mainnet',
           nativeCurrency: {
               name: 'Ethereum',
               symbol: 'ETH',
               decimals: 18
           },
           rpcUrls: ['https://eth-mainnet.public.blastapi.io'],
           blockExplorerUrls: ['https://etherscan.io']
       },
       polygon: {
           chainId: '0x89', // 137
           chainName: 'Polygon Mainnet',
           nativeCurrency: {
               name: 'MATIC',
               symbol: 'MATIC',
               decimals: 18
           },
           rpcUrls: ['https://polygon-rpc.com'],
           blockExplorerUrls: ['https://polygonscan.com']
       },
       bsc: {
           chainId: '0x38', // 56
           chainName: 'BNB Smart Chain',
           nativeCurrency: {
               name: 'BNB',
               symbol: 'BNB',
               decimals: 18
           },
           rpcUrls: ['https://bsc-dataseed.binance.org'],
           blockExplorerUrls: ['https://bscscan.com']
       }
   }
   

   多链并不是简单的「支持多个钱包」

   最大的感受是：链不一样，钱包交互方式也不一样，连 SDK 的思维方式都不一样。以太坊生态可以用统一的 Web3.js 处理很多逻辑，而到了 Solana，你会发现它完全是另一套系统：Provider 接入、连接流程、PublicKey 构建方式都不太一样，甚至连网络延迟和稳定性都影响体验。

   ---

   本文2025-07-05首发于阿珏酱のBlog，最后修改于2025-07-05

   ]]> 折腾代码