SIWE: Hướng dẫn thực hành toàn diện Dapp xác thực danh tính Ethereum

2025-07-21 22:00:01

SIWE: Công cụ mạnh mẽ để cung cấp xác thực danh tính cho Dapp

SIWE (Đăng nhập bằng Ethereum) là một phương pháp xác thực danh tính người dùng trên Ethereum, tương tự như việc khởi tạo giao dịch, chứng minh quyền kiểm soát của người dùng đối với ví. Hiện nay, hầu hết các plugin ví đều hỗ trợ phương thức ký đơn giản này.

Bài viết này chủ yếu thảo luận về các tình huống ký trên Ethereum, không đề cập đến các chuỗi công khai khác.

Dự án của bạn có cần SIWE không?

Nếu Dapp của bạn có những yêu cầu sau, bạn có thể xem xét sử dụng SIWE:

Có hệ thống người dùng riêng
Cần tra cứu thông tin liên quan đến danh tính người dùng

Đối với Dapp( chủ yếu cung cấp chức năng tra cứu như etherscan), có thể không sử dụng SIWE.

Mặc dù sau khi kết nối ví, giao diện người dùng có thể xác nhận danh tính, nhưng đối với các cuộc gọi API cần hỗ trợ từ phía máy chủ, chỉ việc truyền địa chỉ không thể chứng minh danh tính, vì địa chỉ là thông tin công khai.

Nguyên lý và quy trình của SIWE

Quy trình SIWE bao gồm ba bước: kết nối ví, ký tên, lấy danh tính.

kết nối ví

Đây là thao tác Web3 phổ biến, kết nối đến Dapp qua plugin ví.

chữ ký

Các bước ký SIWE bao gồm:

Lấy giá trị Nonce: Gọi API phía sau để lấy giá trị Nonce ngẫu nhiên, liên kết với địa chỉ.
Xây dựng nội dung chữ ký: bao gồm giá trị Nonce, tên miền, ID chuỗi và các thông tin khác.
Chữ ký ví: Sử dụng phương pháp do ví cung cấp để ký nội dung.
Gửi chữ ký: Gửi chữ ký đến backend để xác thực.

Lấy danh tính

Sau khi xác minh chữ ký ở phía sau, trả về danh tính người dùng ( như JWT ). Các yêu cầu sau đó mang theo địa chỉ và danh tính, có thể chứng minh quyền sở hữu ví.

Thực hành SIWE

Chúng tôi sẽ phát triển một ứng dụng full-stack hỗ trợ SIWE bằng Next.js.

công việc chuẩn bị

Cài đặt Next.js:

npx create-next-app@14

Cài đặt các phụ thuộc liên quan đến SIWE:

npm install antd @ant-design/web3 @ant-design/web3-wagmi wagmi viem @tanstack/react-query --save

giới thiệu Wagmi

Trong layout.tsx, nhập WagmiProvider:

jsx import { WagmiWeb3ConfigProvider } from "@ant-design/web3-wagmi";

Thêm nút kết nối

Tạo một nút kết nối ví và ký.

jsx xuất khẩu mặc định chức năng App() { const jwt = React.useContext(JwtProvider);

return ( <connectbutton.connector> {({ tài khoản, kết nối }) => ( )} </connectbutton.connector> ); }

thực hiện giao diện backend

Giao diện Nonce

javascript xuất async function GET(request) { const { searchParams } = new URL(request.url); const address = searchParams.get("address");

nếu (!address) { throw new Error("Địa chỉ không hợp lệ"); } const nonce = randomBytes(16).toString("hex"); addressMap.set(address, nonce); return Response.json({ data: nonce }); }

Giao diện xác thực chữ ký

javascript xuất async function POST(request) { const { chữ ký, thông điệp } = await request.json(); const { nonce, address = "0x" } = parseSiweMessage(message);

nếu (!nonce || nonce !== addressMap.get(address)) { throw new Error("Invalid nonce"); }

const valid = await publicClient.verifySiweMessage({ thông điệp, địa chỉ, chữ ký, });

nếu (!valid) { throw new Error("Chữ ký không hợp lệ"); }

const token = jwt.sign({ address }, JWT_SECRET, { expiresIn: "1h" }); return Response.json({ data: token }); }

Tối ưu hóa hiệu suất

Để tăng tốc độ xác thực, nên sử dụng dịch vụ nút chuyên dụng. Có thể sử dụng dịch vụ nút của ZAN để thay thế RPC mặc định:

javascript const publicClient = createPublicClient({ chuỗi: mainnet, vận chuyển: http('), // Dịch vụ RPC nút ZAN });

Điều này sẽ nâng cao đáng kể tốc độ phản hồi của giao diện.

ETH-1.35%

DAPP4.26%

Xem bản gốc

Trang này có thể chứa nội dung của bên thứ ba, được cung cấp chỉ nhằm mục đích thông tin (không phải là tuyên bố/bảo đảm) và không được coi là sự chứng thực cho quan điểm của Gate hoặc là lời khuyên về tài chính hoặc chuyên môn. Xem Tuyên bố từ chối trách nhiệm để biết chi tiết.

8 thích