naxios

Versprechen in der Nähe von Vertrag, in der Nähe von Wallet und in der Nähe des RPC -Kunden für Browser. Dies wurde entwickelt, um die React -Integration mit nahezu Blockchain zu erleichtern und die riesige Kesselplatte zu vermeiden, eine Brieftasche und einen Vertrag aufzubauen.

Dokumentation

Inhaltsverzeichnis

• Merkmale
• Installation
• Wie man benutzt
• Utils
• Beitragen

Merkmale

• Vereinfachte Brieftasche und Vertragsintegration
• Unterstützt die Versprechen -API
• Einfach eine Vertragsoberfläche erstellen
• Brieftaschenverbindungsmodal, um leicht zu verwenden
• Automatische Transformationen für JSON -Daten
• Client -Seiteereignisse zu erkennen, wann die API fertig ist
• Hilfreiche React -Haken
• Cache -System für die view

Installation

Verwenden von NPM:

 # You can use any wallet selector version you want
npm install @wpdas/naxios @near-wallet-selector/[email protected]

Mit Garn:

 # You can use any wallet selector version you want
yarn add @wpdas/naxios @near-wallet-selector/[email protected]

Wie man benutzt

Vorbereitung

Importieren Sie die Beinwallet -Selektorstile. Die App benötigt es, um den Brieftaschenauswahl korrekt zu machen.

 import '@near-wallet-selector/modal-ui/styles.css'

Benutzen

Es ist super einfach, eine Brieftasche und/oder eine Vertrags -API auf einmal zu vertraglichen. Schauen Sie sich an:

 // web3Api.ts
import naxios from '@wpdas/naxios'

const naxiosInstance = new naxios ( {
  rpcNodeUrl : 'https://free.rpc.fastnear.com' , // optional
  contractId : CONTRACT_ID ,
  network : 'testnet' ,
} )

/**
 * NEAR Wallet API (Must be a single instance)
 */
export const walletApi = naxiosInstance . walletApi ( )

// Examples of contract API instance usage

/**
 * Contract API
 * This is going to use default contractId (CONTRACT_ID)
 */
export const contractApi = naxiosInstance . contractApi ( )

/**
 * Another Contract API
 */
export const socialDBcontractApi = naxiosInstance . contractApi ( { contractId : 'v1.social08.testnet' } )

/**
 * Greeting Contract API
 */
export const greetingContractApi = naxiosInstance . contractApi ( {
  contractId : 'dev-1692221685438-15421910364142' ,
} )

/**
 * NEAR RPC API
 */
export const rpcApi = naxiosInstance . rpcApi ( ) 

Öffnen des Anmeldewallet-Selector-Modals

Sie können das Modal für den Nahe -Brieftaschen -Selektor öffnen, indem Sie signInModal() anrufen:

 import { walletApi } from './web3Api'

walletApi . signInModal ( ) 

Anpassen der Brieftaschenoptionen für den Nahertragswähler -Selektor

Standardmäßig verwendet Naxios nur @Nah-Wallet-Selector/My-Near-Wallet, um die Brieftasche zu verbinden. Sie können jedoch wie folgt andere Brieftaschenwählern hinzufügen:

npm install @near-wallet-selector/ledger @near-wallet-selector/my-near-wallet

Dann können Sie Naxius wie folgt starten:

 import naxios from '@wpdas/naxios'
import { setupMyNearWallet } from '@near-wallet-selector/my-near-wallet'
import { setupLedger } from '@near-wallet-selector/ledger'

const naxiosInstance = new naxios ( {
  contractId : CONTRACT_ID ,
  network : 'testnet' , // or mainnet, localnet
  walletSelectorModules : [ setupMyNearWallet ( ) , setupLedger ( ) ] ,
} )

/**
 * NEAR Wallet API (Must be a single instance)
 */
export const walletApi = naxiosInstance . walletApi ( )

