Heim  >  Artikel  >  Web-Frontend  >  So integrieren Sie ZinariPay mithilfe des NPM-Pakets in Ihre Anwendung

So integrieren Sie ZinariPay mithilfe des NPM-Pakets in Ihre Anwendung

PHPz
PHPzOriginal
2024-09-04 20:30:38367Durchsuche

Die Integration von Kryptowährungszahlungen in Ihre Webanwendung war noch nie so einfach. ZinariPay bietet ein robustes NPM-Paket, das es Entwicklern ermöglicht, USDT- und USDC-Zahlungsfunktionen nahtlos hinzuzufügen. In diesem Leitfaden führen wir Sie durch die Schritte zur Integration von ZinariPay in Ihre Anwendung mithilfe des NPM-Pakets.

Schritt 1: Installation

Zuerst müssen Sie das ZinariPay-Paket installieren. Dies kann je nach Wunsch entweder mit NPM oder Garn erfolgen.

Npm verwenden
Um mit npm zu installieren, führen Sie den folgenden Befehl in Ihrem Terminal aus:

npm install zinari-pay

Verwendung von Garn
Alternativ können Sie Garn verwenden, um das Paket zu installieren:

yarn add zinari-pay

Schritt 2: Konfiguration

Sobald das Paket installiert ist, müssen Sie es für Ihre Anwendung konfigurieren. Die Konfiguration umfasst das Erstellen einer Instanz von ZinariPay mit Ihren spezifischen Einstellungen.

Beispielkonfiguration
Hier ist ein einfaches Konfigurationsbeispiel mit Vanilla-JavaScript:

import ZinariPay from 'zinari-pay';

const zinariPay = new ZinariPay({
  appId: 'your-app-id',
  publicKey: 'your-public-key',
  log: process.env.NODE_ENV === 'development', /** Recommendation: Only 
use for development to avoid exposing sensitive data to end users
   */
});

Sie können Ihre AppId und Ihren PublicKey von Ihrem Dashboard

abrufen

Schritt 3: Initiieren Sie eine Transaktion

Sobald Ihre Konfiguration eingerichtet ist, können Sie jetzt eine Transaktion initiieren. Dies kann mit der Methode „initiateTransaction“ erfolgen.

Vanilla-JavaScript-Beispiel
So würden Sie eine Transaktion einleiten:

import ZinariPay from 'zinari-pay';

const zinariPay = new ZinariPay({...})

const payWithCryptoButton = document.getElementById("your-payment-button");

payWithCryptoButton.addEventListener("click", () => {
  zinariPay.initiateTransaction({
    amount: 10000,
    notificationEmailAddress: 'users@email.com',
    details: {
      /** Add all the extra details you need here,
       * we  call your webhook url with all this data included */
    },
    onConfirmed: (transactionDetails) => {
      /** Do something when the transaction is confirmed */
    }
  });
});

Reaktionsbeispiel
Wenn Sie React verwenden, können Sie ZinariPay wie folgt integrieren:

import ZinariPay from 'zinari-pay';

const zinariPay = new ZinariPay({
  appId: 'your-app-id',
  publicKey: 'your-public-key',
  log: process.env.NODE_ENV === 'development',
});

const App = () => {
  const handleClick = useCallback(({price, email}) => {
    zinariPay.initiateTransaction({
      amount: price,
      notificationEmailAddress: email,
      onConfirmed: (transactionDetails) => {
        /** Do something when the transaction is confirmed */
      },
      details: {
        /** Add all the extra details you need here,
         * we  call your webhook url with all this data included */
      },
    });
  }, []);

  return <button onClick={handleClick}>
    Pay with Cryptocurrency
  </button>
}

Fazit
Die Integration von ZinariPay in Ihre Anwendung mithilfe des NPM-Pakets ist unkompliziert und effizient. Mit Unterstützung für USDT und USDC, verschlüsselten Transaktionen und benutzerfreundlichen Methoden ist ZinariPay die perfekte Lösung, um Kryptowährungszahlungen zu Ihrer Webanwendung hinzuzufügen.
Für detailliertere Informationen besuchen Sie die offizielle Dokumentation und beginnen Sie noch heute mit dem Bau!

How to Integrate ZinariPay with Your Application Using the NPM Package
How to Integrate ZinariPay with Your Application Using the NPM Package
How to Integrate ZinariPay with Your Application Using the NPM Package
How to Integrate ZinariPay with Your Application Using the NPM Package
How to Integrate ZinariPay with Your Application Using the NPM Package

Das obige ist der detaillierte Inhalt vonSo integrieren Sie ZinariPay mithilfe des NPM-Pakets in Ihre Anwendung. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Stellungnahme:
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn