Web Monetization API

The Web Monetization API provides a seamless payment experience for site owners and visitors. Unlike the W3C's Payment Request API, the Web Monetization API sends continuous micro-payments from the user agent to the website. Thus, visitors automatically send a small sum per time unit to any Web Monetized website they visit. The payment rate is predetermined by the user's Web Monetization agent and adapts over time.

Web Monetization Concepts and Usage

The Web Monetization API allows web apps to accept continuous micro-payments from users. There are two components to this API:

• The Web Monetization Agent is designed to be implemented in browsers and expose the Web Monetization API. It's responsible to:

  • get the rate, token, and payment connection address from the Web Monetization Provider
  • get the payment information from the <link> element
  • create an incoming payment via the Open Payments API

    - create an [Interledger](https://interledger.org/) payment connection via either the [STREAM](https://interledger.org/rfcs/0029-stream/) protocol or the [Open Payments](https://docs.openpayments.guide/) standard

  • verify payment via the outgoing payment endpoint on the web site owner's payment pointer via the Open Payments API

• The Web Monetization Provider is intended to be the entity that facilitates payments to websites on behalf of the user. It's designed to be side-loaded via an extension, essentially allowing users to choose their provider by installing a different extension. It would only be responsible for offering the browser information about the rate, token, and provider address. Ideally, there would be a separate extension category for Web Monetization Providers. A website visitor can also potentially be their own Web Monetization Provider through the use of a digital wallet that implements the Open Payments API standard.

Currently, the Agent and Provider are loaded via the same extension until the Web Monetization Agent is implemented in browsers.

Interfaces

MonetizationEvent

An event object that contains all of the attributes of a successful web monetization event.

Basic example

<link rel="monetization" href="https://example.com/pay" />

Guides and tutorials

Exclusive Content

A tutorial on how to show Web Monetized viewers exclusive content.

Remove Ads

A guide on removing ads for Web Monetized viewers.

Micropayment Counter

Calculate how much you made from a Web Monetized visitor.

Probabilistic Revenue Sharing

A guide on revenue sharing amongst multiple payment pointers.

[**Receipt Verifier Service**](/docs/receipt-verifier)

A reference on verifying payments.

Libraries

• Hugo Web Monetization Component is a theme component that enables Web Monetization on your entire Hugo website.

• Monetize Eleventy is an Eleventy plugin to monetize posts and site content by creating exclusive content areas.

• gridsome-plugin-monetization is a Web Monetization plugin for Gridsome.

• gatsby-plugin-monetization is a Gatsby plugin for react-monetize to speed up your integration with Web Monetization.

• ngx-monetization is a Web Monetization API for Angular.

• VuePress plugin Web Monetization is a Web Monetization plugin for your VuePress website.

• Tessy is an advanced Web Monetization testing library with a powerful declarative API.

• svelte-monetization is a minimal and lightweight wrapper for the Web Monetization API.

• Moodle Web Monetization Module is a plugin for adding Web Monetization to your Moodle site.

• Jekyll + Web Monetization is a Jekyll plugin for adding Web Monetization to your site.

Specifications

Browser compatibility