Android

Offrez Affirm comme option de paiement sur les applications Android.

Aperçu

Commencer un paiement avec Affirm sur un client Android consiste à créer un formulaire de paiement, à tokeniser les renseignements des clients pour les transmettre en toute sécurité à votre serveur, et en utilisant cela checkout_token pour initier une transaction.

Ce guide vous explique la manière de configurer le client Android sur vos pages de paiement.

Le SDK Android est disponible sur Github.

1. Configurer Affirm sur Android


Avec Gradle

Pour installer le SDK, ajoutez affirm-merchant-sdk-android au bloc de dépendances de votre fichier app/build.gradle:

apply plugin: 'com.android.application'

android { ... }

dependencies {
  // ...

  // Affirm Android SDK
  implementation 'com.affirm:affirm-android-sdk:2.0.19'
}

Avec Maven

Ajoutez la dépendance Affirm à votre fichier pom.xml :

<dependency>
  <groupId>com.affirm</groupId>
  <artifactId>affirm-android-sdk</artifactId>
  <version>2.0.19</version>
</dependency>

🚧

Pour en savoir plus sur la dernière version du SDK et les versions antérieures, consultez la page des versions sur GitHub. Pour recevoir des notifications lorsqu'une nouvelle version est publiée, surveillez communiqués pour le dépôt.

2. Initialiser Affirm


Configurez le SDK avec votre clé API publique Affirm pour envoyer des demandes au serveur Affirm.

Affirm.initialize(Affirm.Configuration.Builder("public key")
			.setEnvironment(Affirm.Environment.SANDBOX)
			.setMerchantName("merchant name")
			.setReceiveReasonCodes("true")
			.setLogLevel(Affirm.LOG_LEVEL_DEBUG)
			.setCheckoutRequestCode(8001)
			.setVcnCheckoutRequestCode(8002)
			.setPrequalRequestCode(8003)
			.build())

3. Rendu du paiement Affirm


La création de paiement est le processus dans lequel un client utilise Affirm pour payer un achat dans votre application. Vous pouvez créer un objet checkout et lancez le paiement Affirm à l'aide de fonction Checkout.

final Checkout checkout = Checkout.builder()
        .setOrderId("order id")
        .setItems(items)
        .setBilling(shipping)
        .setShipping(shipping)
        .setShippingAmount(0f)
        .setTaxAmount(100f)
        .setTotal(1100f)
        .build();
 
Affirm.startCheckout(this, checkout, false);

🚧

L’objet de paiement contient des détails sur la commande.
Les montants doivent être des montants en dollars représentés sous forme de flotteurs.

Ajouter un message promotionnel d'Affirm


Les composants de la messagerie promotionnelle Affirm- messages de paiement mensuels et modaux éducatifs - - expliquent aux clients la manière dont ils peuvent utiliser Affirm pour financer leurs achats. Une messagerie promotionnelle correctement placée contribuent à augmenter la valeur moyenne des commandes et la conversion.

Ajouter un message de paiement mensuel

Pour afficher la messagerie promotionnelle, notre SDK fournit une classe AffirmPromotionButton . Pour mettre en œuvre le AffirmPromotionButton:

<com.affirm.android.AffirmPromotionButton
    android:id="@+id/promo"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_below="@id/price"
    android:layout_centerHorizontal="true"
    android:layout_marginTop="20dp"
    app:htmlStyling="false"
    app:affirmTextFont="@font/apercu_bold"
    app:affirmTextColor="@android:color/darker_gray"
    app:affirmTextSize="16sp"
    app:affirmColor="AffirmColorTypeBlue"
    app:affirmLogoType="AffirmDisplayTypeLogo"/>

Utilisez l'une des méthodes de mise en œuvre suivantes: 

// Option1 - Load via findViewById
AffirmPromotionButton affirmPromotionButton1 = findViewById(R.id.promo);
Affirm.configureWithAmount(affirmPromotionButton1, null, PromoPageType.PRODUCT, 1100, true);
// Option2 - Initialize by new
AffirmPromotionButton affirmPromotionButton2 = new AffirmPromotionButton(this);
((FrameLayout)findViewById(R.id.promo_container)).addView(affirmPromotionButton2);
Affirm.configureWithAmount(affirmPromotionButton2, null, PromoPageType.PRODUCT, 1100, true);

Pour personnaliser le bouton de messagerie promotionnelle, nous avons deux options:

Option 1 : Utiliser configWithLocalStyling pour utiliser les styles locaux sur la chaîne dans le bouton

// You can custom with the AffirmColor, AffirmLogoType, Typeface, TextSize, TextColor
affirmPromotionButton2.configWithLocalStyling(
                AffirmColor.AFFIRM_COLOR_TYPE_BLUE,
                AffirmLogoType.AFFIRM_DISPLAY_TYPE_LOGO,
                ResourcesCompat.getFont(this, R.font.apercu_bold),
                android.R.color.darker_gray,
                R.dimen.affirm_promotion_size);

