I lettori scelgono una delle opzioni di cui sopra, ma se vogliono optare per PayPal, continua a leggere. In questo articolo, ti mostro come accettare pagamenti con carta di credito utilizzando PayPal Payments Pro.<\/p>\n
PayPal Payments Pro accetta pagamenti con una soluzione completamente personalizzabile. Significa che puoi creare il tuo modulo di pagamento e addebitare il tuo cliente. Non ti reindirizza al sito web di PayPal per completare la transazione.<\/p>\n
Creeremo anche il nostro modulo in cui un cliente inserisce i dettagli della sua carta e pu\u00f2 pagare senza uscire dal sito web. L’utente pu\u00f2 progettare la propria pagina di pagamento e consente all’utente di inserire i dettagli della carta. Quindi, senza ulteriori indugi, tuffiamoci.<\/p>\n
Iniziare<\/h3>\n
Prima di accettare pagamenti in tempo reale \u00e8 sempre consigliabile testarlo prima in modalit\u00e0 sandbox. Se tutto funziona come previsto sulla sandbox, dovremmo renderlo attivo per evitare problemi con i pagamenti dei clienti. Per testare i pagamenti, devi disporre di un account sandbox PayPal. Crea il tuo account su PayPal Developer<\/a>. Dopo aver creato un account, vai su SANDBOX->Account<\/strong> dal menu a sinistra e crea un account aziendale.<\/p>\n Al momento della stesura di questo articolo, PayPal Payments Pro \u00e8 disponibile negli Stati Uniti, nel Regno Unito e in Canada. Significa che durante la creazione di un account devi selezionare uno di questi paesi.<\/p>\n Una volta che hai un account aziendale, devi aggiornare il tuo tipo di account a "Business-Pro". Devi avere il tipo di account "Business-Pro" per accettare pagamenti con carta di credito. Per aggiornarlo, fai clic sul link "Aggiorna a Pro" e PayPal convertir\u00e0 il tuo tipo di conto in "Business-Pro".<\/p>\n Quindi, fai clic sulla scheda "Credenziali API" e prendi le tue credenziali. Avremo bisogno di queste credenziali nella parte successiva di questo tutorial.<\/p>\n Come ho detto, utilizzando PayPal Payments Pro puoi progettare il tuo modulo di pagamento. Creiamo un bel modulo di pagamento in cui il cliente inserisce i dettagli del pagamento. User\u00f2<\/a> un modulo ben progettato su codepen<\/a> per questo tutorial.<\/p>\n La struttura della cartella finale dovrebbe essere la seguente:<\/p>\n Non pensare a Crea un Allo stesso modo, il nostro Ottieni una copia di Ora, crea un Vai al browser ed esegui il Ora sei pronto con le tue credenziali API PayPal e il modulo HTML. \u00c8 tempo di rendere le cose dinamiche. L’integrazione di un gateway di pagamento non \u00e8 un compito facile. \u00c8 necessario ricercarlo e leggere l’intera documentazione fornita dal venditore. A volte diventa cos\u00ec confuso e nonostante le lunghe ore, non sei riuscito a raggiungere il tuo obiettivo. L’avevo affrontato molte volte. E quando si tratta di PayPal, la situazione diventa pi\u00f9 complessa a causa della vasta documentazione di PayPal.<\/p>\n Questo non \u00e8 pi\u00f9 il caso. Omnipay semplifica<\/a> la vita dei nostri sviluppatori in termini di integrazione del gateway di pagamento. Utilizzando questa libreria, non \u00e8 necessario leggere la documentazione del gateway di pagamento. Ottieni le tue credenziali API, segui le istruzioni Omnipay e il gioco \u00e8 fatto. Dai un’occhiata alla loro pagina GitHub<\/a> per maggiori dettagli.<\/p>\n Esegui il comando seguente per installare Omnipay e la libreria PayPal supportata.<\/p>\n Dopo aver installato le librerie sopra, il codice sottostante andr\u00e0 all’interno del tuo Assicurati di sostituire PAYPAL_API_USERNAME, PAYPAL_API_PASSWORD, PAYPAL_API_SIGNATURE del segnaposto con i valori effettivi. Ora vai sul tuo browser e prova a effettuare un pagamento con i dati fittizi della carta di credito. Dovresti ricevere un messaggio di successo insieme all’ID della transazione. L’utente pu\u00f2 ottenere carte di credito di prova<\/a> fornite da PayPal.<\/p>\n Una volta completato il test della sandbox, passa le credenziali live per i segnaposto utilizzati in un codice. Devi anche passare il valore ‘false’ al Si tratta di accettare pagamenti con carta di credito utilizzando PayPal Payments Pro in PHP. Spero che ti aiuter\u00e0 a integrare una soluzione di pagamento per il tuo sito web. Prova questo tutorial e fammi sapere i tuoi pensieri e suggerimenti nella sezione commenti qui sotto.<\/p>\n![\"Accetta](\"https:\/\/themewp.inform.click\/wp-content\/uploads\/2021\/04\/post-20129-6081c034cf341.png\")
<\/a><\/p>\n![\"Accetta](\"https:\/\/themewp.inform.click\/wp-content\/uploads\/2021\/04\/post-20129-6081c0355f78e.png\")
<\/a><\/p>\nModulo di pagamento personalizzabile<\/h3>\n
<\/a><\/p>\nvendor<\/code>, charge.php<\/code>, composer.json<\/code>, composer.lock<\/code>per ora. Lo creeremo nella parte successiva.<\/p>\ncss\/card.css<\/code>file e aggiungi il codice sottostante come fornito su codepen<\/a>.<\/p>\n@import url(https:\/\/fonts.googleapis.com\/css?family=Roboto:400,900,700,500);\n\u00a0\nbody {\n\u00a0\u00a0padding: 60px 0;\n\u00a0\u00a0background-color: rgba(178,209,229,0.7);\n\u00a0\u00a0margin: 0 auto;\n\u00a0\u00a0width: 600px;\n}\n.body-text {\n\u00a0\u00a0padding: 0 20px 30px 20px;\n\u00a0\u00a0font-family: \"Roboto\";\n\u00a0\u00a0font-size: 1em;\n\u00a0\u00a0color: #333;\n\u00a0\u00a0text-align: center;\n\u00a0\u00a0line-height: 1.2em;\n}\n.form-container {\n\u00a0\u00a0flex-direction: column;\n\u00a0\u00a0justify-content: center;\n\u00a0\u00a0align-items: center;\n}\n.card-wrapper {\n\u00a0\u00a0background-color: #6FB7E9;\n\u00a0\u00a0width: 100%;\n\u00a0\u00a0display: flex;\n\u00a0\n}\n.personal-information {\n\u00a0\u00a0background-color: #3C8DC5;\n\u00a0\u00a0color: #fff;\n\u00a0\u00a0padding: 1px 0;\n\u00a0\u00a0text-align: center;\n}\nh1 {\n\u00a0\u00a0font-size: 1.3em;\n\u00a0\u00a0font-family: \"Roboto\"\n}\ninput {\n\u00a0\u00a0margin: 1px 0;\n\u00a0\u00a0padding-left: 3%;\n\u00a0\u00a0font-size: 14px;\n}\ninput[type=\"text\"]{\n\u00a0\u00a0display: block;\n\u00a0\u00a0height: 50px;\n\u00a0\u00a0width: 97%;\n\u00a0\u00a0border: none;\n}\ninput[type=\"email\"]{\n\u00a0\u00a0display: block;\n\u00a0\u00a0height: 50px;\n\u00a0\u00a0width: 97%;\n\u00a0\u00a0border: none;\n}\ninput[type=\"submit\"]{\n\u00a0\u00a0display: block;\n\u00a0\u00a0height: 60px;\n\u00a0\u00a0width: 100%;\n\u00a0\u00a0border: none;\n\u00a0\u00a0background-color: #3C8DC5;\n\u00a0\u00a0color: #fff;\n\u00a0\u00a0margin-top: 2px;\n\u00a0\u00a0curson: pointer;\n\u00a0\u00a0font-size: 0.9em;\n\u00a0\u00a0text-transform: uppercase;\n\u00a0\u00a0font-weight: bold;\n\u00a0\u00a0cursor: pointer;\n}\ninput[type=\"submit\"]:hover{\n\u00a0\u00a0background-color: #6FB7E9;\n\u00a0\u00a0transition: 0.3s ease;\n}\n#column-left {\n\u00a0\u00a0width: 46.5%;\n\u00a0\u00a0float: left;\n\u00a0\u00a0margin-bottom: 2px;\n}\n#column-right {\n\u00a0\u00a0width: 46.5%;\n\u00a0\u00a0float: right;\n}\n\u00a0\n@media only screen and (max-width: 480px){\n\u00a0\u00a0body {\n\u00a0\u00a0\u00a0\u00a0width: 100%;\n\u00a0\u00a0\u00a0\u00a0margin: 0 auto;\n\u00a0\u00a0}\n\u00a0\u00a0.form-container {\n\u00a0\u00a0\u00a0\u00a0margin: 0 2%;\n\u00a0\u00a0}\n\u00a0\u00a0input {\n\u00a0\u00a0\u00a0\u00a0font-size: 1em;\n\u00a0\u00a0}\n\u00a0\u00a0#input-button {\n\u00a0\u00a0\u00a0\u00a0width: 100%;\n\u00a0\u00a0}\n\u00a0\u00a0#input-field {\n\u00a0\u00a0\u00a0\u00a0width: 96.5%;\n\u00a0\u00a0}\n\u00a0\u00a0h1 {\n\u00a0\u00a0\u00a0\u00a0font-size: 1.2em;\n\u00a0\u00a0}\n\u00a0\u00a0input {\n\u00a0\u00a0\u00a0\u00a0margin: 2px 0;\n\u00a0\u00a0}\n\u00a0\u00a0input[type=\"submit\"]{\n\u00a0\u00a0\u00a0\u00a0height: 50px;\n\u00a0\u00a0}\n\u00a0\u00a0#column-left {\n\u00a0\u00a0\u00a0\u00a0width: 96.5%;\n\u00a0\u00a0\u00a0\u00a0display: block;\n\u00a0\u00a0\u00a0\u00a0float: none;\n\u00a0\u00a0}\n\u00a0\u00a0#column-right {\n\u00a0\u00a0\u00a0\u00a0width: 96.5%;\n\u00a0\u00a0\u00a0\u00a0display: block;\n\u00a0\u00a0\u00a0\u00a0float: none;\n\u00a0\u00a0}\n}<\/code><\/pre>\njs\/card.js<\/code>file avr\u00e0 il seguente codice.<\/p>\n\/* Card.js plugin by Jesse Pollak. https:\/\/github.com\/jessepollak\/card *\/\n\u00a0\n$('form').card({\n\u00a0\u00a0\u00a0\u00a0container: '.card-wrapper',\n\u00a0\u00a0\u00a0\u00a0width: 280,\n\u00a0\n\u00a0\u00a0\u00a0\u00a0formSelectors: {\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0nameInput: 'input[name=\"first-name\"], input[name=\"last-name\"]'\n\u00a0\u00a0\u00a0\u00a0}\n});<\/code><\/pre>\njquery.card.js<\/code>da questo repository GitHub<\/a>. Memorizza questo file nella directory ‘js’.<\/p>\nindex.html<\/code>file. In questo file aggiungeremo il markup HTML che mostra il nostro modulo di checkout.<\/p>\n<!DOCTYPE html>\n<html lang=\"en\">\n<head>\n\u00a0\u00a0\u00a0\u00a0<meta charset=\"UTF-8\">\n\u00a0\u00a0\u00a0\u00a0<meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\">\n\u00a0\u00a0\u00a0\u00a0<meta http-equiv=\"X-UA-Compatible\" content=\"ie=edge\">\n\u00a0\u00a0\u00a0\u00a0<title>Online Payments<\/title>\n\u00a0\u00a0\u00a0\u00a0<link rel=\"stylesheet\" href=\"css\/card.css\">\n<\/head>\n<body>\n\u00a0\u00a0\u00a0\u00a0<form method=\"POST\" action=\"charge.php\">\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0<div class=\"form-container\">\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0<div class=\"personal-information\">\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0<h1>Payment Information<\/h1>\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0<\/div> <!-- end of personal-information -->\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0<input id=\"column-left\" type=\"text\" name=\"first-name\" placeholder=\"First Name\" required=\"required\" \/>\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0<input id=\"column-right\" type=\"text\" name=\"last-name\" placeholder=\"Surname\" required=\"required\" \/>\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0<input id=\"input-field\" type=\"text\" name=\"number\" placeholder=\"Card Number\" required=\"required\" \/>\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0<input id=\"column-left\" type=\"text\" name=\"expiry\" placeholder=\"MM \/ YY\" required=\"required\" \/>\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0<input id=\"column-right\" type=\"text\" name=\"cvc\" placeholder=\"CCV\" required=\"required\" \/>\n\u00a0\u00a0\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0<div class=\"card-wrapper\"><\/div>\n\u00a0\u00a0\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0<input id=\"input-field\" type=\"text\" name=\"streetaddress\" required=\"required\" autocomplete=\"on\" maxlength=\"45\" placeholder=\"Streed Address\"\/>\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0<input id=\"column-left\" type=\"text\" name=\"city\" required=\"required\" autocomplete=\"on\" maxlength=\"20\" placeholder=\"City\"\/>\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0<input id=\"column-right\" type=\"text\" name=\"zipcode\" required=\"required\" autocomplete=\"on\" pattern=\"[0-9]*\" maxlength=\"5\" placeholder=\"ZIP code\"\/>\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0<input id=\"input-field\" type=\"email\" name=\"email\" required=\"required\" autocomplete=\"on\" maxlength=\"40\" placeholder=\"Email\"\/>\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0<input id=\"input-field\" type=\"text\" name=\"amount\" required=\"required\" autocomplete=\"on\" maxlength=\"40\" placeholder=\"Amount\"\/>\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0<input id=\"input-button\" name=\"submit\" type=\"submit\" value=\"Submit\"\/>\n\u00a0\u00a0\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0<\/div>\n\u00a0\u00a0\u00a0\u00a0<\/form>\n\u00a0\u00a0\u00a0\u00a0<script src=\"https:\/\/cdnjs.cloudflare.com\/ajax\/libs\/jquery\/3.6.0\/jquery.min.js\"><\/script>\n\u00a0\u00a0\u00a0\u00a0<script src=\"js\/jquery.card.js\"><\/script>\n\u00a0\u00a0\u00a0\u00a0<script src=\"js\/card.js\"><\/script>\n<\/body>\n<\/html><\/code><\/pre>\nindex.html<\/code>file. Ora dovresti vedere un modulo di pagamento dall’aspetto gradevole.<\/p>\nAccetta pagamenti con carta di credito utilizzando PayPal Payments Pro<\/h3>\n
composer require league\/omnipay:^3 omnipay\/paypal<\/code><\/pre>\ncharge.php<\/code>file.<\/p>\n<?php\nrequire_once \"vendor\/autoload.php\";\n\u00a0\u00a0\nuse OmnipayOmnipay;\n\u00a0\u00a0\n$gateway = Omnipay::create('PayPal_Pro');\n$gateway->setUsername(PAYPAL_API_USERNAME);\n$gateway->setPassword(PAYPAL_API_PASSWORD);\n$gateway->setSignature(PAYPAL_API_SIGNATURE);\n$gateway->setTestMode(true); \/\/ here 'true' is for sandbox. Pass 'false' when go live\n\u00a0\u00a0\nif (isset($_POST['submit'])) {\n\u00a0\u00a0\n\u00a0\u00a0\u00a0\u00a0$arr_expiry = explode(\"\/\", $_POST['expiry']);\n\u00a0\u00a0\n\u00a0\u00a0\u00a0\u00a0$formData = array(\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0'firstName' => $_POST['first-name'],\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0'lastName' => $_POST['last-name'],\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0'number' => $_POST['number'],\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0'expiryMonth' => trim($arr_expiry[0]),\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0'expiryYear' => trim($arr_expiry[1]),\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0'cvv' => $_POST['cvc']\n\u00a0\u00a0\u00a0\u00a0);\n\u00a0\u00a0\n\u00a0\u00a0\u00a0\u00a0try {\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\/\/ Send purchase request\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0$response = $gateway->purchase([\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0'amount' => $_POST['amount'],\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0'currency' => 'USD',\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0'card' => $formData\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0])->send();\n\u00a0\u00a0\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\/\/ Process response\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0if ($response->isSuccessful()) {\n\u00a0\u00a0\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\/\/ Payment was successful\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0echo \"Payment is successful. Your Transaction ID is: \". $response->getTransactionReference();\n\u00a0\u00a0\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0} else {\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\/\/ Payment failed\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0echo \"Payment failed. \". $response->getMessage();\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0}\n\u00a0\u00a0\u00a0\u00a0} catch(Exception $e) {\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0echo $e->getMessage();\n\u00a0\u00a0\u00a0\u00a0}\n}<\/code><\/pre>\nAccetta pagamenti in tempo reale con PayPal Pro Payment Gateway<\/h3>\n
setTestMode()<\/code>metodo.<\/p>\n