Платежи являются неотъемлемой частью онлайн-экосистемы, будь то в магазинах электронной торговли для обработки заказов или простого пожертвования кому-то. Интеграция платежного шлюза на ваш сайт может быть утомительным процессом. Давайте посмотрим, как вы можете интегрировать Razorpay на сайт Django.
Что мы строим?
Мы создадим базовую копию Buy Me Coffee, uhh Buy Me Chai где пользователи смогут делать нам пожертвования.
Однако процесс интеграции остается неизменным для всего, что вы создаете. Разобьем весь процесс на простые шаги.
Шаг 1. Запустите проект Django.
Убедитесь, что вы закончили установку django. Создайте новый проект под названием dj_razorpay, а затем запустите новое приложение под названием payment. Добавьте «оплату» в список установленных_приложений в файле settings.py. Также примените миграции.
INSTALLED_APPS = [ ... 'payment', ... ]
Шаг 2: Получите ключи Razorpay.
Сначала создайте учетную запись на веб- сайте Razorpay, вам просто нужно зарегистрироваться, указав свой адрес электронной почты и пароль, и добавить некоторую основную информацию, такую как номер телефона.
На экране настроек нажмите «Создать новый ключ», и ваш ключ будет сгенерирован. Вы получите идентификатор ключа и секретный ключ. В настоящее время наши платежи будут находиться в «тестовом режиме», т.е. реальных транзакций не будет, а возможности оплаты также ограничены. Чтобы принимать реальные деньги и разблокировать дополнительные способы оплаты, вам необходимо пройти KYC и предоставить свои банковские реквизиты. Процесс интеграции остается неизменным независимо от режима.
Примечание. Секретный ключ будет показан вам только один раз, поэтому немедленно скопируйте его куда-нибудь.
Теперь добавьте идентификатор ключа и секретный ключ для settings.py файла.
RAZOR_KEY_ID = YOUR_KEY_ID RAZOR_KEY_SECRET = YOUR_KEY_SECRET
Прежде чем двигаться дальше, давайте установим пакет python razorpay.
pip install razorpay
Шаг 3. Views.py
Это основной этап процесса. Во-первых, нам нужно понять, как работает оплата в Razorpay.
- Создайте заказ Razor на нашем сервере Django.
- Передайте идентификатор заказа и другие параметры во внешний интерфейс.
- Пользователь нажимает кнопку оплаты и производит оплату одним из способов оплаты.
- Razorpay обрабатывает успешные и неудачные платежи.
- В случае сбоя Razorpay облегчает повторную попытку платежа.
- В случае успеха Razorpay отправляет почтовый запрос на URL-адрес обратного вызова на нашем сервере.
- Проверьте подпись платежа, чтобы убедиться, что платеж подлинный и не подделан.
- После проверки зафиксируйте платеж и отобразите страницу успеха.
См. Комментарии к коду для получения более подробной информации.
Примечание. Сумма в Razorpay работает в единицах валюты, т.е. 500 рупий превратятся в 50000 пайсов.
from
django.shortcuts
import
render
import
razorpay
from
django.conf
import
settings
from
django.views.decorators.csrf
import
csrf_exempt
from
django.http
import
HttpResponseBadRequest
# authorize razorpay client with API Keys.
razorpay_client
=
razorpay.Client(
auth
=
(settings.RAZOR_KEY_ID, settings.RAZOR_KEY_SECRET))
def
homepage(request):
currency
=
'INR'
amount
=
20000
# Rs. 200
# Create a Razorpay Order
razorpay_order
=
razorpay_client.order.create(
dict
(amount
=
amount,
currency
=
currency,
payment_capture
=
'0'
))
# order id of newly created order.
razorpay_order_id
=
razorpay_order[
'id'
]
callback_url
=
'paymenthandler/'
# we need to pass these details to frontend.
context
=
{}
context[
'razorpay_order_id'
]
=
razorpay_order_id
context[
'razorpay_merchant_key'
]
=
settings.RAZOR_KEY_ID
context[
'razorpay_amount'
]
=
amount
context[
'currency'
]
=
currency
context[
'callback_url'
]
=
callback_url
return
render(request,
'index.html'
, context
=
context)
# we need to csrf_exempt this url as
# POST request will be made by Razorpay
# and it won't have the csrf token.
@csrf_exempt
def
paymenthandler(request):
# only accept POST request.
if
request.method
=
=
"POST"
:
try
:
# get the required parameters from post request.
payment_id
=
request.POST.get(
'razorpay_payment_id'
, '')
razorpay_order_id
=
request.POST.get(
'razorpay_order_id'
, '')
signature
=
request.POST.get(
'razorpay_signature'
, '')
params_dict
=
{
'razorpay_order_id'
: razorpay_order_id,
'razorpay_payment_id'
: payment_id,
'razorpay_signature'
: signature
}
# verify the payment signature.
result
=
razorpay_client.utility.verify_payment_signature(
params_dict)
if
result
is
None
:
amount
=
20000
# Rs. 200
try
:
# capture the payemt
razorpay_client.payment.capture(payment_id, amount)
# render success page on successful caputre of payment
return
render(request,
'paymentsuccess.html'
)
except
:
# if there is an error while capturing payment.
return
render(request,
'paymentfail.html'
)
else
:
# if signature verification fails.
return
render(request,
'paymentfail.html'
)
except
:
# if we don't find the required parameters in POST data
return
HttpResponseBadRequest()
else
:
# if other than POST request is made.
return
HttpResponseBadRequest()
Примечание. Необходимо зафиксировать платеж, иначе он будет автоматически возвращен плательщику.
Теперь сопоставьте указанные выше представления с URL-адресами в urls.py.
# dj_razorpay/urls.py
from
django.contrib
import
admin
from
django.urls
import
path
from
payment
import
views
urlpatterns
=
[
path('
', views.homepage, name='
index'),
path(
'paymenthandler/'
, views.paymenthandler, name
=
'paymenthandler'
),
path(
'admin/'
, admin.site.urls),
]
Шаг 4: интерфейс
Нам нужно передать идентификатор заказа Razorpay и другие параметры, упомянутые на предыдущем шаге. Сначала загрузите код javascript Razorpay, который будет отображать окно оплаты, и инициализируйте его с параметрами, полученными от бэкэнда. Добавьте прослушиватель событий к кнопке оплаты, чтобы окно оплаты открывалось при нажатии.
Здесь мы отображаем кнопку оплаты на самой домашней странице. Нам также понадобятся еще две страницы для успешной и неудачной оплаты.
<!DOCTYPE html>
<
html
lang
=
"en"
>
<
head
>
<
meta
charset
=
"UTF-8"
/>
<
meta
http-equiv
=
"X-UA-Compatible"
content
=
"IE=edge"
/>
<
meta
name
=
"viewport"
content
=
"width=device-width, initial-scale=1.0"
/>
<
title
>GFG</
title
>
<
style
>
* {
box-sizing: border-box;
padding: 0px;
margin: 0px;
font-family: cursive;
}
html,
body {
height: 100%;
}
body {
background-color: #f1f5f8;
display: flex;
justify-content: center;
align-items: center;
}
.card {
background-color: white;
padding: 25px;
border: 1px solid #bbbbbb;
border-radius: 5px;
box-shadow: 1px 1px 10px 0px rgb(0 0 0 / 25%);
}
.title {
text-align: center;
letter-spacing: 1px;
}
.muted {
color: #8e7f7f;
display: block;
margin-bottom: 10px;
text-align: center;
}
.btn_container {
padding: 20px;
text-align: center;
}
.btn {
border-radius: 4px;
cursor: pointer;
padding: 4px 8px;
background-color: #ffaaa7;
color: white;
font-size: 1.2em;
font-weight: 600;
letter-spacing: 1px;
}
</
style
>
</
head
>
<
body
>
<
div
class
=
"card"
>
<
h1
class
=
"title"
>Buy Me a Chai
</
h1
>
<
small
class
=
"muted"
>If you like my work, you can support me by donating ₹200</
small
>
<
div
class
=
"btn_container"
>
<!-- Payment Button -->
<
button
class
=
"btn"
id
=
"pay-btn"
>Donate
</
button
>
</
div
>
</
div
>
</
body
>
<!-- Razorpay's Javascript code. -->
<
script
src
=
"https://checkout.razorpay.com/v1/checkout.js"
></
script
>
<
script
>
var options = {
// Enter the Key ID generated from the Dashboard
key: "{{ razorpay_merchant_key }}",
// Amount is in currency subunits.
// Default currency is INR. Hence,
// 50000 refers to 50000 paise
amount: "{{ razorpay_amount }}",
currency: "{{ currency }}",
// Your/store name.
name: "Dj Razorpay",
// Pass the `id` obtained in the response of Step 1
order_id: "{{ razorpay_order_id }}",
callback_url: "{{ callback_url }}",
};
// initialise razorpay with the options.
var rzp1 = new Razorpay(options);
// add event listner to the payment button.
document.getElementById("pay-btn").onclick = function (e) {
rzp1.open();
e.preventDefault();
};
</
script
>
</
html
>
Шаг 5: Тестирование
Теперь давайте запустим сервер и проверим, все ли работает нормально!
python manage.py runserver
Мы успешно получили оплату !! Вы можете проверить эти платежи на панели управления Razorpay.