這是一個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 + 前端一鍵啟動）
使用指南
創建紅包
- 打開前端並點擊右上角「連接錢包」。
- 填寫紅包總金額與份數，應用會在前端隨機拆分金額。
- 提交後在 MetaMask 中確認交易，等待區塊確認。
- 成功後可複製系統生成的領取連結，分享給朋友。
領取紅包
- 打開分享連結（URL 帶有
/claim/{packetId}）。 - 同樣先連接錢包，然後點擊「點擊領取」。
- 簽名確認後等待區塊打包，頁面會顯示結果與剩餘份數。
環境變數
dapp/.env（開發環境會自動忽略，請參考.env.example）VITE_RPC_URL：前端直連節點 RPC，預設為http://127.0.0.1:8545VITE_CONTRACT_ADDRESS：可覆蓋部署腳本寫入的地址VITE_CHAIN_ID：前端提示使用的鏈 ID（十六進制）
root/.env：若需要在 Hardhat 中引用私鑰或 BSC RPC，可繼續沿用原有寫法。
智能合約（RedPacket.sol）
核心方法：
createRedPacket(bytes32 packetId, uint256 totalCount, uint256[] amounts)：創建紅包並把 ETH/BNB 存入合約。claimRedPacket(bytes32 packetId, uint256 index)：領取紅包，並按照隨機索引發放金額。getPacketInfo(bytes32 packetId)：查詢紅包總金額、數量、領取情況等。hasClaimed(bytes32 packetId, address user)：判斷用戶是否已經領取過。
Hardhat 節點或 BSC 測試網都可以復用以上接口，部署腳本會把最新地址同步到前端。若重新部署，請重新運行 npm run deploy。
部署USDC (USDC.sol)
-
編譯全部合約
npx hardhat compile -
部署 ERC-20 USDC 代幣
npx hardhat run scripts/deploy-usdc.js --network localhost -
命令
- 進入Hardhat環境
npx hardhat console --network localhost-
發送測試代幣
const usdc = await ethers.getContractAt("USDC","0xe7f1725E7734CE288F8367e1Bb143E90bb3F0512"); await usdc.transfer("0x8626f6940E2eb28930eFb4CeF49B2d1F2C9C1199",ethers.utils.parseUnits("1000", 6)); -
查詢餘額
const balance = await usdc.balanceOf("0x23618e81E3f5cdF7f54C3d65f7FBc0aBf5B21E8f"); console.log(ethers.utils.formatUnits(balance, 6));
網路
Local Hardhat
- 網路名稱: Hardhat Localhost
- RPC URL: http://127.0.0.1:8545
- 鏈 ID: 1337 (0x7a69)
- 貨幣符號: ETH
- 區塊瀏覽器: 無（本地節點控制台查看）
BSC Testnet
- 網路名稱: BSC Testnet
- RPC URL: https://data-seed-prebsc-1-s1.binance.org:8545
- 鏈 ID: 97
- 貨幣符號: tBNB
- 區塊瀏覽器: https://testnet.bscscan.com
常見問題
- 如何使用 BSC Testnet？
在 Hardhat 配置中增加 BSC 網路並部署，或將VITE_RPC_URL指向 BSC 節點，同時把VITE_CONTRACT_ADDRESS改為對應的鏈上地址即可。
祝你搶紅包愉快！🧨
⚠️ 提醒：本專案僅用於功能與可行性測試，尚未部署至測試網或主網，未經過完整安全測試，請勿用於實際資產操作，由此產生的風險需自行承擔。
