How to create a Webhook Endpoint for Stripe with wix-http-functions?

Ask the community
,
1

I’m using this guide: https://stripe.com/docs/payments/checkout/accept-a-payment under

section “6: Confirm the payment is successful” to test webhook from Stripe Dashboard.

This is my code for http-function.js in Wix

import {ok, badRequest, response} from 'wix-http-functions';
import stripe from 'stripe';

const key = require('stripe')('sk_test_XXXXXX'); // Test with your own Stripe secret key 

const endpointSecret = 'whsec_XXXXX'; // Signing secret created by Stripe Dashboard

const app = require('express')();

const bodyParser = require('body-parser');

export function post_checkoutUpdate(request) {
 
    app.post('/webhook', bodyParser.raw({type: 'application/json'}), (request, response) => {
 const sig = request.headers['stripe-signature'];

 let event;

 try {
    event = key.webhooks.constructEvent(request.body, sig, endpointSecret);
  } catch (err) {
 return response.status(400).send(`Webhook Error: ${err.message}`);
  }

 // Handle the checkout.session.completed event
 if (event.type === 'checkout.session.completed') {
 const session = event.data.object;

 // Fulfill the purchase...
 //handleCheckoutSession(session);
    console.log('received webhook from Stripe!!');
  }

 // Return a response to acknowledge receipt of the event
  response.json({received: true});
});

app.listen(8000, () => console.log('Running on port 8000'));
 
 return response({"status": 200});
}

From Stripe Dashboard, I have sent a test event to this webhook endpoint: https://www.<myowndomain.com>/_functions/checkoutUpdate

The test webhook was sent successfully but there was no Response received from the server to Stripe. Any idea on how to get it to work? And is there a way for me to debug http-function.js such as logging into console in Preview Mode?

Any help would be greatly appreciated, thanks!

2

I figured out that the webhook from Stripe can be sent successfully and the server managed to send back a status of 200 to Stripe. All I did was installing and importing “express” from node_modules. I have also installed body-parser (although I’m not sure if I have imported and required correctly. Here’s the code:

import {ok, badRequest, response} from 'wix-http-functions';
import stripe from 'stripe';
import express from 'express';
//import {stripeWebhookHandler} from 'backend/StripeBackend';
import wixData from 'wix-data';
import bodyparser from 'body-parser';

const key = require('stripe')('sk_test_XXXXX'); //replace with your own secret key from Stripe

const endpointSecret = 'whsec_XXXXX'; //replace with your own signing secret key from Stripe

const app = require('express')();

const bodyParser = require('body-parser');

let responseBody = { //to send back to Stripe
 "status": 200,
        };

export function post_checkoutUpdate(request) {

 
//stripeWebhookHandler('test'); // this one works
 
  app.post('/webhook', bodyParser.raw({type: 'application/json'}), (request, response) => {
 const sig = request.headers['stripe-signature'];

//THE PROBLEM: my code can never reach here
  stripeWebhookHandler('inside app.post');

 let event;

 try {
    event = key.webhooks.constructEvent(request.body, sig, endpointSecret);
  } catch (err) {
 return response.status(400).send(`Webhook Error: ${err.message}`);
  }

 // Handle the checkout.session.completed event
 if (event.type === 'checkout.session.completed') {
 const session = event.data.object;

 //stripeWebhookHandler(session);
 
  }

 // Return a response to acknowledge receipt of the event
  response.json({received: true});
});

app.listen(8000, () => console.log('Running on port 8000'));
/*
  let responseBody = {
    "status": 200,
    "body"  : 'test'
  };
*/ 
 //return response({"status": 200});
 return response(responseBody);
 
}

//this function is for me to observe and handle data received from Stripe webhook
function stripeWebhookHandler (content) {
 let currentItem = {
 "webhookData": content
    };

    wixData.insert("MyCollection", currentItem)
    .then( (results) => {
 
 let item = results; 
 
          responseBody = {
 "status": 200,
 "body"  : item
 
        };

      } )
      .catch( (err) => {
 let errorMsg = err;
 
      } );
}

Now that I can receive webhook from Stripe and send a status 200 back to Stripe, I’m facing another problem. Any idea on how to get app.post to work? I’m trying to debug by making sure that app.post works by saving ‘inside app.post’ string in “MyCollection”. Furthermore, I receive warning in Wix Editor that both callback ‘request’ and ‘response’ for app.post are already declared in the upper scope.

Any suggestion or help will be very much appreciate! Thanks for reading this!

3

Just to follow up here again, I figured out that I can actually use Wix Site Monitoring tool to monitor site events real time! All console logs that have been triggered will be shown too. With this tool, now I can see its error through Json Payload message:

"["(node:1) [DEP0097] DeprecationWarning: Using a domain property in MakeCallback is deprecated. Use the async_context variant of MakeCallback or the AsyncResource class instead."]"

Any idea on why do I get this error message?

4

Would you be interested in helping me with this same situation? I have Code but need a little help. My email is kleindesignwebsites@gmail.com