Finden Sie hier alle Nahballer -Selektoren heraus: in der Nähe des Brieftaschenwählers

Vertrags -API -Referenz

• view : Tätigen Sie einen schreibgeschützten Anruf, um Informationen aus dem Netzwerk abzurufen. Es hat die folgenden Parameter:
  • method : Vertragsmethodenname.
  • props? : Ein optionaler Parameter mit args für die Vertragsmethode.
  • config? : Derzeit hat dies nur die useCache -Requisite. Wenn Usecache wahr ist, wird dies nicht ausgestrahlte zwischengespeicherte Daten verwendet, anstatt die Vertragsmethode aufzurufen.
• call : Rufen Sie eine Methode an, die den Zustand des Vertrags ändert. Das ist zu zahlen. Es hat die folgenden Parameter:
  • method : Vertragsname
  • props? : Ein optionaler Parameter mit args für die Vertragsmethode, gas , deposit und callbackUrl wenn Sie den Benutzer nach Erfolg einer Transaktion auf eine bestimmte Seite bringen möchten.
• callMultiple : Rufen Sie mehrere Methoden an, die den Zustand des Vertrags ändern. Dies ist zu zahlen und hat die folgenden Parameter:
  • transactionsList : Eine Liste von Transaktionsrequisiten. Sie können buildTransaction(...) verwenden, um Ihnen zu helfen
  • callbackUrl? : Eine Seite, die den Benutzer nach dem Erfolg aller Transaktionen mitnehmen kann.

Brieftaschen -API -Referenz

• accounts : Unterzeichnete Konten.
• accountId : Haupt-/Erst-in-Konto-ID in der Liste der Konten.
• contractId : Vertrags -ID.
• initNear : Initialisiert eine Verbindung zur nahezu Blockchain. Dies wird automatisch aufgerufen, wenn eine Vertragsinteraktion vorliegt.
• network : Aktuelles Netzwerk ( testnet , mainnet oder localnet ).
• recentlySignedInWallets : Returns ID-S von 5, die kürzlich in Brieftaschen signiert sind.
• selectedWalletId : Selected Wallet ID
• signInModal : Öffnen Sie das Signin Wallet -Modal.
• wallet : Brieftasche Instanz.
• walletSelector : Brieftaschen -Instanz.

Vertragsansicht

Die Verwendung einer view -Methode ist kostenlos.

 import { greetingContractApi } from './web3Api'

// [free]
greetingContractApi . view < string > ( 'get_greeting' ) . then ( ( response ) => console . log ( response ) )

Vertragsanruf

Sie müssen für jede Anfrage bezahlen, die Sie für eine call stellen. Dies wird die Daten ändern und in der Blockchain speichern.

 import { greetingContractApi } from './web3Api'

// Set greeting [payable]
const args : { message : 'Hi there!!!' }
greetingContractApi . call < string | undefined > ( 'set_greeting' , args ) . then ( ( response ) => console . log ( response || 'done!' ) )

Vertrag mehrere Anrufe gleichzeitig

Neben dem call müssen Sie für jede Anfrage bezahlen, die Sie stellen. Dies wird die Daten ändern und in der Blockchain speichern.

 import { buildTransaction } from '@wpdas/naxios'
import { contractApi } from './web3Api'

// Using the default instance's contract
const transactionA = buildTransaction ( 'set_greeting' , { args : { greeting : 'Hello my dear!' } } )
const transactionB = buildTransaction ( 'set_age' , { args : { age : 22 } } )
// Using diff contract
const transactionC = buildTransaction ( 'update_state' , {
  receiverId : 'my-state-contract.testnet' ,
  args : { allowed : true } ,
} )

// Optional
const callbackUrl = 'https://my-page.com/callback-success'

// [payable]
contractApi . callMultiple ( [ transactionA , transactionB , transactionC ] , callbackUrl ) . then ( ( ) => console . log ( 'Done!' ) )

Cache -System

