Intégrer le portefeuille Socios.com dans votre dApp

Les dApps disposent généralement d’un bouton « Connecter le portefeuille » qui déclenche une fenêtre contextuelle où l’utilisateur peut sélectionner son fournisseur de portefeuille. La fenêtre contextuelle envoie alors un message au portefeuille choisi afin de vérifier que cet utilisateur possède bien cette adresse de portefeuille.

Il existe plusieurs façons d’intégrer le Socios Wallet dans la modale contextuelle « Connect Wallet » de votre dApp. En vous appuyant sur des outils réputés, vous pouvez offrir une expérience sécurisée et fluide qui fonctionne avec plusieurs fournisseurs de portefeuilles (comme MetaMask et d’autres) et chaînes, y compris Chiliz Chain (à la fois Spicy Testnet et Chiliz Mainnet).

Cette page a pour objectif de vous présenter विभिन्न options parmi lesquelles choisir.

Parce que vous ciblez Chiliz Chain, assurez-vous de spécifier le bon chainId dans votre configuration :

• 88882 : Spicy Testnet

• 88888 : Chiliz Mainnet

Commencez par tester votre intégration sur Spicy Testnet (88882), vérifiez que tout fonctionne correctement, puis passez seulement ensuite à Chiliz Mainnet (88888).

Voir tous les paramètres ici : Se connecter à Chiliz Chain

Choisissez vos bibliothèques et frameworks

Vous pouvez tirer parti de divers outils externes pour simplifier la connexion aux portefeuilles, la prise en charge multichaîne et les fonctionnalités avancées. Choisissez votre outil en fonction de la pile technologique de votre projet.

WalletConnect (désormais Reown)

Reown est le nouveau nom de WalletConnect Inc. Le célèbre kit d’outils de connexion de portefeuille WalletConnect s’appelle désormais Reown SDK (ou AppKit). Il était auparavant connu sous le nom de Web3Modal.

Reown propose un guide étape par étape pour utiliser AppKitet vous devriez également consulter leur documentation complète.

OBLIGATOIRE

Le Socios.com Wallet implémente la norme ERC-1271 ce qui signifie que le contrat intelligent qui le sous-tend implémente la méthode isValidSignature() au lieu de erecover().

Par conséquent, votre dApp DOIT prendre en charge ERC-1271 et implémenter un appel à isValidSignature().

Voir la documentation Reown pour en savoir plus.

RainbowKit

RainbowKit est une bibliothèque React permettant d’ajouter des fonctionnalités de connexion aux portefeuilles. Elle repose sur viem et le Wagmi et fournit des composants préconstruits pour un flux d’intégration moderne et convivial.

Voir leur introduction propre pour en savoir plus.

Moralis

Moralis propose des parcours d’authentification prêts à l’emploi pour les chaînes compatibles EVM (y compris Chiliz Chain si elle est correctement configurée), ainsi que des méthodes côté serveur pour valider et gérer les sessions utilisateur.

Si vous utilisez déjà Moralis, vous pouvez l’utiliser pour créer le bouton « Connect Wallet » de votre dApp avec plusieurs méthodes/outils :

• Comment se connecter avec WalletConnect

• Comment authentifier les utilisateurs avec RainbowKit

• Comment authentifier les utilisateurs avec Magic.Link

• etc.

Ils ont également de longs articles de blog sur chacun d’eux :

• Intégration WalletConnect – Comment intégrer WalletConnect

• Comment ajouter une connexion avec RainbowKit à votre projet en 5 étapes

thirdweb

thirdweb propose Connecter, un flux d’inscription flexible qui tient compte de différentes préférences est essentiel lors de l’intégration des utilisateurs.

Vous pouvez vous appuyer sur leur documentation sur les portefeuilleset même tester leur ConnectButton playground.

Recommander Socios.com Wallet dans la modale contextuelle

Vous pouvez personnaliser l’affichage de la modale contextuelle pour mettre en avant Socios.com Wallet :

• Avec Reown/WalletConnect : personnalisez la section « Portefeuille recommandé » de la modale à l’aide de l’option explorerRecommendedWalletIds .

• Avec RainbowKit : vous pouvez créer votre propre liste de portefeuilles à l’aide de connectorsForWallets .

Assurez une expérience optimale pour vos utilisateurs

Pour une meilleure expérience utilisateur, nous vous recommandons de stocker l’adresse du portefeuille de l’utilisateur dans le stockage de session de votre dApp, ou dans le profil utilisateur. Ainsi, l’utilisateur n’aura pas besoin de connecter son adresse de portefeuille à chaque fois qu’il viendra sur votre plateforme.

Méthodes prises en charge

Socios.com Wallet prend en charge les méthodes suivantes :

• eth_sendTransaction

• eth_signTransaction

• personal_sign

Nous prévoyons bientôt de prendre en charge les méthodes suivantes :

• eth_signTypedData

• eth_signTypedData_v4

Vérification SIWE

Si vous souhaitez utiliser Socios.com Wallet pour authentifier à l’aide de SWIE, veuillez noter que Socios.com Wallet est un portefeuille SCA plutôt qu’un portefeuille EOA classique. &#xNAN;L’écosystème d’Ethereum comprend deux principaux types de comptes : les comptes de contrat intelligent (SCA) et les comptes détenus en externe (EOA).

Alors que la signature des portefeuilles EOA peut être vérifiée avec ecrecover (par exemple en utilisant ethers.utils.verifyMessage ), la norme EIP-1271 (qu’utilise Socios.com Wallet) exige d’appeler la méthode isValidSignature du contrat pour la vérifier.

Ainsi, lors de l’authentification d’un compte, vous devez d’abord vérifier si l’adresse est un contrat et, selon cela, choisir la méthode de vérification appropriée.