Hızlı Başlangıç: ödeme kabul etme

Bir React uygulamasında cüzdan bağlayan, ödeyenin bir token seçmesine olanak tanıyan ve adresinize gerçek bir ödemeyi onaylayan bir ödeme düğmesiyle sonuçlanacaksınız. Node.js 20+, bir React veya Next.js uygulaması (yeni bir create-next-app uygundur) ve ödeme yapacak bir cüzdana ihtiyacınız var.

1. Commerce Kit'i yükleyin

pnpm add @solana-commerce/kit

2. Düğmeyi ekleyin

PaymentButton bileşenini uygulamanızın herhangi bir yerine ekleyin ve satıcı cüzdanını kontrol ettiğiniz bir adrese ayarlayın:

import { PaymentButton } from "@solana-commerce/kit";

function Checkout() {
  return (
    <PaymentButton
      config={{
        merchant: { name: "My Store", wallet: "your-wallet-address" },
        mode: "tip"
      }}
      onPaymentSuccess={(signature) => {
        console.log("Payment confirmed:", signature);
      }}
    />
  );
}

Bileşen; cüzdan bağlantısını, token seçimini, işlem sürecini ve kullanıcı arayüzü durumunu dahili olarak yönetir. mode: "tip" ödeyenin tutarı seçmesine izin verir; sabit fiyatlı ve sepet ödemeleri için ödeme modlarına bakın.

Tarayıcıda deneyin

Ödeme düğgesini yapılandırın ve bu sayfadan ayrılmadan bahşiş akışını başlatın.

Commerce Kit Oyun Alanını tam ekranda açın

3. Ödeme alın

Uygulamanızı çalıştırın, düğmeye tıklayın, bir cüzdan bağlayın ve ödeme yapın. onPaymentSuccess geri çağrısı, makbuzunuz olan işlem imzasını alır: getTransaction ile veya herhangi bir gezginde arayın.

Sırada ne var

• Solana'da ödemeler nasıl çalışır - cüzdanlar, stablecoin'ler, token account'lar ve ücretler
• Ödemeleri doğrulayın - bir siparişi yerine getirmeden önce sunucu tarafında ödemeyi onaylayın
• Ödeme gönderin - kendi arka ucunuzdan ödemeler ve transferler
• Üretime hazırlık - gerçek para hareket etmeden önce