web-monetization-revenue-share

    0.2.8 • Public • Published

    Web Monetization Revenue Sharing

    Use web monetization probabilistic revenue sharing in the backend together with a smart contract.
    Also able to include receipt verification.
    This module uses as default smart contract connection settings for Infura.

    Install

    npm install web-monetization-revenue-share
    

    Setup

    Smart Contract ABI

    You can find an example of a working Smart Contract here.

    • Get the ABI of your smart contract (make sure there is at least one payment pointer in the smart contract)

    • Store ABI in your project (eg: smartContractInfo.json)

      {
        "address": "yourSmartContractAddress",
        "ABI": [
          // your smart contract ABI
        ]
      }
      

    Payment Pointers List

    • Create a list of payment pointers in case you don't want to use a smart contract (eg: paymentPointers.js)

      const pointers = {
        '$alice.example': 50,
        '$bob.example': 40,
        '$connie.example': 9,
        '$dave.example': 1
      }
      
      module.exports = pointers
      

    Config File

    • Create a config file to store all the parameters required (eg: config.js)

      const config = {
        server: {
          port: 1337
        },
        useSmartContract: 'true',
        useReceiptVerification: 'false',
        paymentPointersPath: './paymentPointers',
        receiptVerification:{ 
          service: 'https://webmonetization.org/api/receipts/',
          verifier: 'https://webmonetization.org/api/receipts/verify'
        },
        smartContract: {
          provider: 'rinkeby', // use the network of your choice
          key: yourKeyForRinkeby, // eg: If using Infura to access rinkeby use your Infura Project Key here 
          smartContractInfoFilePath: './smartContractInfo.json'
        }
      };
      
      module.exports = config;
      

    Use

    const wmRevenueShare = require('web-monetization-revenue-share')
    wmRevenueShare.setUp('/config')
    const paymentPointerUrl = await wmRevenueShare.getPointerUrl()
    

    Express Example

    How to include it into your expressJS server.

    server.js (on the backend)
    var express = require('express');
    var app = express();
    const fetch = require("node-fetch");
    var cors = require('cors')
    const config = require('./config')
    const wmRevenueShare = require('web-monetization-revenue-share')
    
    app.use(express.json());
    app.use(express.urlencoded({ extended: true }))
    app.use(cors())
    
    const PORT = config.server.port;
    app.listen(PORT, () => {
      console.log(`App is running on port ${PORT}`);
    });
    
    wmRevenueShare.setUp('./config')
    
    // Your endpoint that you will reach from the frontend.
    app.post('/verifyReceipt', async (req, res) => {
      const resp = await fetch(config.receiptVerification.verifier, {
        method: 'POST',
        body: req.body.receipt
      })
    
      const { amount } = await resp.json()
      console.log('Received ' + amount)
    
      // backend logic for new paid amount
    
      res.send({ message: 'ok', data: { received: amount } })
    })
    
    app.get('/', async function (req, res, next) {
      // is this request meant for Web Monetization?
      
      if (req.header('accept').includes('application/spsp4+json')) {
        console.log('Revenue sharing active')
        const paymentPointerUrl = await wmRevenueShare.getPointerUrl()
        console.log(`Payment pointer: ${paymentPointerUrl}`)
    
        // redirect to our chosen payment pointer so they get paid
        res.redirect(302, paymentPointerUrl)
      } else {
        // if the request is not for Web Monetization, do nothing
        console.log('Revenue sharing not active')
        next()
      }
    })
    

    index.ejs (on the frontend)

    Your frontend could be hosted on a different server, if desired

    <head>
      <meta name="monetization" content="https://your-deployed-server-instance-url/">  
      
      <!-- Use this script for receipt verification -->
      <script>
    
        if (document.monetization) {
          document.monetization.addEventListener('monetizationprogress', async event => {
            // A payment has been received.
            console.log('A payment has been received.')
            console.log(event.detail.receipt)
    
            // Connect to your site’s backend to validate the payment. This does NOT connect directly to the receipt verifier.
            const res = await fetch('https://your-deployed-server-instance-url/verifyReceipt', {
              method: 'POST',
              headers: {
                'content-type': 'application/json'
              },
              body: JSON.stringify({
                receipt: event.detail.receipt
              })
            })
          })
        }
      </script>
    </head>
    

    You may find a full working example here.

    Test

    Test the npm package

    • Download repository

      git clone https://github.com/Vivid-IOV-Labs/web-monetization-revenue-share.git
      
    • Install

      npm install
      
    • Run tests

      npm test
      

    Install

    npm i web-monetization-revenue-share

    DownloadsWeekly Downloads

    1

    Version

    0.2.8

    License

    MIT

    Unpacked Size

    24 kB

    Total Files

    13

    Last publish

    Collaborators

    • ntzi