# Accepter un paiement PayNow Acceptez des paiements en ligne avec PayNow, un service de transfert de fonds largement répandu à Singapour. # Checkout > This is a Checkout for when payment-ui is checkout. View the full page at https://docs.stripe.com/payments/paynow/accept-a-payment?payment-ui=checkout. > Stripe peut automatiquement proposer les moyens de paiement pertinents à vos clients en évaluant la devise, les restrictions liées aux moyens de paiement et d’autres paramètres. > > - Suivez le guide [Accepter un paiement](https://docs.stripe.com/payments/accept-a-payment.md?payment-ui=checkout&ui=stripe-hosted) pour créer une intégration de paiement qui utilise des [moyens de paiement dynamiques](https://docs.stripe.com/payments/payment-methods/dynamic-payment-methods.md). - Si vous ne souhaitez pas utiliser de moyens de paiement dynamiques, suivez les étapes ci-dessous pour configurer manuellement les moyens de paiement dans votre intégration Checkout. PayNow est un moyen de paiement [à usage unique](https://docs.stripe.com/payments/payment-methods.md#usage). Les clients paient avec PayNow en scannant le code QR qu’ils voient lors du paiement. Une fois le paiement terminé, les clients sont redirigés à nouveau vers votre site Web. Ce guide décrit l’utilisation de Paynow dans votre tunnel de paiement en ligne. Pour les paiements en personne avec Stripe Terminal, consulter la rubrique [ Moyens de paiement supplémentaires](https://docs.stripe.com/terminal/payments/additional-payment-methods.md). ## Déterminer la compatibilité **Lieux d’implantation pris en charge** : SG **Devises prises en charge** : `sgd` **Devises de règlement** : `sgd` **Mode de paiement** : Yes **Mode de configuration** : No **Mode d’abonnement** : No Une session Checkout doit remplir toutes les conditions suivantes pour prendre en charge les paiements PayNow : - Pour tous les postes, les *Prices* (Prices define how much and how often to charge for products. This includes how much the product costs, what currency to use, and the interval if the price is for subscriptions) doivent être exprimés dans la même devise, et doivent être en `sgd`. - Vous ne pouvez utiliser que les postes ponctuels (PayNow. Les sessions Checkout ne prennent pas en charge les plans d’*abonnement* (A Subscription represents the product details associated with the plan that your customer subscribes to. Allows you to charge the customer on a recurring basis) récurrents. ## Accepter un paiement > Ce guide s’appuie sur l’intégration de base Checkout permettant d’[accepter un paiement](https://docs.stripe.com/payments/accept-a-payment.md?integration=checkout). Ce guide vous explique comment activer PayNow et vous montre les différences entre l’acceptation des paiements à l’aide de méthodes de paiement dynamiques et la configuration manuelle des moyens de paiement. ### Activer le moyen de paiement PayNow Lors de la création d’une nouvelle [session Checkout](https://docs.stripe.com/api/checkout/sessions.md), vous devez : 1. Ajouter `paynow` à la liste de `payment_method_types`. 1. Assurez-vous que tous vos postes `line_items` utilisent la même devise. #### Page hébergée par Stripe ```curl curl https://api.stripe.com/v1/checkout/sessions \ -u "<>:" \ -d "line_items[0][price_data][currency]=sgd" \ -d "line_items[0][price_data][product_data][name]=T-shirt" \ -d "line_items[0][price_data][unit_amount]=2000" \ -d "line_items[0][quantity]=1" \ -d mode=payment \ -d "payment_method_types[0]=card" \ -d "payment_method_types[1]=paynow" \ --data-urlencode "success_url=https://example.com/success" ``` #### Formulaire intégré ```curl curl https://api.stripe.com/v1/checkout/sessions \ -u "<>:" \ -d "line_items[0][price_data][currency]=sgd" \ -d "line_items[0][price_data][product_data][name]=T-shirt" \ -d "line_items[0][price_data][unit_amount]=2000" \ -d "line_items[0][quantity]=1" \ -d mode=payment \ -d "payment_method_types[0]=card" \ -d "payment_method_types[1]=paynow" \ --data-urlencode "return_url=https://example.com/return" \ -d ui_mode=embedded_page ``` ### Traiter vos commandes Maintenant que vous savez accepter des paiements, découvrez comment [traiter les commandes](https://docs.stripe.com/checkout/fulfillment.md). ## Tester votre intégration Lors du test de votre intégration Checkout, sélectionnez le moyen de paiement PayNow, puis cliquez sur le bouton **Générer un code QR**, qui produit un code QR. Pendant le test, vous pouvez scanner le QR code à l’aide d’une application de lecture de QR code sur votre appareil mobile. La charge utile du code QR contient une URL qui vous redirige vers une page de paiement de test PayNow hébergée par Stripe, sur laquelle vous pouvez autoriser ou refuser le paiement test. En mode production, vous pouvez scanner le QR code à l’aide de votre application bancaire ou de paiement préférée prenant en charge PayNow. ## See also - [Exécution Checkout](https://docs.stripe.com/checkout/fulfillment.md) - [Personnaliser Checkout](https://docs.stripe.com/payments/checkout/customization.md) # API Direct > This is a API Direct for when payment-ui is direct-api. View the full page at https://docs.stripe.com/payments/paynow/accept-a-payment?payment-ui=direct-api. PayNow est un moyen de paiement [à usage unique](https://docs.stripe.com/payments/payment-methods.md#usage). Le client utilise son application préférée d’une banque participante ou institution financière non bancaire participante pour scanner le code QR qui lui est présenté dans le tunnel de paiement, puis finalise sa commande. Ce guide décrit l’utilisation de Paynow dans votre tunnel de paiement en ligne. Pour les paiements en personne avec Stripe Terminal, consulter la rubrique [ Moyens de paiement supplémentaires](https://docs.stripe.com/terminal/payments/additional-payment-methods.md). ## Configurer Stripe Pour commencer, vous devez [créer un compte](https://dashboard.stripe.com/register) Stripe. Utilisez nos bibliothèques officielles pour accéder à l’API Stripe à partir de votre application : #### Ruby ```bash # Available as a gem sudo gem install stripe ``` ```ruby # If you use bundler, you can add this line to your Gemfile gem 'stripe' ``` ## Créer un PaymentIntent [Côté serveur] Un [PaymentIntent](https://docs.stripe.com/api/payment_intents/object.md) est un objet qui représente votre intention d’encaisser le paiement émis par un client et suit le cycle de vie du processus de paiement étape par étape. Pour commencer, créez un PaymentIntent sur votre serveur et précisez le montant à encaisser ainsi que la devise. Si vous avez déjà créé une intégration à l’aide de l’[API Payment Intents](https://docs.stripe.com/payments/payment-intents.md), ajoutez `paynow` à la liste des [types de moyens de paiement](https://docs.stripe.com/api/payment_intents/create.md#create_payment_intent-payment_method_types) pour votre `PaymentIntent`. ```curl curl https://api.stripe.com/v1/payment_intents \ -u "<>:" \ -d "payment_method_types[]=paynow" \ -d "payment_method_data[type]=paynow" \ -d amount=1099 \ -d currency=sgd ``` ### Récupérer la clé secrète du client Le PaymentIntent contient une *clé secrète* (The client secret is a unique key returned from Stripe as part of a PaymentIntent. This key lets the client access important fields from the PaymentIntent (status, amount, currency) while hiding sensitive ones (metadata, customer)) à utiliser côté client pour finaliser le processus de paiement en toute sécurité. Vous pouvez adopter différentes approches pour transmettre cette clé secrète côté client. #### Application monopage Récupérez la clé secrète du client à partir d’un endpoint sur votre serveur, à l’aide de la fonction `fetch` du navigateur. Cette approche est recommandée si votre côté client est une application d’une seule page, en particulier si elle repose sur un framework front-end moderne tel que React. Créez l’endpoint de serveur qui gère la clé secrète du client : #### Ruby ```ruby get '/secret' do intent = # ... Create or retrieve the PaymentIntent {client_secret: intent.client_secret}.to_json end ``` Récupérez ensuite la clé secrète du client à l’aide JavaScript côté client : ```javascript (async () => { const response = await fetch('/secret'); const {client_secret: clientSecret} = await response.json(); // Render the form using the clientSecret })(); ``` #### Rendu côté serveur Transmettez la clé secrète à votre client depuis votre serveur. Cette approche fonctionne mieux si votre application génère du contenu statique sur le serveur avant de l’envoyer sur le navigateur. Ajoutez le [client_secret](https://docs.stripe.com/api/payment_intents/object.md#payment_intent_object-client_secret) à votre formulaire de paiement. Dans votre code côté serveur, récupérez la clé secrète du client à partir du PaymentIntent : #### Ruby ```erb
``` ```ruby get '/checkout' do @intent = # ... Fetch or create the PaymentIntent erb :checkout end ``` ## Afficher le code QR de PayNow [Côté client] Au cours de cette étape, vous effectuerez les paiements PayNow côté client avec [Stripe.js](https://docs.stripe.com/payments/elements.md). Intégrez le script Stripe.js à votre page de paiement en l’ajoutant entre les balises `head` de votre fichier HTML. #### HTML ```html Checkout ``` Créez une instance de Stripe.js avec le code JavaScript suivant sur votre page de paiement. #### JavaScript ```js // Set your publishable key. Remember to change this to your live publishable key in production. // See your keys here: https://dashboard.stripe.com/apikeys var stripe = Stripe('<>'); ``` Utilisez `stripe.confirmPayNowPayment` pour confirmer le paiement côté client. #### JavaScript ```js var form = document.getElementById('payment-form'); form.addEventListener('submit', function(event) { event.preventDefault(); // Set the clientSecret here you got in Step 2 stripe.confirmPayNowPayment( clientSecret, ).then((res) => { if(res.paymentIntent.status === 'succeeded') { // The user scanned the QR code } else { // The user closed the modal, cancelling payment } }); }); ``` Une fois que vous avez appelé `confirmPayNowPayment`, un code QR s’affiche sur la page web. Vos clients peuvent utiliser ce code QR et authentifier le paiement en utilisant leur application bancaire ou de paiement préférée. Vous devez rester sur la page avec le code QR jusqu’à ce que Stripe [exécute la commande](https://docs.stripe.com/payments/paynow/accept-a-payment.md#fulfill-order) et que vous connaissiez le résultat du paiement. ## Traiter la commande [Côté serveur] Utilisez une méthode telle que les [webhooks](https://docs.stripe.com/payments/payment-intents/verifying-status.md#webhooks) pour gérer la *réalisation* (Fulfillment is the process of providing the goods or services purchased by a customer, typically after payment is collected) de la commande plutôt que d’attendre que votre client revienne sur la page de l’état du paiement. Lorsque votre client effectue le paiement, le `PaymentIntent` bascule sur `succeeded` et déclenche l’événement *webhook* (A webhook is a real-time push notification sent to your application as a JSON payload through HTTPS requests) [payment_intent.succeeded](https://docs.stripe.com/api/events/types.md#event_types-payment_intent.succeeded). ## Tester votre intégration Pendant le test, vous pouvez scanner le QR code à l’aide d’une application de lecture de QR code sur votre appareil mobile. La charge utile du code QR contient une URL qui vous redirige vers une page de paiement de test PayNow hébergée par Stripe, sur laquelle vous pouvez autoriser ou refuser le paiement test. En mode production, vous pouvez scanner le code QR à l’aide de l’application d’une banque participante ou institution financière non bancaire participante.