Es sind zwei Arten von Cache -Systemen zu verwenden. Sie sind Memory Cache und Storage Cache .

Memory Cache : wird gelöscht, wenn die App aktualisiert wird, da ihre Daten nur im Speicher leben.
Storage Cache : Die Daten bleiben auch dann, wenn die Registerkarte Browser aktualisiert wird. Daten werden mithilfe des lokalen Speichers bestehen.

Wenn Sie einen Cache instanziieren, müssen Sie die expirationTime (in Sekunden) bereitstellen. Dies wird verwendet, um zu wissen, wann der Cache zurückgegeben werden sollte, anstatt einen echten Vertragsanruf zu tätigen. Wenn der Cache abläuft, wird ein echter Anruf des Vertrags getätigt. Die Methode jedes Vertrags hat eine eigene Zeit des Ablaufs.

 // web3Api.ts
import naxios , { StorageCache } from '@wpdas/naxios'

// ...

/**
 * Cached - Greeting Contract API
 */
export const cachedGreetingContractApi = naxiosInstance . contractApi ( {
  contractId : 'dev-1692221685438-15421910364142' ,
  cache : new StorageCache ( { expirationTime : 5 * 60 } ) , // 5 minutes
} )

Um zwischengespeicherte view zu verwenden, können Sie einfach das Konfigurationsobjekt übergeben, der besagt, dass Sie zwischengespeicherte Daten verwenden möchten.

 import { cachedGreetingContractApi } from './web3Api'

// Fetch Greetings [free]
const args : { }
const config : { useCache : true }
cachedGreetingContractApi . view < string > ( 'get_greeting' , args , config ) . then ( ( response ) => console . log ( response ) )

Nahe RPC -API

Naxios bietet auch Zugriff auf die Nah -RPC -API, damit Sie alle gewünschten Daten abfragen können. Besuchen Sie in der Nähe von RPC -API -Dokumenten, um zu erfahren, wie man es benutzt.

 import { rpcApi } from './web3Api'

// Viewing account using Near RPC API
rpcApi
  . query ( {
    request_type : 'view_account' ,
    finality : 'final' ,
    account_id : 'wendersonpires.near' ,
  } )
  . then ( ( data ) => console . log ( 'Account Data:' , data ) ) 

Utils

buildTransaction

Die buildTransaction -Methode ist nützlich, wenn Sie die Transaktionsbehörde eines Vertrags erstellen müssen, hauptsächlich, wenn Sie mehrere Vertragsanrufe tätigen möchten.

Siehe Referenz hier.

validateNearAddress

Dies wird verwendet, um zu prüfen, ob eine Adresse eine gültige Nahanschrift ist.

 import { validateNearAddress } from '@wpdas/naxios'

console . log ( validateNearAddress ( 'fake.near' ) ) // true
console . log ( validateNearAddress ( 'fake.nears' ) ) // false
console . log ( validateNearAddress ( 'fake.testnet' ) ) // true
console . log ( validateNearAddress ( 'fake' ) ) // false 

calculateDepositByDataSize

Berechnen Sie die erforderliche Einzahlung für gespeicherte Daten. (~ 0,00001n pro Byte) mit etwas mehr für Puffer

 import { calculateDepositByDataSize } from '@wpdas/naxios'

const myData = { age : 22 , name : 'user name' }
console . log ( calculateDepositByDataSize ( myData ) ) // 0.00087 Near (not yocto NEAR) 

isClient

Einfacher Checker, um zu sagen, ob dies auf Server oder Client ausgeführt wird.

 import { isClient } from '@wpdas/naxios'

if ( isClient ( ) ) {
  console . log ( 'Hi from client' )
} else {
  console . log ( 'Hi from server' )
} 

Beitragen

Fühlen Sie sich frei, Probleme zu öffnen oder Anfragen zu ziehen. Für wichtige Änderungen öffnen Sie zuerst ein Problem, um zu besprechen, was Sie ändern möchten.