Implémentation facile de la fonction de paiement par carte de crédit avec PAY.JP [Django]

Qu'est-ce que PAY.JP?

Officiel: https://pay.jp/

Un service qui facilite l'introduction des paiements par carte de crédit. Implémentez en utilisant les API et SDK fournis.

Le formulaire de saisie des informations sur la carte fourni par PAY.JP est iframe

• J'ai peur car je ne comprends pas le mécanisme de paiement
• Je souhaite introduire une fonction de paiement sur le produit, mais il me semble difficile de gérer les informations personnelles

PAYJP protège complètement le seuil élevé autour du paiement de la partie d'entrée du client. Par conséquent, il ne leur est pas nécessaire de gérer des informations personnelles telles que le numéro de carte saisi par l'utilisateur, et il semble que cela puisse être implémenté en collant au moins une ligne de JavaScript. C'est incroyable.

Il semble que les données sur les paiements et les informations de carte puissent être obtenues à partir d'API basées sur REST. Je pense que la documentation est également facile à comprendre pour les ingénieurs, donc je pense qu'elle est facile à mettre en œuvre. Référence API PAY.JP

Que mettre en œuvre

Au moment de la rédaction de cet article, les seuls tutoriels officiels sont Flask et Sinatra. La plupart des autres articles Qiita ont été implémentés dans Rails, donc je vais l'implémenter dans Django.

Présentez PAY.JP et implémentez la fonction de paiement.

• PAY.JP a le concept de production et de test, et comme la production nécessite une application pour réellement échanger de l'argent, nous ne l'utilisons pas cette fois.Si c'est pour le test, vous pouvez l'essayer dans votre environnement.

Environnement d'exécution

MacOS Catalina version: 10.15.5
Python 3.8.3
Django 3.0.8
payjp  0.0.5

Première exécution de Django

Créez un dossier pour l'exemple de projet et déplacez-le dans le dossier.

$ mkdir my-project; cd my-project

Installez les bibliothèques requises (django, payjp).

$ pip install django payjp

Générer un projet Django

$ django-admin startproject project .

Confirmez que le serveur de développement est démarré avec le code suivant dans le répertoire où manage.py est généré.

$ python manage.py runserver

Vérifiez la clé API pour utiliser PAYJP

Vous pouvez vérifier la clé API à partir de "API" dans la barre latérale gauche en accédant à l'écran des paramètres PAYJP. Cette fois, je veux juste l'exécuter dans mon environnement, donc je vais utiliser la clé privée de test et tester la clé publique.

Maintenant que vous êtes prêt à travailler, créons une application et travaillons avec PAYJP.

Générez une application Django qui fonctionne avec PAY.JP.

$ python manage.py startapp app

Modifier le fichier de configuration Django

dans settings.py Enregistrez l'application créée précédemment et définissez la clé privée de PAY.JP.

project/settings.py

...

import payjp

...

...

...

INSTALLED_APPS = [
    "django.contrib.admin",
    "django.contrib.auth",
    "django.contrib.contenttypes",
    "django.contrib.sessions",
    "django.contrib.messages",
    "django.contrib.staticfiles",
    #ajouter à
    "app", 
]

...

...

...

# PAY.Paramètres JP
payjp.api_key = "sk_test_xxxxxxxxxxxxxxxxxxxxx" #Tester la clé privée

Mettre en œuvre la vue

app/views.py

from django.shortcuts import render
from django.views.generic import View

import payjp


# Create your views here.
class PayView(View):
    """
    use PAY.JP API
    """

    def get(self, request):
        #Passer la clé publique
        return render(
            request, "index.html", {"public_key": "pk_test_xxxxxxxxxxxxxxxxxxxxxxxx"}
        )

    def post(self, request):
        amount = request.POST.get("amount")
        payjp_token = request.POST.get("payjp-token")

        #Générer des informations client à partir de jetons
        customer = payjp.Customer.create(email="[email protected]", card=payjp_token)
        #Effectuer un paiement
        charge = payjp.Charge.create(
            amount=amount,
            currency="jpy",
            customer=customer.id,
            description="Django example charge",
        )

        context = {"amount": amount, "customer": customer, "charge": charge}
        return render(request, "index.html", context)

Créer un modèle

app

$ mkdir templates; cd templates
$ touch index.html

app/templates/index.html

<!DOCTYPE html>
<html lang="ja">
<head>
  <meta charset="UTF-8" />
  <meta http-equiv="x-ua-compatible" content="IE=edge" />
  <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no" />
  <title>Exemple d'application</title>
</head>

<body>
  <h1>Paiement</h1>

  {% if charge %}
    <p>{{ amount }}Le paiement en yens est terminé.</p>
    <br>
    <p>customer: {{ customer }}</p>
    <br>
    <p>Charge: {{ charge }}</p>
  {% else %}
    <form action="{% url 'app' %}" method="post">
      {% csrf_token %}
      <div>
        <label for="amount">Paiement</label>
        <input type="number" name="amount" id="amount" required>
      </div>

      <script type="text/javascript" src="https://checkout.pay.jp" class="payjp-button" data-key="{{ public_key }}">
      </script>
    </form>
  {% endif %}
</body>
</html>

Paramètres de routage

project/urls.py

from django.contrib import admin
from django.urls import path

from app import views

urlpatterns = [
    path("admin/", admin.site.urls),
    path("", views.PayView.as_view(), name="app")
]

Je pense que vous l'avez implémenté!

Structure du répertoire final

my-project
├── app
│   ├── __init__.py
│   ├── admin.py
│   ├── apps.py
│   ├── migrations
│   ├── models.py
│   ├── payjp.py
│   ├── templates
│   │   └── index.html
│   ├── tests.py
│   └── views.py
├── manage.py
└── project
    ├── __init__.py
    ├── asgi.py
    ├── settings.py
    ├── urls.py
    └── wsgi.py

Contrôle de fonctionnement

Lancer l'application

$ python manage.py runserver

http://127.0.0.1:8000/ Lorsque vous accédez

S'affiche, saisissons le montant du paiement et les informations de la carte.

Appuyez sur Payer avec carte

Vous pouvez également vérifier les détails de paiement sur PAY.JP, alors assurez-vous de disposer des informations que vous avez saisies précédemment. Élément "Ventes" dans la barre latérale

finalement

Django a pu facilement implémenter le traitement des paiements! J'ai utilisé la conception de formulaire par défaut cette fois, mais il semble que je puisse la personnaliser en définissant mon propre CSS. Aussi, bien que le traitement du modèle ait été omis cette fois, il est possible de créer une application pratique en sauvegardant la réponse (informations de paiement, etc.) renvoyée par l'API PAYJP dans la base de données avec les informations utilisateur. C'est vrai.

Lien de référence:

Guide de l'utilisateur de l'API PAY.JP Référence API PAY.JP