Guide d'utilisation de SIWE : Rendre votre Dapp plus puissant

SIWE(Se connecter avec Ethereum)est un moyen de vérifier l'identité des utilisateurs sur Ethereum, similaire à une transaction initiée par un portefeuille, prouvant le contrôle de l'utilisateur sur le portefeuille. Actuellement, l'authentification est devenue très simple, il suffit de signer les informations dans le plugin de portefeuille, la plupart des plugins de portefeuille courants sont déjà pris en charge. Cet article discute principalement des scénarios de signature sur Ethereum.

Est-il nécessaire d'utiliser SIWE

Si votre Dapp a les besoins suivants, vous pouvez envisager d'utiliser SIWE :

• Avoir son propre système d'utilisateurs
• Besoin de vérifier les informations liées à la vie privée de l'utilisateur

Mais si votre Dapp est principalement une fonction de consultation, comme une application similaire à etherscan, il n'est pas nécessaire d'avoir SIWE.

Vous pourriez vous demander, après avoir connecté votre portefeuille sur le Dapp, n'est-ce pas une preuve de propriété du portefeuille ? Cela ne s'applique qu'au front-end. Pour les appels d'interface nécessitant un support back-end, il ne suffit pas de transmettre l'adresse, car l'adresse est une information publique, et n'importe qui peut "emprunter" votre identité.

Principe et processus de SIWE

Le processus SIWE peut être résumé en trois étapes : Connecter le portefeuille - Signer - Obtenir l'identifiant.

Connecter le portefeuille

C'est une opération Web3 courante, qui connecte le portefeuille dans le Dapp via un plugin de portefeuille.

signature

Les étapes de signature incluent l'obtention de la valeur Nonce, la signature du portefeuille et la vérification de la signature par le backend.

Le backend génère une valeur nonce aléatoire et l'associe à l'adresse. Le frontend obtient la valeur nonce, puis construit le contenu de la signature, y compris la valeur nonce, le nom de domaine, l'ID de la chaîne, etc., en utilisant la méthode fournie par le portefeuille pour signer. Enfin, la signature est envoyée au backend.

Obtenir l'identifiant

Après la vérification de la signature par le backend, renvoyez l'identifiant de l'utilisateur ( comme JWT). Les requêtes ultérieures du frontend doivent inclure l'adresse et l'identifiant, ce qui prouve la propriété du portefeuille.

Pratique SIWE

Nous allons développer une simple démo SIWE avec Next.js pour montrer le processus de base. Attention, cette démo est uniquement à des fins d'introduction, une utilisation en production peut présenter des problèmes de sécurité.

travaux préparatoires

1. Installer Next.js

npx create-next-app@14

2. Installer les dépendances liées à SIWE

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

3. Importez WagmiProvider dans layout.tsx

4. Réaliser le bouton de connexion du portefeuille

5. Réaliser l'interface backend

   • Génération de Nonce
   • Vérification de la signature

6. Optimisation : utiliser des services de nœuds dédiés pour améliorer la vitesse de réponse

Grâce aux étapes ci-dessus, nous avons mis en place un cadre de connexion SIWE de base. L'utilisation de services de nœuds professionnels peut considérablement augmenter la vitesse de vérification, il est recommandé de l'adopter dans un environnement de production.