Vous créez un formulaire HTML standard contenant les détails de paiement. Lorsque le client soumet le formulaire, il sera redirigé vers notre page de paiement où il pourra effectuer le paiement par Mobile Money ou par carte de crédit.
Créez un compte sur la plateforme Qos et obtenez votre QOSKEY en suivant ces quelques étapes : générez un lien de paiement dans la section des liens de paiement, enfin, allez dans les paramètres> Clé API sous la colonne ClientId pour obtenir votre QOSKEY.
Copier Number: 4456530000001096 date: 12/25 CCV: 123
Copier http://74.208.84.251:9014/public/v1/initTransaction En production, vous aurez besoin de votre QosKey dans paramètres > Clé API sous la colonne ClientId et de l'URL de production.
Voici un exemple de mise en œuvre de la caisse HTML (rafraîchissez la page si l'espace d'édition ne s'affiche pas automatiquement)
Copier <!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.0.2/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-EVSTQN3/azprG1Anm3QDgpJLIm9Nao0Yz1ztcQTwFspd3yD65VohhpuuCOmLASjC" crossorigin="anonymous">
<title>Demo Checkout</title>
</head>
<body>
<div class="constainer p-3" >
<h1 class="p-2">Demo Checkout</h1>
<p class="p-2">
Payer 100 FCFA
</p>
<button onclick="sendRequest()" id="payButton " type="button" class="btn btn-primary">Pay Now</button>
</div>
<script>
function sendRequest() {
// initiale body for request ==> m = mandatory = obligatoire
var data = {
"type": "all", // in checkout value is mobile/card/all ==> m
"transref": new Date().getTime(), // transref ===> m et unique
"qosKey": "QCBJ137", // is provided by qos platform ==> m
"returnUrl": "https://www.qosic.com", // is callback redirection with parameter transref ans status ==> m
"amountDetails": {
"totalAmount": 100, // amount wil be pay by customer // ==> m
"currency": "XOF"
},
"saleDetails": {
"firstName": "jac", // m
"lastName": "Djac", // m
"middleName": "KJ",
"nameSuffix": "jac",
"title": "Mr", // m
"address1": "Cotonou", // m
"address2": "Cococodji",
"address4": "string",
"locality": "Litoral", // m
"administrativeArea": "",
"postalCode": "229", // m
"country": "Benin", // m
"district": "Bj", // m
"buildingNumber": "string",
"email": "jacques@qosic.com", // m
"emailDomain": "string",
"phoneNumber": "66895585", // m
"phoneType": "cel" // m
}
}
fetch("https://b-card.qosic.net/public/v1/initTransaction", {
// fetch("http://localhost:9011/public/v1/initTransaction", {
//fetch("https://b-checkout-api.qosic.net/public/v1/initTransaction", {
method: "POST",
headers: { 'Content-Type': 'application/json' },
body: JSON.stringify(data)
})
.then(response => response.json())
.then(res => {console.log(res)
window.location.href = res.url
// console.log("Request complete! response:", res);
});
}
</script>
</body>
</html> 