Option 2: configWithHtmlStyling utilisera le style html du serveur Affirm. Vous pouvez ajouter des polices en suivant les étapes ci-dessous, afin de personnaliser les polices en html.

1. Ajoutez un fichier de police dans le répertoire /res/font/ . Comme lacquer_regular.ttf.
2. Ajoutez une déclaration pour le fichier de police. Vous pouvez vérifier le détail dans la police de caractères .
3. Utiliser la police dans le fichier css. Vous pouvez vérifier les détails dans remote_promo.css.

// If you want to custom the style of promo message, should pass the local or remote url and the file of typeface declaration
affirmPromotionButton2.configWithHtmlStyling("file:///android_asset/remote_promo.css", typefaceDeclaration);

En tapant sur le AffirmPromotionButton démarre automatiquement le flux de préqualification. Si vous souhaitez gérer les erreurs, remplacez onActivityResult afin qu'Affirm puisse gérer le résultat.

@Override
protected void onActivityResult(int requestCode, int resultCode, @Nullable Intent data) {
    if (Affirm.handlePrequalData(this, requestCode, resultCode, data)) {
        return;
    }
    super.onActivityResult(requestCode, resultCode, data);
}

@Override
public void onAffirmPrequalError(String message) {
    Toast.makeText(this, "Prequal Error: " + message, Toast.LENGTH_LONG).show();
}

Récupérez un message promotionnel, puis affichez-le avec votre propre TextView.

  • Vous pouvez recevoir le message promotionnel via fetchPromotion, un objet SpannableString est renvoyé après la réussite de la demande.
  • onPromotionClick: Cette méthode gère les événements qui cliquent sur le message promotionnel
TextView promotionTextView = findViewById(R.id.promotionTextView);
    Affirm.PromoRequestData requestData = new Affirm.PromoRequestData.Builder(PRICE, true)
        .setPromoId(null)
        .setPageType(null)
        .build();

    promoRequest = Affirm.fetchPromotion(requestData, promotionTextView.getTextSize(), this, new PromotionCallback() {
        @Override
        public void onSuccess(@Nullable SpannableString spannableString, boolean showPrequal) {
            promotionTextView.setText(spannableString);
            promotionTextView.setOnClickListener(v -> Affirm.onPromotionClick(MainActivity.this, requestData, showPrequal));
        }
   
        @Override
        public void onFailure(@NonNull AffirmException exception) {
                   Toast.makeText(getBaseContext(), "Failed to get promo message, reason: " + exception.toString(), Toast.LENGTH_SHORT).show();
            }
        });

L'appel à la méthode create lancera la demande, et l'appel à la méthode cancel annulera la demande.

@Override
    protected void onStart() {
        super.onStart();
        promoRequest.create();
    }

    @Override
    protected void onStop() {
        promoRequest.cancel();
        super.onStop();
    }

Suivre la commande confirmée

L'événement trackOrderConfirmed s'est déclenché lorsqu'un client effectue l'achat. Notre SDK fournit l'objet AffirmTrack pour déclencher le suivi.

final AffirmTrack affirmTrack = AffirmTrack.builder()
        .setAffirmTrackOrder(affirmTrackOrder)
        .setAffirmTrackProducts(affirmTrackProducts)
        .build();

Affirm.trackOrderConfirmed(MainActivity.this, trackModel());
  • Puisqu'il n'y a pas de rappel, il renverra le succès après un délai de 10 secondes.
  • Nous remplacerons l'API HTTP une fois l'API terminée.

5. Gérer les rappels


Assurez-vous de remplacer onActivityResult, puis à appeler la méthode handleCheckoutData . Il retournera le checkout_token requis pour initier la transaction sur votre serveur.

@Override
protected void onActivityResult(int requestCode, int resultCode, @Nullable Intent data) {
    if (Affirm.handleCheckoutData(this, requestCode, resultCode, data)) {
        return;
    }
    super.onActivityResult(requestCode, resultCode, data);
}

Nous avons également quelques fonctions de gestionnaire supplémentaires disponibles :

@Override
public void onAffirmCheckoutSuccess(@NonNull String token) {
    Toast.makeText(this, "Checkout token: " + token, Toast.LENGTH_LONG).show();
}
 
@Override
public void onAffirmCheckoutCancelled() {
    Toast.makeText(this, "Checkout Cancelled", Toast.LENGTH_LONG).show();
}
 
@Override
public void onAffirmCheckoutError(String message) {
    Toast.makeText(this, "Checkout Error: " + message, Toast.LENGTH_LONG).show();
}

👍

Une fois que le paiement a été confirmé par l'utilisateur, l'objet AffirmCheckoutDelegate recevra un checkout_token. Ce jeton doit être transféré sur votre serveur, qui doit être utilisé pour autoriser des frais sur le compte de l'utilisateur.

6. Créer une charge


Lorsqu'un client réussit à passer à la caisse, il est enregistré comme une nouvelle tentative d'achat. Cela doit être géré côté serveur pour être traité via notre API Charges.