Esta guía le mostrará como integrar el Stripe Payment API con su existencia CodeIgniter sitio web. La estructura Model-View-Controller de CodeIgniter y el Query Builder Class hacen esta integración bastante sencillo. Además, si usted está acostumbrado al trabajando con API’s, esta integración debería ser bastante simple para usted.
Recomendaría que use Stripe Checkout o librería Elements de JavaScript aceptar detalles de pago de cliente. Si usted no lo usa, usted no será capaz de aprovechar de tokenization del lado cliente que ellos ofrecen. En esta guía, cubriré una puesta en práctica de Elements porque está más complicado.
La Descripción General
La belleza de Stripe consiste en como esto toma los detalles de pago del cliente sin ello alguna vez el toque del servidor de su sitio. Esto no quiere decir ningún PCI Compliance y menos dolores de cabeza para usted. Aquí está una descripción del proceso que estableceremos:
- El usuario entra en su información de tarjeta de crédito en la forma de pago y hace clic en el botón someter. Stripe.js toma la tarjeta de crédito detalla y les envía a la Stripe.
- Stripe almacena los detalles en su base de datos y le devuelve un token asociada.
- Usted puede usar esta token para actuar recíprocamente con el API de Stripe de parte de este cliente para solo un empleo.
- La acción de forma que usted especifica en la forma que el usuario se llena consiste en donde esta token es enviada via petición HTTP POST. La acción de forma es su método de hacer pago.
- En su método de hacer pago, usted creará un objeto Customer con el token. Esta objecto Customer será enviado a Stripe y usted almacenará el ID del objecto Customer en su base de datos.
- De aquí, usted puede crear un objeto Charge que usa al ID del Custumer y esto cobrará al cliente.
Trabajo de interfaz
Añada Checkout.js o Elements a la interfaz
A causa de es sencillo a implementar Checkout.js, Mostraré que usted como crear un forma de pago a media con Elementos. Elements es incluido en Stripe.js. Primero, añada Stripe.js a su página y cree una forma. Usted puede añadir campos y estilos CSS mas tarde, pero, aquí está algún código de HTML básico para una forma de pago:
<form action="<?php echo base_url() ?>/payment/charge" method="post" id="payment-form">
<div class="form-row">
<label for="card-element">
Credit or debit card
</label>
<div id="card-element"><
<!-- Stripe Element será insertado aquí. -->
</div>
<div id="card-expiry-element" class="field">
<!-- Stripe Element será insertado aquí. -->
</div>
<div id="card-cvc-element" class="field">
<!-- A Stripe Element será insertado aquí. -->
</div>
<!-- Usado mostrar errores. -->
<div id="card-errors" role="alert"></div>
</div>
<button>Submit Payment</button>
</form>
<script src="https://js.stripe.com/v3/"></script>Es importante notar que el Stripe recomienda los desarrolladores pongan Stripe.js en cada página con el sitio y no solamente la página que contiene la forma de pago. Esto es un modo que Stripe trabaja para reducir el fraude. Tambien asegúrese que usted siempre carga Stripe.js del servidor del Stripe y no su propio.
Recoja la información de tarjeta
Ahora estamos listos a recoger la información de pago el usuario entrado y usar Stripe.js para enviarlo a Stripe. Cree un archivo llamó payment.js y añadirlo a su página. Ahora cree una instancia de Stripe con su llave publishable. Asegúrese para comenzar con su llave prueba publishable. Entonces llame elements() en aquel instancia para ser comenzado.
var stripe = Stripe('publishable_key');
var elements = stripe.elements();
Es hora de establecer los campos de entrada de nuestra forma. Note como los estilos y placeholder son añadidos debajo. Usted debe añadir estas cosas que usan Stripe.js funciones. El patrón es crear el elemento y luego montarlo al elemento de forma existente por ID. Debajo de esto, añadiremos a un EventListener al elemento de entrada de número de tarjeta. Esto mostrará cualquier error Stripe.js hallazgos en el número de tarjeta mientras el usuario escribe a máquina. Los errores mostrarán en el elemento id=”card-errors”.
// Añada estilos y placeholder
var style = {
base: {
iconColor: '#666EE8',
color: '#31325F',
fontSize: '16px',
'::placeholder': {
color: '#CFD7E0',
},
},
};
// Crea un instancia del Card Element
var cardNumberElement = elements.create('cardNumber', {
style: style
});
cardNumberElement.mount('#card-number-element');
// Crea un instancia del Card Expiry Element
var cardExpiryElement = elements.create('cardExpiry', {
style: style
});
cardExpiryElement.mount('#card-expiry-element');
// Crea un instancia del Card CVC Element
var cardCvcElement = elements.create('cardCvc', {
style: style
});
cardCvcElement.mount('#card-cvc-element');
// Compruebe para errores
cardNumberElement.addEventListener('change', function(event) {
var displayError = document.getElementById('card-errors');
if (event.error) {
displayError.textContent = event.error.message;
} else {
displayError.textContent = '';
}
});Crea un token and enviar
Tenemos que convertir los detalles de pago en una token. Esto es el 100 % copiado desde la documentación. Usted probablemente no tendrá que cambiarlo aún para una forma de pago a medida. Esto tokenizes los detalles de pago, envía los detalles a Stripe, y envía el token a su servidor por sometiendo la forma.
// Crea un token o mostra un error cuando
// la forma está sometida.
var form = document.getElementById('payment-form');
form.addEventListener('submit', function(event) {
event.preventDefault();
stripe.createToken(cardNumberElement).then(function(result) {
if (result.error) {
// Informe al usuario si hubiera un error
var errorElement = document.getElementById('card-errors');
errorElement.textContent = result.error.message;
} else {
// Envíe el token a su servidor
stripeTokenHandler(result.token);
}
});
});
function stripeTokenHandler(token) {
// Inserte la token ID en la forma para que es sometido al servidor
var form = document.getElementById('payment-form');
var hiddenInput = document.createElement('input');
hiddenInput.setAttribute('type', 'hidden');
hiddenInput.setAttribute('name', 'stripeToken');
hiddenInput.setAttribute('value', token.id);
form.appendChild(hiddenInput);
// Someta la forma
form.submit();
}En el atributo de acción de forma, ponemos “/payment/charge”. Esto llama el método de Charge del controlador de Pago. Crearemos esto después del cuidado de nuestras dependencias y llaves API.
Trabajo del lado del servidor
Añada librería PHP de Stripe
Antes de que nosotros podamos comenzar el trabajo de lado del servidor, necesitaremos una librería para crear objetos Customer y objetos de Charge. Recomendaría que use librería PHP de Stripe y maneje la dependencia con Composer.
Hace llaves publishable y secreta disponibles
Primero, usted tendrá que acercarse a su cuenta de Stripe. Seleccione el artículo de menú API a la izquierda y copie las llaves secreta y publishable. Asegúrese que usted tiene seleccionado “Test Data ” en el fondo del menú izquierdo.
Hay varios modos de hacer estos disponibles. Un camino es de añadirlos a su controlador o una clase su controlador hereda y tener acceso a ellos estáticamente. Solamente asegúrese que ellos están disponibles a cualquier controlador que los necesita. Para hacer esto, añada sus llaves secreta y publishable en una serie pública estática.
// Llaves de comprobar de Stripe
public static $stripe = array(
"secret_key" => "sk_test_xxxxxxxxxxxxxxxxxxxxxxxx",
"publishable_key" => "pk_test_xxxxxxxxxxxxxxxxxxxxxxxx"
);MY_Controller::$stripe['secret_key'];
MY_Controller::$stripe['publishable_key'];Crea una controlador de pago y un método de hacer pago
Crea un controlador llamado Payment.php. Primero, usted tendrá que definir el método charge(). Esta función recibirá el token de un sólo uso que Stripe crea para este pago. No olvide de establecer sus Plans y Prices en su Stripe Dashboard. Usted necesitará aquellos detalles para procesar el pago.
Recomendaría que usted requiera que usuarios se registren para una cuenta con su sitio si usted no hace esto ya. Esto le permitirá para asociar a un ID de usuario de su sitio a un ID de Customer Stripe.
/* Hacer pago. Esto recibe un token, 'stripeToken',
* trabajar con la información del Customer.
*/
public function charge() {
$this->load->model('Model_payment');
$user_email = get_user_email();
get_user_id() = get_user_id();
$customer_id;
$trial_used = false;
// Compruebe si ellos son ya un Customer. Si no, cree a un nuevo Customer.
if($this->Model_payment->get_subscriber_by_id(get_user_id()) == false) {
\Stripe\Stripe::setApiKey(MY_Controller::$stripe['secret_key']);
// Crea un Customer 'source' de pago
$customer = \Stripe\Customer::create(array(
'email' => $user_email,
// Consiga la token de pago ID sometido por la forma:
'source' => $_POST['stripeToken']
));
$customer_id =$customer['id'];
// Guarda el ID de Customer Stripe a nuestra base de datos
$this->Model_payment->create_stripe_customer($customer['id'], get_user_id());
}
// Añada la lógica para escoger el Plan y la cantidad para cobrar para ello.
$plan = 'starter';
$amount = 10000;
// Añada el Plan al Customer (suscriba al Customer)
\Stripe\Subscription::create(array(
"customer" => $customer_id,
"items" => array(
array(
"plan" => $plan,
),
),
));
// Cobra el tarjeta del Customer
$charge = \Stripe\Charge::create(array(
"amount" => $amount,
"currency" => "usd",
"description" => "Monthly Subscription",
"receipt_email" => $user_email,
"customer" => $customer_id,
));
// Compruebe si la carga tenido éxito o fracasado
if ($charge['status'] == 'succeeded') {
$this->Model_payment->update_subscriber(get_user_id(), 'active');
// Muestre mensaje de éxito
} else {
// Muestre mensaje de fracasado
}
}Crea una Model de pago para actuar recíprocamente con la base de datos
Esto es un Model bastante simple. Esto tendrá que crear y actualizar a los Customers Stripe, comprobará el estado de la suscripción, y conseguirá el ID de Customer Stripe por el ID de usuario de su sitio. No mostraré las funciones de acceso de datos porque ellas son funciones de acceso de datos estándar CodeIgniter.
Crea una tabla de base de datos para almacenar los Subscriptions
Al menos, usted tendrá que almacenar el ID de Customer Stripe en una tabla con el ID de usuario que su aplicación dio al usuario cuando ellos crearon una cuenta.
Ahora sus usuarios deberían ser capaces de entrar en su información de pago y matricularse para una suscripción que usa su forma de pago. Si usted tiene problemas, no dude en consultar la documentación de Stripe. Usted también puede dejar un comentario debajo. Cuando todo trabaja, simplemente cambiar referencias a las llaves de prueba, y añadir sus Plans y precios a el Stripe Dashboard.