Fundacja Leroy Merlin — darowizny online z potwierdzoną wpłatą

Zadanie

Fundacja Leroy Merlin zbiera darowizny online na swojej stronie w Webflow, a płatności obsługuje Tpay. Zadanie: przenieść całą obsługę płatności na serwer. Strona miała odpowiadać tylko za wygląd formularza, a klucze Tpay, tworzenie transakcji i potwierdzanie wpłat zostać tam, gdzie przeglądarka ich nie widzi.

Jak to działa

Darczyńca wybiera kwotę i akceptuje regulamin. Przeglądarka wysyła do Workera na Cloudflare tylko kwotę i token weryfikacji. Worker sprawdza kwotę, zapisuje darowiznę, tworzy transakcję w Tpay i odsyła stronie adres płatności. Darczyńca płaci w Tpay: BLIK-iem, kartą, przelewem albo portfelem.

Po wpłacie Tpay wysyła potwierdzenie podpisane cyfrowo. Worker sprawdza podpis certyfikatem Tpay oraz to, czy numer transakcji i kwota zgadzają się z jego rejestrem. Dopiero wtedy darowizna dostaje status „opłacona”.

Formularz

Formularz zostaje w Webflow, więc zespół fundacji dalej zmienia jego wygląd sam. Skrypt na stronie odpowiada za wybór kwoty, komunikaty i przejście do płatności.

Kwota jest sprawdzana od razu i jeszcze raz na serwerze: od 5 do 10 000 zł, w pełnych złotych. Komunikaty są po polsku i odczytują je czytniki ekranu.

Przycisk aktywuje się dopiero po wyborze kwoty i akceptacji regulaminu. Po kliknięciu od razu pokazuje „Przekierowuję do płatności…”, a powrót z Tpay przyciskiem „Wstecz” nie blokuje formularza.

Ochrona przed nadużyciami

Cloudflare Turnstile sprawdza, czy formularz wysyła człowiek. Weryfikacja startuje w tle, gdy darczyńca zaczyna wypełniać formularz, i zwykle nie wymaga od niego żadnego kliknięcia. Serwer przyjmuje zgłoszenia tylko ze strony fundacji i najwyżej 10 prób na minutę z jednego adresu.

Rejestr darowizn

Każda darowizna trafia do bazy Cloudflare D1 ze statusem: utworzona, oczekuje na płatność, opłacona, zwrócona albo błąd. Baza nie przechowuje danych osobowych: dane płatnika zostają w Tpay. Każde zweryfikowane potwierdzenie trafia do dziennika, a potwierdzenie wysłane ponownie nie zmienia już zaksięgowanej wpłaty.

Testy

System ma dwa środowiska: testowe na Tpay Sandbox i produkcyjne, z osobnymi bazami i kluczami. Kod jest w TypeScript i ma 87 testów automatycznych, w tym próby podrobienia podpisu Tpay.

Efekt

Fundacja wie, które darowizny zostały naprawdę opłacone, a dane dostępowe do płatności nie opuszczają serwera. Strona i formularz zostają w Webflow, w rękach zespołu fundacji.