{"id":28719,"date":"2021-06-17T13:46:00","date_gmt":"2021-06-17T10:46:00","guid":{"rendered":"https:\/\/themewp.inform.click\/?p=28719"},"modified":"2021-10-18T03:59:08","modified_gmt":"2021-10-18T00:59:08","slug":"um-guia-para-integracao-do-stripe-em-sites-com-php","status":"publish","type":"post","link":"https:\/\/themewp.inform.click\/pt-pt\/um-guia-para-integracao-do-stripe-em-sites-com-php\/","title":{"rendered":"Um guia para integra\u00e7\u00e3o do Stripe em sites com PHP"},"content":{"rendered":"

Se voc\u00ea estiver administrando um site e cobrando um pagamento online, provavelmente j\u00e1 ouviu falar do Stripe Payment Gateway<\/strong>. Com o Stripe, pode-se aceitar o pagamento com cart\u00e3o de cr\u00e9dito ou d\u00e9bito. Esta \u00e9 uma maneira mais conveniente de pagar online para seus clientes. Neste artigo, estudamos a integra\u00e7\u00e3o do Stripe ao site com PHP.<\/p>\n

Por que usar o Stripe Payment Gateway?<\/h3>\n

O Stripe<\/a> \u00e9 um dos meios de pagamento mais populares e seguros da Internet. Os detalhes do cart\u00e3o do usu\u00e1rio est\u00e3o sempre seguros com os pagamentos Stripe. Na verdade, no check-out do Stripe, eles fornecem elementos gerados onde um usu\u00e1rio deve inserir os detalhes do cart\u00e3o. Os elementos para inserir os detalhes do cart\u00e3o s\u00e3o gerados pelo Stripe em tempo de execu\u00e7\u00e3o, o que torna este gateway mais seguro.<\/p>\n

Depois de inserir os detalhes do cart\u00e3o, o Stripe gera um token que ser\u00e1 usado para cobrar o pagamento do cart\u00e3o. Como resultado, n\u00e3o h\u00e1 necessidade de armazenar detalhes do cart\u00e3o.<\/p>\n

Dito isso, vamos dar uma olhada na integra\u00e7\u00e3o do Stripe a um site usando PHP.<\/p>\n

Obtenha chaves de API para integra\u00e7\u00e3o com Stripe<\/h3>\n

Para come\u00e7ar, voc\u00ea deve ter uma conta Stripe<\/a>. Para integrar o gateway Stripe em seu aplicativo, voc\u00ea precisa obter sua chave secreta Stripe e sua chave public\u00e1vel.<\/p>\n

Fa\u00e7a login no painel do Stripe. Voc\u00ea obter\u00e1 essas chaves em Desenvolvedores-> Chaves de API<\/strong>. Eu recomendo que voc\u00ea primeiro teste as transa\u00e7\u00f5es de pagamento com o modo de teste. Se tudo funcionar bem, entre no modo ao vivo. Portanto, pegue as chaves de API para o modo de teste.<\/p>\n

\"Um<\/a><\/p>\n

Stripe Checkout Form<\/h3>\n

Sempre que integramos um gateway de pagamento no site, precisamos armazenar os detalhes da transa\u00e7\u00e3o no banco de dados. Portanto, vamos criar uma payments<\/code>tabela usando a consulta SQL abaixo.<\/p>\n

CREATE TABLE `payments` (\u00a0`id` int(11) NOT NULL AUTO_INCREMENT,\n\u00a0`payment_id` varchar(255) NOT NULL,\n\u00a0`amount` float(10,2) NOT NULL,\n\u00a0`currency` varchar(255) NOT NULL,\n\u00a0`payment_status` varchar(255) NOT NULL,\n\u00a0`captured_at` datetime NOT NULL DEFAULT current_timestamp(),\n\u00a0PRIMARY KEY (`id`)) ENGINE=InnoDB DEFAULT CHARSET=latin1;<\/code><\/pre>\n
Em seguida, crie um formul\u00e1rio de checkout. Como mencionei anteriormente, Stripe gera elementos de cart\u00e3o para voc\u00ea. Iremos gerar esses elementos no formul\u00e1rio de checkout seguindo a documenta\u00e7\u00e3o<\/a> do Stripe<\/a>.<\/p>\n
Crie o index.html<\/code>arquivo e coloque o c\u00f3digo abaixo nele.<\/p>\n
<link rel=\"stylesheet\" href=\"style.css\" \/>\n<script src=\"https:\/\/js.stripe.com\/v3\/\"><\/script>\n<form action=\"charge.php\" method=\"post\" id=\"payment-form\">\n\u00a0\u00a0\u00a0\u00a0<div class=\"form-row\">\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0<input type=\"text\" name=\"amount\" placeholder=\"Enter Amount\" \/>\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0<label for=\"card-element\">\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0Credit or debit card\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0<\/label>\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0<div id=\"card-element\">\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0<!-- A Stripe Element will be inserted here. -->\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0<\/div>\n\u00a0\u00a0\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0<!-- Used to display form errors. -->\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0<div id=\"card-errors\" role=\"alert\"><\/div>\n\u00a0\u00a0\u00a0\u00a0<\/div>\n\u00a0\u00a0\u00a0\u00a0<button>Submit Payment<\/button>\n<\/form>\n<script src=\"card.js\"><\/script><\/code><\/pre>\n
Adicione algum estilo ao formul\u00e1rio usando o c\u00f3digo abaixo no style.css<\/code>arquivo.<\/p>\n
.StripeElement {\n\u00a0\u00a0\u00a0\u00a0box-sizing: border-box;\n\u00a0\u00a0\u00a0\u00a0\n\u00a0\u00a0\u00a0\u00a0height: 40px;\n\u00a0\u00a0\u00a0\u00a0\n\u00a0\u00a0\u00a0\u00a0padding: 10px 12px;\n\u00a0\u00a0\u00a0\u00a0\n\u00a0\u00a0\u00a0\u00a0border: 1px solid transparent;\n\u00a0\u00a0\u00a0\u00a0border-radius: 4px;\n\u00a0\u00a0\u00a0\u00a0background-color: white;\n\u00a0\u00a0\u00a0\u00a0\n\u00a0\u00a0\u00a0\u00a0box-shadow: 0 1px 3px 0 #e6ebf1;\n\u00a0\u00a0\u00a0\u00a0-webkit-transition: box-shadow 150ms ease;\n\u00a0\u00a0\u00a0\u00a0transition: box-shadow 150ms ease;\n}\n\u00a0\u00a0\n.StripeElement--focus {\n\u00a0\u00a0\u00a0\u00a0box-shadow: 0 1px 3px 0 #cfd7df;\n}\n\u00a0\u00a0\n.StripeElement--invalid {\n\u00a0\u00a0\u00a0\u00a0border-color: #fa755a;\n}\n\u00a0\u00a0\n.StripeElement--webkit-autofill {\n\u00a0\u00a0\u00a0\u00a0background-color: #fefde5 !important;\n}<\/code><\/pre>\n
Depois disso, para gerar o elemento de cart\u00e3o e stripeToken, voc\u00ea precisa adicionar o seguinte c\u00f3digo JavaScript no card.js<\/code>arquivo. Este c\u00f3digo JavaScript tamb\u00e9m valida os detalhes do cart\u00e3o.<\/p>\n
\/\/ Create a Stripe client.\nvar stripe = Stripe('PUBLISHABLE_KEY');\n\u00a0\u00a0\n\/\/ Create an instance of Elements.\nvar elements = stripe.elements();\n\u00a0\u00a0\n\/\/ Custom styling can be passed to options when creating an Element.\n\/\/ (Note that this demo uses a wider set of styles than the guide below.)\nvar style = {\n\u00a0\u00a0\u00a0\u00a0base: {\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0color: '#32325d',\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0fontFamily: '\"Helvetica Neue\", Helvetica, sans-serif',\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0fontSmoothing: 'antialiased',\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0fontSize: '16px',\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0'::placeholder': {\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0color: '#aab7c4'\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0}\n\u00a0\u00a0\u00a0\u00a0},\n\u00a0\u00a0\u00a0\u00a0invalid: {\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0color: '#fa755a',\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0iconColor: '#fa755a'\n\u00a0\u00a0\u00a0\u00a0}\n};\n\u00a0\u00a0\n\/\/ Create an instance of the card Element.\nvar card = elements.create('card', {style: style});\n\u00a0\u00a0\n\/\/ Add an instance of the card Element into the `card-element` <div>.\ncard.mount('#card-element');\n\u00a0\u00a0\n\/\/ Handle real-time validation errors from the card Element.\ncard.addEventListener('change', function(event) {\n\u00a0\u00a0\u00a0\u00a0var displayError = document.getElementById('card-errors');\n\u00a0\u00a0\u00a0\u00a0if (event.error) {\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0displayError.textContent = event.error.message;\n\u00a0\u00a0\u00a0\u00a0} else {\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0displayError.textContent = '';\n\u00a0\u00a0\u00a0\u00a0}\n});\n\u00a0\u00a0\n\/\/ Handle form submission.\nvar form = document.getElementById('payment-form');\nform.addEventListener('submit', function(event) {\n\u00a0\u00a0\u00a0\u00a0event.preventDefault();\n\u00a0\u00a0\n\u00a0\u00a0\u00a0\u00a0stripe.createToken(card).then(function(result) {\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0if (result.error) {\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\/\/ Inform the user if there was an error.\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0var errorElement = document.getElementById('card-errors');\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0errorElement.textContent = result.error.message;\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0} else {\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\/\/ Send the token to your server.\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0stripeTokenHandler(result.token);\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0}\n\u00a0\u00a0\u00a0\u00a0});\n});\n\u00a0\u00a0\n\/\/ Submit the form with the token ID.\nfunction stripeTokenHandler(token) {\n\u00a0\u00a0\u00a0\u00a0\/\/ Insert the token ID into the form so it gets submitted to the server\n\u00a0\u00a0\u00a0\u00a0var form = document.getElementById('payment-form');\n\u00a0\u00a0\u00a0\u00a0var hiddenInput = document.createElement('input');\n\u00a0\u00a0\u00a0\u00a0hiddenInput.setAttribute('type', 'hidden');\n\u00a0\u00a0\u00a0\u00a0hiddenInput.setAttribute('name', 'stripeToken');\n\u00a0\u00a0\u00a0\u00a0hiddenInput.setAttribute('value', token.id);\n\u00a0\u00a0\u00a0\u00a0form.appendChild(hiddenInput);\n\u00a0\u00a0\n\u00a0\u00a0\u00a0\u00a0\/\/ Submit the form\n\u00a0\u00a0\u00a0\u00a0form.submit();\n}<\/code><\/pre>\n
Voc\u00ea precisa substituir o espa\u00e7o reservado PUBLISHABLE_KEY pela sua chave real no c\u00f3digo acima.<\/p>\n
Eu adicionei um estilo aleat\u00f3rio ao formul\u00e1rio. Voc\u00ea pode ajustar o design do formul\u00e1rio para se adequar ao seu site. Al\u00e9m disso, o Stripe oferece designs diferentes de elementos de cart\u00e3o. Leia mais sobre isso na documenta\u00e7\u00e3o<\/a>.<\/p>\n
Quando o usu\u00e1rio envia um formul\u00e1rio com os detalhes do cart\u00e3o, o Stripe gera um token em segundo plano que ser\u00e1 definido como um campo oculto ‘token’. Este token ser\u00e1 usado para cobrar um pagamento com cart\u00e3o usando Stripe SDK.<\/p>\n
Estamos postando os dados do formul\u00e1rio no charge.php<\/code>. Neste arquivo PHP, faremos a cobran\u00e7a no cart\u00e3o e executaremos o pagamento.<\/p>\n
Integra\u00e7\u00e3o Stripe com Omnipay em PHP<\/h3>\n
Todos n\u00f3s definimos com a configura\u00e7\u00e3o b\u00e1sica. Agora, para cobrar o pagamento com cart\u00e3o, instale a biblioteca Omnipay Stripe<\/a>. Abra o terminal no diret\u00f3rio raiz do seu projeto e execute o comando abaixo:<\/p>\n
composer require league\/omnipay omnipay\/stripe<\/code><\/pre>\n
Ap\u00f3s a instala\u00e7\u00e3o da biblioteca, crie um arquivo config.php e inicialize o objeto de pagamento e a conex\u00e3o com o banco de dados.<\/p>\n
<?php\nrequire_once \"vendor\/autoload.php\";\n\u00a0\u00a0\nuse OmnipayOmnipay;\n\u00a0\u00a0\u00a0\n\/\/ Connect with the database \n$db = new mysqli('MYSQL_HOST', 'MYSQL_DB_USERNAME', 'MYSQL_DB_PASSWORD', 'MYSQL_DB_NAME');\n\u00a0\u00a0\u00a0\u00a0\nif ($db->connect_errno) {\n\u00a0\u00a0\u00a0\u00a0die(\"Connect failed: \". $db->connect_error);\n}\n\u00a0\u00a0\u00a0\n$gateway = Omnipay::create('Stripe');\n$gateway->setApiKey('SECRET_KEY_HERE');<\/code><\/pre>\n
Certifique-se de substituir todos os marcadores de posi\u00e7\u00e3o pelos valores reais. Em seguida, charge.php<\/code>escreva o c\u00f3digo da seguinte maneira.<\/p>\n
<?php\nrequire_once \"config.php\";\n\u00a0\u00a0\u00a0\nif (isset($_POST['stripeToken']) && !empty($_POST['stripeToken'])) {\n\u00a0\u00a0\n\u00a0\u00a0\u00a0\u00a0try {\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0$token = $_POST['stripeToken'];\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\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'amount' => $_POST['amount'],\n\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'token' => $token,\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0])->send();\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0if ($response->isSuccessful()) {\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\/\/ payment was successful: update database\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0$arr_payment_data = $response->getData();\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0$payment_id = $arr_payment_data['id'];\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0$amount = $_POST['amount'];\n\u00a0\u00a0\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\/\/ Insert transaction data into the database\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0$isPaymentExist = $db->query(\"SELECT * FROM payments WHERE payment_id = '\".$payment_id.\"'\");\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0if($isPaymentExist->num_rows == 0) { \n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0$insert = $db->query(\"INSERT INTO payments(payment_id, amount, currency, payment_status) VALUES('$payment_id', '$amount', 'USD', 'Captured')\");\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0}\n\u00a0\u00a0\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0echo \"Payment is successful. Your payment id is: \". $payment_id;\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: display message to customer\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0echo $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>\n
Terminamos com a parte de codifica\u00e7\u00e3o. V\u00e1 em frente e teste os pagamentos do sandbox. O Stripe fornece detalhes do cart\u00e3o fict\u00edcio<\/a> para testar o pagamento.<\/p>\n
Sempre que voc\u00ea decidiu entrar no ar, voc\u00ea s\u00f3 precisa alterar sua chave secreta e public\u00e1vel com as credenciais ao vivo.<\/p>\n
Espero que voc\u00ea possa aprender sobre a integra\u00e7\u00e3o do Stripe em um site com PHP. Eu gostaria de ouvir seus pensamentos e sugest\u00f5es na se\u00e7\u00e3o de coment\u00e1rios abaixo.<\/p>\n
Artigos relacionados<\/h4>\n