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

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.

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.

スクリーンショット 2020-07-06 11.11.31.png * Une partie de l'image est recadrée.

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)
* Dans cet article, la clé est écrite directement par souci de clarté. Veillez à ne pas exposer les parties de ** pk_test_xxxxxxxxxxxxxxxxxx ** et ** sk_test_xxxxxxxxxxxxxxxxxxxxx ** à l'extérieur, par exemple en les lisant avec des variables d'environnement.

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 スクリーンショット 2020-07-06 15.25.19.png

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

スクリーンショット 2020-07-06 15.25.47.png

Appuyez sur Payer avec carte

スクリーンショット 2020-07-06 15.26.14.png

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 スクリーンショット 2020-07-06 15.44.08.png

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

Recommended Posts

Implémentation facile de la fonction de paiement par carte de crédit avec PAY.JP [Django]
Implémentation de la fonction de connexion dans Django
Equipé d'une fonction carte utilisant payjp
Implémentation de CRUD à l'aide de l'API REST avec Python + Django Rest framework + igGrid
Exploration avec Python et Twitter API 2-Implémentation de la fonction de recherche d'utilisateurs
Introduction et mise en œuvre de la fonction d'activation
Implémentation de la méthode Dyxtra par python
Implémentation de la fonction d'authentification du modèle utilisateur personnalisé dans Django REST Framework à l'aide de djoser
Introduction facile de la reconnaissance vocale avec Python