Introducing LogSnag for SaaS

Join the waitlist for early access  

Published on July 5, 2022

Track payment events via JavaScript

Track payment events via JavaScript

When building a product or service that requires your users to pay for something, there are many ways that things can go wrong, such as delayed payments, fraud, or other such issues.

Thus, it is crucial to track these events in real-time and alert you and your team in the event of a problem.

LogSnag lets you track payment events such as User Subscription, User Purchase, User Cancellation, and User Redemption directly from your JavaScript application.

Connect LogSnag to JavaScript

Setting up your account

  1. Create a free LogSnag account.
  2. Create a new project on your dashboard.
  3. Copy your API token from the settings page.

JavaScript code snippets

Using JavaScript with Fetch 
var myHeaders = new Headers();
myHeaders.append("Content-Type", "application/json");
myHeaders.append("Authorization", "Bearer YOUR_API_TOKEN");

var raw = JSON.stringify({
  "project": "my-saas",
  "channel": "payments",
  "event": "Successful Payment",
  "description": "john@example.com - ($19.99)",
  "icon": "💸",
  "notify": true
});

var requestOptions = {
  method: 'POST',
  headers: myHeaders,
  body: raw,
  redirect: 'follow'
};

fetch("https://api.logsnag.com/v1/log", requestOptions)
  .then(response => response.text())
  .then(result => console.log(result))
  .catch(error => console.log('error', error));
Using JavaScript with jQuery 
var settings = {
  "url": "https://api.logsnag.com/v1/log",
  "method": "POST",
  "timeout": 0,
  "headers": {
    "Content-Type": "application/json",
    "Authorization": "Bearer YOUR_API_TOKEN"
  },
  "data": JSON.stringify({
    "project": "my-saas",
    "channel": "payments",
    "event": "Successful Payment",
    "description": "john@example.com - ($19.99)",
    "icon": "💸",
    "notify": true
  }),
};

$.ajax(settings).done(function (response) {
  console.log(response);
});
Using JavaScript with XHR 
// WARNING: For POST requests, body is set to null by browsers.
var data = JSON.stringify({
  "project": "my-saas",
  "channel": "payments",
  "event": "Successful Payment",
  "description": "john@example.com - ($19.99)",
  "icon": "💸",
  "notify": true
});

var xhr = new XMLHttpRequest();
xhr.withCredentials = true;

xhr.addEventListener("readystatechange", function() {
  if(this.readyState === 4) {
    console.log(this.responseText);
  }
});

xhr.open("POST", "https://api.logsnag.com/v1/log");
xhr.setRequestHeader("Content-Type", "application/json");
xhr.setRequestHeader("Authorization", "Bearer YOUR_API_TOKEN");

xhr.send(data);

JavaScript integration details

Connect LogSnag to your JavaScript code to easily track and keep a record of your product's payment events. With LogSnag, you can create simple charts and journeys to help you better understand your product. LogSnag also allows you to receive real-time push notifications on your desktop and mobile devices whenever a new payment event occurs.

Other use-cases for LogSnag

  1. Monitor your CI/CD build status for your JavaScript application
  2. Monitor your CPU usage in your JavaScript application
  3. Monitor when database goes down in your JavaScript application
  4. Monitor high disk usage in your JavaScript application
  5. Monitor when a user changes their email address in your JavaScript application
  6. Monitor failed logins in your JavaScript application
  7. Monitor failed payments for your JavaScript application
  8. Monitor memory usage in your JavaScript application
  9. Monitor MySQL downtime in your JavaScript application
  10. Monitor when a new feature is used in your JavaScript application
  11. Monitor your Postgres downtime in your JavaScript application
  12. Monitor Redis downtime in your JavaScript application
  13. Monitor suspicious activity in your JavaScript application
  14. Monitor when a user exceeds the usage limit for your JavaScript service
  15. Monitor when a user is being rate limited in your JavaScript application
  16. Get a notification when your JavaScript code is done executing
  17. Send push notifications to your phone or desktop using JavaScript
  18. Track canceled subscriptions in your JavaScript application
  19. Track your JavaScript cron jobs
  20. Track when a file is uploaded to your JavaScript application
  21. Track when a form is submitted to your JavaScript application
  22. Track user sign in events in JavaScript
  23. Track user signup events via JavaScript
  24. Track waitlist signup events via JavaScript
View all common use-cases with JavaScript