Intégrer le portefeuille Socios.com dans votre dApp

Les dApps ont généralement un bouton « Connecter le portefeuille » pour déclencher une fenêtre pop-up où l'utilisateur peut sélectionner son fournisseur de portefeuille. La pop-up enverra ensuite un message au portefeuille choisi afin de vérifier que cet utilisateur est bien le propriétaire de cette adresse de portefeuille.

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

Cette page vise à vous présenter différentes options parmi lesquelles choisir.

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

• 88882 : Spicy Testnet

• 88888 : Chiliz Mainnet

Commencez par tester votre intégration sur Spicy Testnet (88882), confirmez que tout fonctionne correctement, puis passez uniquement à 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 rationaliser la connexion des portefeuilles, la prise en charge multi-chaînes et les fonctionnalités avancées. Choisissez votre outil en fonction de la pile technologique de votre projet.

WalletConnect (maintenant Reown)

Reown est le nouveau nom de WalletConnect Inc. La célèbre boîte à outils de connexion de portefeuilles 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 AppKit, et vous devriez également consulter leur documentation complète.

REQUIS

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

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

Voir la doc Reown pour plus d'informations.

RainbowKit

RainbowKit est une bibliothèque React pour ajouter des fonctionnalités de connexion de portefeuille. Elle s'appuie sur viem et Wagmi , et fournit des composants préconstruits pour un flux d'intégration moderne et convivial.

Voir leur propre introduction pour en savoir plus à ce sujet.

Moralis

Moralis offre des flux d'authentification prêts à l'emploi pour les chaînes compatibles EVM (y compris Chiliz Chain si configuré correctement), ainsi que des méthodes côté serveur pour valider et gérer les sessions utilisateurs.

Si vous utilisez déjà Moralis, vous pouvez l'utiliser pour créer le bouton "Connecter le portefeuille" de vos dApps 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 :

• Intégration WalletConnect – Comment intégrer WalletConnect

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

thirdweb

thirdweb offre Connect, un flux d'inscription flexible qui s'adapte à différentes préférences est essentiel lors de l'intégration des utilisateurs.

Vous pouvez vous appuyer sur leur documentation sur les portefeuilles, et même jouer avec leur playground ConnectButton.

Recommander Socios.com Wallet dans la fenêtre modale

Vous pouvez personnaliser l'affichage de la fenêtre modale pour mettre en avant Socios.com Wallet :

• Avec Reown/WalletConnect : personnalisez la section « Portefeuille recommandé » de la modale en utilisant l'option explorerRecommendedWalletIds .

• Avec RainbowKit : vous pouvez construire votre propre liste de portefeuilles en utilisant les connectorsForWallets .

Assurer 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. De cette façon, l'utilisateur n'aura pas à se reconnecter à son adresse de portefeuille à chaque visite sur votre plateforme.

Méthodes prises en charge

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

• eth_sendTransaction

• eth_signTransaction

• personal_sign

Nous prévoyons de prendre en charge prochainement les méthodes suivantes :

• eth_signTypedData

• eth_signTypedData_v4

Vérification SIWE

Si vous souhaitez utiliser Socios.com Wallet pour vous authentifier en utilisant SWIE, veuillez noter que le Socios.com Wallet est un portefeuille SCA plutôt qu'un portefeuille EOA classique. L'écosystème Ethereum comprend deux types de comptes principaux : les comptes de contrat intelligent (SCAs) et les comptes détenus par des tiers externes (EOAs).

Alors que la signature des portefeuilles EOA peut être vérifiée avec ecrecover (par ex. en utilisant ethers.utils.verifyMessage ), la norme EIP-1271 (que le Socios.com Wallet utilise) 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, en fonction de cela, choisir la méthode de vérification appropriée.