← Back to Dashboard

Developer Guide

Integrate Ninja Backer tips into your applications, overlays, and automation tools.

Webhook Integration

Configure a webhook URL in your dashboard to receive HTTP POST requests when tips arrive.

Webhook Payload

{
  "type": "tip",
  "amount": 5.00,
  "currency": "USD",
  "name": "TipperName",
  "message": "Great stream!",
  "timestamp": 1702138446000
}

Payload Fields

FieldTypeDescription
typestringAlways "tip"
amountnumberTip amount in dollars (e.g., 5.00)
currencystringCurrency code (USD, EUR, GBP, etc.)
namestringTipper's display name
messagestringOptional message from tipper
timestampnumberUnix timestamp in milliseconds

Server-Sent Events (SSE)

For real-time integrations, connect to the SSE endpoint using your Tip ID.

Endpoint

GET https://tip.vdo.ninja/v1/subscribe/{YOUR_TIP_ID}

JavaScript Example

const tipId = 'your_tip_id_here';
const events = new EventSource(`https://tip.vdo.ninja/v1/subscribe/${tipId}`);

events.onmessage = (event) => {
  const data = JSON.parse(event.data);
  if (data.type === 'tip') {
    console.log(`Received $${data.amount} from ${data.fromLabel}`);
    console.log(`Message: ${data.message}`);
  }
};

events.onerror = () => {
  console.log('Connection lost, reconnecting...');
};

SSE Event Format

{
  "type": "tip",
  "amount": 5.00,
  "currency": "USD",
  "fromLabel": "TipperName",
  "message": "Great stream!",
  "timestamp": 1702138446000
}

VDO.Ninja Integration

Add the &tip=YOUR_TIP_ID parameter to your VDO.Ninja URL to enable in-stream tipping.

https://vdo.ninja/?push=streamid&tip=YOUR_TIP_ID

URL Parameters

ParameterDescriptionExample
&tip=IDYour Tip ID from dashboard&tip=aS_WnIp8IPrV
&tipShow setup modal (no ID)&tip
&tipqrsize=NQR code size in pixels&tipqrsize=200
&tipqrShow QR code on video (default: on)&tipqr=false
&tipamounts=A,B,CCustom tip button amounts&tipamounts=5,10,25,50
&tipcurrency=XXXCurrency code&tipcurrency=EUR

For Viewers

Viewers must opt-in to see tip UI. Add &showtips to viewer URLs:

https://vdo.ninja/?view=streamid&showtips

Hiding the QR Code

If you prefer not to show the QR code overlay on your video:

https://vdo.ninja/?push=streamid&tip=YOUR_TIP_ID&tipqr=false

Custom QR Code Size

Adjust the QR code size (default is 150px):

https://vdo.ninja/?push=streamid&tip=YOUR_TIP_ID&tipqrsize=100

Social Stream Integration

To use with Social Stream, enter your Social Stream webhook URL in the dashboard. Tips will appear alongside your chat messages.

Testing

Use the "Send Test Tip" button in your dashboard to trigger a test notification without making a real payment. Test tips include "isTest": true in the payload.

Profile Avatar

Your profile avatar is automatically loaded from Gravatar using your Stripe account email.

Setting Up Your Avatar

  1. Go to gravatar.com and create an account
  2. Use the same email address you used when registering with Stripe
  3. Upload your profile picture
  4. Your avatar will automatically appear on your tip page

If no Gravatar is found, a default placeholder image is displayed.

← Back to Dashboard