## Understanding the data flow and logic

In our [last blog](https://www.ranuvijay.me/blogs/topics/stripe-payment-integration-with-django-and-react-js), we have seen how to initiate a payment and know the confirmation status.

This process can not be 100% truested because it is the frontend part, the url params which let us know about the status, and it url params can be maliciously changed in circumstances.

**Webhook**, we can think of this as an event fron stripe which let us know the payment complition status. I will explain it in detail here, it is the server which recieve a notification that payment is successfully completed.

### Complete payment process is -

- User initiate a payment from react app
- We create a checkout session in our django app
- A temporary checkout url is generated and user in our react app is routed to the url, this url is a stripe default checkout page
- User fill the form and details and see the status of payment ( frontend status )
- Stripe send a events to our server about the successul complition status of payment ( backend confirmation ), we call it webhook
- We then notify the user that the payment is successful, the product is purchased or anything similar.

### Let us now see how to setup webhook

The first step is to [install stripe cli](https://stripe.com/docs/payments/checkout/fulfill-orders#install-stripe-cli), installation is based on the type of os you are using, once the installation is done, we can run the command  
```
stripe status 
```
to check the status, it should output **All services are online**

If you remember from my [second blog](https://www.ranuvijay.me/blogs/django-models-and-backend-settings-for-stripe-integration) on this topic that we created **three variables** in our **settings.py** file and left **STRIPE_WEBHOOK_KEY** as blank.

The second step is to generate this key with the help of stripe cli which we installed above, but generating this key would need a django view which listen to webhook event and so also need a url for this view.

So befor generating this key let us see how to  write a view that listen to webhook, map this view to a url and then create STRIPE_WEBHOOK_KEY with the help of url.

If you remember I created a CheckoutSession view in [third blog](https://www.ranuvijay.me/blogs/define-django-views-and-create-stripe-checkout-session) of this [topic](https://www.ranuvijay.me/blogs/topics/stripe-payment-integration-with-django-and-react-js) and in the same view.py file we will create our webhook view.

```
import stripe

@csrf_exempt
def stripe_webhook_view(request):
  payload = request.body
  sig_header = request.META['HTTP_STRIPE_SIGNATURE']
  event = None
    
  try:
    
    event = stripe.Webhook.construct_event(
        payload, sig_header, settings.STRIPE_WEBHOOK_KEY
    )
    
    except ValueError as e:
      # Invalid payload
      return HttpResponse(status=400)
      
    except stripe.error.SignatureVerificationError as e:    
      # Invalid signature      
      return HttpResponse(status=400)
      
      # Handle the checkout.session.completed event
      
    if event['type'] == 'checkout.session.completed':
    
      # Retrieve the session. expand line_items to require line items in the response.
      
      session = stripe.checkout.Session.retrieve(
        event['data']['object']['id'],
        expand=['line_items'],
      )

      print("session")
      print(session.metadata.objId)

      orderInstance = OrderBeforConfirmation.objects.get(id=session.metadata.objId)

      # create final order confirmation
      OrderAfterWebhooksConfirmation.objects.create(order = orderDetailInstance)
        
      # at last send emails to buyer and product owner
      # send_email(data)
      
      # grant persmissions which were waiting purchase confirmation
      # grant_permission(data)
      
      print('everything working')

      return HttpResponse(status=200)
```

#### Let us understand the view which we just created - 
- I have used **csrf_exempt** for my this particular view, I will let you to identify why? if not you can write it to me and I will explain.
- If you remember I passed  **OrderBeforConfirmation** instance as **metadata** in my **CheckoutSession** view in [third blog](https://www.ranuvijay.me/blogs/define-django-views-and-create-stripe-checkout-session) of this [topic](https://www.ranuvijay.me/blogs/topics/stripe-payment-integration-with-django-and-react-js) and the reason is - I wanted to track the webhook, like the way I did in the above code. This let us know the order for which we recieve this webhook event.
- Once we recieve the **objId** as metadata we can search our django app to find the product detail, order detail beased on the id returned.
- At last we can perform the desired activity, such as send email to  purchaser or allow access or give permissions which were awaiting purchase confirmation.

We can then create the url for this view - 

import the view - 

```
from .views import stripe_webhook_view
```
create the path -

```
path('stripe-webhook', stripe_webhook_view, name='webhook-stripee')
```

We can then generate the **STRIPE_WEBHOOK_KEY** by running command 


```
stripe listen --forward-to localhost:8000/appname/stripe-webhook
```
Do confirm the url is correct, I have added the appname just in case if you use a django app for checkout.
![stripewebhook.png](https://api.ranuvijay.me/uploads/stripewebhook_28735f8137.png)

THe signing secret is our STRIPE_WEBHOOK_KEY, we can copy it from here and update our settings.py file.

This is all about **Stripe Webhook** implementaion.

Find [other blogs](https://www.ranuvijay.me/blogs/topics/stripe-payment-integration-with-django-and-react-js) to complete the stripe integration

Find other blogs on [django](https://www.ranuvijay.me/blogs/categories/django)

Find other [topics](https://www.ranuvijay.me/blogs#topics) and [technical Solutions](https://www.ranuvijay.me/blogs#topics)

Find blogs on [other categories](https://www.ranuvijay.me/blogs#categories) here.

**Thank You !!**

We will see how to set up the stripe webhook to know the status of the checkout payment. We can say it is the confirmation from the stripe that payment was successfully completed.

Stripe webhook confirmation in react.js and django app

Contact Me

I want to hear from you