Aktsepteerige krediitkaardimakseid PHP-s PayPal Payments Pro abil
Kas soovite integreerida makselüüsi, mis aktsepteerib krediitkaardimakseid? Krediitkaardimakse on üks parimaid võimalusi veebimakse aktsepteerimiseks. Kliendid eelistavad maksta veebis krediitkaartide kaudu. Võib juhtuda, et kaotate kliente lihtsalt seetõttu, et teie veebisait ei aktsepteeri krediitkaardimakseid. Veebipoe omanikuna peaksite oma veebisaidil makse vastuvõtmiseks lisama krediitkaardivõimaluse.
Saadaval on palju makselüüse, mis toetavad krediitkaarti. Näiteks Authorize.Net ja Stripe võimaldavad kaardimakseid veebis aktsepteerida.
- Nõustuge krediitkaardimaksega, kasutades autoriseerimise.Net makselüüsi PHP-s
- Juhend triipude integreerimiseks veebisaidil koos PHP-ga
Lugejad valivad mis tahes ülaltoodud võimalustest, kuid kui nad soovivad minna PayPali, jätkake lugemist. Selles artiklis näitan teile, kuidas krediitkaardimakseid PayPal Payments Pro abil aktsepteerida.
PayPal Payments Pro aktsepteerib makseid täiesti kohandatava lahendusega. See tähendab, et saate luua oma maksevormi ja oma kliendilt tasu võtta. See ei suunata teid tehingu lõpuleviimiseks PayPali veebisaidile.
Loome ka oma vormi, kus klient sisestab oma kaardi andmed ja saab tasuda veebisaidilt lahkumata. Kasutaja saab kujundada oma kassas lehe ja võimaldab kasutajal sisestada kaardi üksikasjad. Niisiis sukeldume ilma pikema viivituseta.
Alustamine
Enne reaalajas maksete vastuvõtmist on alati soovitatav seda kõigepealt liivakasti režiimis testida. Kui kõik töötab liivakastis ootuspäraselt, peaksime kliendi maksetega seotud probleemide vältimiseks selle elama panema. Maksete testimiseks peab teil olema PayPali liivakasti konto. Looge oma konto PayPal Developeris. Pärast konto loomist minge vasakpoolsest menüüst jaotisse SANDBOX-> Kontod ja looge ärikonto.
Selle artikli kirjutamise ajal on PayPal Payments Pro saadaval USA-s, Suurbritannias ja Kanadas. See tähendab, et konto loomisel peate valima ühe neist riikidest.
Kui teil on ettevõttekonto, peate oma konto tüübi täiendama versioonile Business-Pro. Krediitkaardimaksete vastuvõtmiseks peab teie konto tüüp olema „Business-Pro". Selle täiendamiseks klõpsake lingil „Uuenda Pro-le” ja PayPal teisendab teie konto tüübi „Business-Pro” -ks.
Seejärel klõpsake vahekaardil „API mandaadid” ja haarake oma mandaat. Vajame neid volitusi selle õpetuse järgmises osas.
Kohandatav maksevorm
Nagu ma ütlesin, saate PayPal Payments Pro abil kujundada oma maksevormi. Loome kena kassavormi, kuhu klient sisestab oma makseandmed. Selle õpetuse jaoks kasutan koodepeni kenasti kujundusvormi .
Lõplik kaustade struktuur peaks olema järgmine:
Ära mõtle vendor, charge.php, composer.json, composer.locknüüd. Me loome selle hilisemas osas.
Looge css/card.cssfail ja lisage sinna allolev kood, nagu koodenõelal ette nähtud.
@import url(https://fonts.googleapis.com/css?family=Roboto:400,900,700,500);
body {
padding: 60px 0;
background-color: rgba(178,209,229,0.7);
margin: 0 auto;
width: 600px;
}
.body-text {
padding: 0 20px 30px 20px;
font-family: "Roboto";
font-size: 1em;
color: #333;
text-align: center;
line-height: 1.2em;
}
.form-container {
flex-direction: column;
justify-content: center;
align-items: center;
}
.card-wrapper {
background-color: #6FB7E9;
width: 100%;
display: flex;
}
.personal-information {
background-color: #3C8DC5;
color: #fff;
padding: 1px 0;
text-align: center;
}
h1 {
font-size: 1.3em;
font-family: "Roboto"
}
input {
margin: 1px 0;
padding-left: 3%;
font-size: 14px;
}
input[type="text"]{
display: block;
height: 50px;
width: 97%;
border: none;
}
input[type="email"]{
display: block;
height: 50px;
width: 97%;
border: none;
}
input[type="submit"]{
display: block;
height: 60px;
width: 100%;
border: none;
background-color: #3C8DC5;
color: #fff;
margin-top: 2px;
curson: pointer;
font-size: 0.9em;
text-transform: uppercase;
font-weight: bold;
cursor: pointer;
}
input[type="submit"]:hover{
background-color: #6FB7E9;
transition: 0.3s ease;
}
#column-left {
width: 46.5%;
float: left;
margin-bottom: 2px;
}
#column-right {
width: 46.5%;
float: right;
}
@media only screen and (max-width: 480px){
body {
width: 100%;
margin: 0 auto;
}
.form-container {
margin: 0 2%;
}
input {
font-size: 1em;
}
#input-button {
width: 100%;
}
#input-field {
width: 96.5%;
}
h1 {
font-size: 1.2em;
}
input {
margin: 2px 0;
}
input[type="submit"]{
height: 50px;
}
#column-left {
width: 96.5%;
display: block;
float: none;
}
#column-right {
width: 96.5%;
display: block;
float: none;
}
}Samamoodi on meie js/card.jsfailil järgmine kood.
/* Card.js plugin by Jesse Pollak. https://github.com/jessepollak/card */
$('form').card({
container: '.card-wrapper',
width: 280,
formSelectors: {
nameInput: 'input[name="first-name"], input[name="last-name"]'
}
});Hankige jquery.card.jssellest GitHubi hoidlast koopia. Salvestage see fail kataloogi ‘js’.
Nüüd looge index.htmlfail. Sellesse faili lisame HTML-i märgistuse, mis kuvab meie kassavormi.
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Online Payments</title>
<link rel="stylesheet" href="css/card.css">
</head>
<body>
<form method="POST" action="charge.php">
<div class="form-container">
<div class="personal-information">
<h1>Payment Information</h1>
</div> <!-- end of personal-information -->
<input id="column-left" type="text" name="first-name" placeholder="First Name" required="required" />
<input id="column-right" type="text" name="last-name" placeholder="Surname" required="required" />
<input id="input-field" type="text" name="number" placeholder="Card Number" required="required" />
<input id="column-left" type="text" name="expiry" placeholder="MM / YY" required="required" />
<input id="column-right" type="text" name="cvc" placeholder="CCV" required="required" />
<div class="card-wrapper"></div>
<input id="input-field" type="text" name="streetaddress" required="required" autocomplete="on" maxlength="45" placeholder="Streed Address"/>
<input id="column-left" type="text" name="city" required="required" autocomplete="on" maxlength="20" placeholder="City"/>
<input id="column-right" type="text" name="zipcode" required="required" autocomplete="on" pattern="[0-9]*" maxlength="5" placeholder="ZIP code"/>
<input id="input-field" type="email" name="email" required="required" autocomplete="on" maxlength="40" placeholder="Email"/>
<input id="input-field" type="text" name="amount" required="required" autocomplete="on" maxlength="40" placeholder="Amount"/>
<input id="input-button" name="submit" type="submit" value="Submit"/>
</div>
</form>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.6.0/jquery.min.js"></script>
<script src="js/jquery.card.js"></script>
<script src="js/card.js"></script>
</body>
</html>Minge brauserisse ja käivitage index.htmlfail. Nüüd peaksite nägema kena välimusega kassavormi.
Aktsepteerige krediitkaardimakseid PayPal Payments Pro abil
Olete nüüd valmis oma PayPal API mandaatide ja HTML-vormiga. On aeg muuta asjad dünaamiliseks. Maksevärava integreerimine pole üldse lihtne ülesanne. Peate seda uurima ja lugema kogu hankija pakutavat dokumentatsiooni. Mõnikord muutub see nii segaseks ja hoolimata pikkade tundide panemisest ei õnnestunud teil eesmärki saavutada. Olin sellega palju kordi silmitsi seisnud. Ja mis puudutab PayPali, siis olukord muutub PayPali tohutu dokumentatsiooni tõttu keerulisemaks.
See pole enam nii. Omnipay muudab meie arendaja elu maksevärava integreerimise osas lihtsaks. Selle teegi abil ei pea te makseviisi dokumentatsiooni lugema. Hankige lihtsalt oma API mandaadid, järgige Omnipay juhiseid ja olete valmis. Lisateavet leiate nende GitHubi lehelt.
Omnipay ja toetatud PayPali teegi installimiseks käivitage järgmine käsk.
composer require league/omnipay:^3 omnipay/paypalPärast ülaltoodud teekide installimist läheb allpool kood charge.phpfaili sisse.
<?php
require_once "vendor/autoload.php";
use OmnipayOmnipay;
$gateway = Omnipay::create('PayPal_Pro');
$gateway->setUsername(PAYPAL_API_USERNAME);
$gateway->setPassword(PAYPAL_API_PASSWORD);
$gateway->setSignature(PAYPAL_API_SIGNATURE);
$gateway->setTestMode(true); // here 'true' is for sandbox. Pass 'false' when go live
if (isset($_POST['submit'])) {
$arr_expiry = explode("/", $_POST['expiry']);
$formData = array(
'firstName' => $_POST['first-name'],
'lastName' => $_POST['last-name'],
'number' => $_POST['number'],
'expiryMonth' => trim($arr_expiry[0]),
'expiryYear' => trim($arr_expiry[1]),
'cvv' => $_POST['cvc']
);
try {
// Send purchase request
$response = $gateway->purchase([
'amount' => $_POST['amount'],
'currency' => 'USD',
'card' => $formData
])->send();
// Process response
if ($response->isSuccessful()) {
// Payment was successful
echo "Payment is successful. Your Transaction ID is: ". $response->getTransactionReference();
} else {
// Payment failed
echo "Payment failed. ". $response->getMessage();
}
} catch(Exception $e) {
echo $e->getMessage();
}
}Asendage kindlasti kohatäite PAYPAL_API_USERNAME, PAYPAL_API_PASSWORD, PAYPAL_API_SIGNATURE tegelike väärtustega. Nüüd minge oma brauserisse ja proovige maksta näiv krediitkaardi andmetega. Peaksite saama eduteate koos oma tehingu ID-ga. Kasutaja saab test krediitkaardid, mida PayPal.
Aktsepteerige reaalajas makse PayPal Pro makseviisiga
Kui olete liivakasti testimise lõpetanud, edastage koodis kasutatud kohahoidjate reaalajas mandaadid. Samuti peate setTestMode()meetodile edastama väärväärtuse.
See kõik käib krediitkaardimaksete vastuvõtmise kohta PHP-s PayPal Payments Pro abil. Loodan, et see aitab teil oma veebisaidi makselahendust integreerida. Proovige seda õpetust ja andke mulle oma mõtted ja soovitused teada allpool olevast kommentaaride jaotisest.