Привет всем и добро пожаловать во вторую часть серии, где мы строим магазин электроники, а затем собираем платежи от пользователей, которые могут выбрать, как платить. В случае, если вы пропустили часть 1, тогда Вот это . Мы закончили его там, где у нас была следующая страница ( http://localhost: 8000/ ) Что ж, в этой части мы собираемся создать подробную страницу для отдельного продукта, а затем добавим форму для сбора платежных сведений, включая имя, электронную почту и номер телефона пользователя. Как только у нас будут эти данные, мы подключимся с FlutterWave Чтобы обработать платеж. Затем мы возьмем ответ от FlutterWave в нашей функции обратного вызова и сделаем с ним вещи. Звучит смешно? Давай испаемся!
ИНФОРМАЦИЯ О ПРОДУКТЕ
Нам нужно найти способ получить доступ к одному продукту, когда его имя нажимается. Open views.py и добавьте в него следующий код ниже, что у нас уже есть:
def product_detail(request, pk):
data = Product.objects.get(id=pk)
ctx={
'product':data
}
return render(request,
'product.html',
ctx)
Таким образом, мы захватываем текущий идентификатор продукта и просят базу данных, чтобы дать нам только его подробности. Мы добавляем детали в нашу контекстную переменную и передаем ее в HTML. Open urls.py И добавьте путь как так:
path('product//details', product_detail, name='details'),
Далее давайте обновим «шаблоны/продукты. Html», как в паште, найдено Здесь Затем откройте шаблоны/product.html ‘и добавьте к нему код найден Здесь При всем этом доступ к домашней странице и нажмите на любой продукт, и, надеюсь, вы увидите его подробную страницу, такую как приведенная ниже: Если вы столкнетесь с ошибкой, пожалуйста, проверьте консоль терминала и исправьте перед движением.
Платеж
Нам нужно запечатлеть детали пользователя, пытающегося купить заданный продукт. В Django лучший способ сделать это – представить клиенту форму, которую они заполняют, а затем в отправке мы получаем значения, введенные пользователем. Создайте новый файл внутри «Electronics» с названием forms.py :
touch electronics/forms.py
Добавьте в него следующий код:
from django import forms
class PaymentForm(forms.Form):
name = forms.CharField(label='Your name', max_length=100)
email = forms.EmailField()
phone=forms.CharField(max_length=15)
amount = forms.FloatField()
Наша форма готова, давайте обновим функцию детали продукта, чтобы содержать форму и логику, чтобы получить данные формы, как только пользователь нажимает кнопку «Отправить»:
def product_detail(request, pk):
data = Product.objects.get(id=pk)
if request.method=='POST':
form = PaymentForm(request.POST)
if form.is_valid():
name= form.cleaned_data['name']
email = form.cleaned_data['email']
amount = form.cleaned_data['amount']
phone = form.cleaned_data['phone']
return redirect(str(process_payment(name,email,amount,phone)))
else:
form = PaymentForm()
ctx={
'product':data,
'form':form
}
return render(request,
'product.html',
ctx)
Мы добавляем нашу форму, чтобы получить информацию о платеже. Мы проверяем, является ли глагол запроса «post». Затем мы очищаем форму и получаем значения, введенные пользователем, то есть имя, электронная почта, телефон. Сумма будет скрыта, так как мы можем получить к нему доступ к деталям продукта. Давайте перейдем к созданию метода, который назовет конечную точку Flutterwave, внутри views.py Добавьте к нему приведенный ниже код.
def process_payment(name,email,amount,phone):
auth_token= env('SECRET_KEY')
hed = {'Authorization': 'Bearer ' + auth_token}
data = {
"tx_ref":''+str(math.floor(1000000 + random.random()*9000000)),
"amount":amount,
"currency":"KES",
"redirect_url":"http://localhost:8000/callback",
"payment_options":"card",
"meta":{
"consumer_id":23,
"consumer_mac":"92a3-912ba-1192a"
},
"customer":{
"email":email,
"phonenumber":phone,
"name":name
},
"customizations":{
"title":"Supa Electronics Store",
"description":"Best store in town",
"logo":"https://getbootstrap.com/docs/4.0/assets/brand/bootstrap-solid.svg"
}
}
url = ' https://api.flutterwave.com/v3/payments'
response = requests.post(url, json=data, headers=hed)
response=response.json()
link=response['data']['link']
return link
Обратите внимание, что этот метод загружает секретный ключ из .env файл. Таким образом, создайте файл в «электронике», называемой .env и добавить код ниже:
SECRET_KEY='YOUR FLUTTERWAVE SECRET KEY'
Получение FlutterWave Secret Key
Войдите в свою учетную запись FlutterWave и перейдите к Настройки API Анкет Создайте новые ключи или скопируйте то, что у вас уже есть, если вы сгенерировали ранее. Мы хотим, в частности, это «секретный ключ». Скопировать и добавить в .env Файл, который вы ранее создали. Затем добавьте следующий код в верхней части вашего views.py Для инициализации переменных нашей среды:
import environ # Initialise environment variables env = environ.Env() environ.Env.read_env()
Перенаправить URL
Когда мы сделаем запрос в Post в FlutterWave со всеми собранными деталями, они будут называть ваш указанный redirect_url и опубликовать ответ на вас. Они также будут добавлять ваш идентификатор транзакции (Transaction_id), ссылку на транзакцию (TX_REF) и статус транзакции (статус) в качестве параметров запроса на redirect_url Like: /tx_ref = ref & transaction_id = 30490 & status = успешно . После того, как у нас есть данные ответа, мы можем проверить статус транзакции и предоставить ценность для наших клиентов, например, сохранение его в базе данных и предоставление обратной связи пользователям. В этом случае мы собираемся просто распечатать ответ на консоли. Не стесняйтесь поиграть с ответом. Добавьте следующую функцию к views.py :
from django.views.decorators.http import require_http_methods
from django.http import HttpResponse
@require_http_methods(['GET', 'POST'])
def payment_response(request):
status=request.GET.get('status', None)
tx_ref=request.GET.get('tx_ref', None)
print(status)
print(tx_ref)
return HttpResponse('Finished')
Тогда обновление urls.py вот так:
from os import name
from django.contrib import admin
from django.urls import path
from django.conf import settings
from django.conf.urls.static import static
from electronics.views import list_products, payment_response, product_detail
urlpatterns = [
path('admin/', admin.site.urls),
path('', list_products, name='list'),
path('product//details', product_detail, name='details'),
path('callback', payment_response, name='payment_response')
]
if settings.DEBUG:
urlpatterns += static(settings.MEDIA_URL, document_root=settings.MEDIA_ROOT)
Обновить детали продукта html
У нас есть вся логика для обработки сбора платежей. Следующее – обновить «шаблоны/product.html», чтобы отразить это изменение. Скопируйте код найден В этой вставке и вставьте его в свой файл. Поверните сервер и отправляйтесь на домашнюю страницу. Выберите любой продукт и введите имя клиента, электронную почту и телефон и нажмите «Отправить». Вы должны увидеть модал платежа, похожий на приведенный ниже: Вы также можете заплатить, используя банковскую карту:
Сделано сделка
Профь! Если вы пришли к этому моменту, погладитесь себя! Это была некоторая работа работы. Поздравляем с завершением серии. В серии мы смогли создать магазин электроники, собрать платеж от пользователя, у которого был выбор выбора мобильных денег или карты, а затем извлекит статус транзакции и ссылочный номер для добавления стоимости. Если у вас есть какие -либо вопросы, оставите их внизу, и я сделаю все возможное, чтобы ответить на них. Найди меня на Twitter и Мой личный сайт Анкет До следующего раза, счастливого взлома!
Оригинал: “https://dev.to/nick_langat/collect-payments-in-your-django-ecommerce-portal-using-flutterwave-part-2-3k61”