Paywall in AMP pages

Main component is AMP-ACCESS. 
  1. Authorization endpoint: AMP calls this URL to know user status: logged or not, permium or not, ...
  2. Pinback  endpoint: AMP calls hits URL everytime the user reads an article. Used for metered paywalls
  3. Login endpoint: the URL where the user can log in, or register. The login takes place in client's domain, and this page is hosted by the client. This URL will be opened in a different browser tab. This URL will be called with a query param that indicates the URL where the user must be redirected to once the process has finished, so AMP runtime can take control again of the flow.

Example of an AMP document

<script async src=""></script>
<script async custom-element="amp-access" src=""></script>
<script id="amp-access" type="application/json">
<h1> Title </h1>
<div>Summary of my article</div>
<div amp-access="EXPRESSION'">Article's premium content</div>

  • Amp will set display: none to any HTML element that has the attribute amp-access. Once Authorization Endpooint is called, the expression inside this attribute will be evaluated
  • The result of Autorization Endpoint call is a custom JSON file

Example of Authorization callback

  1. Authorization endpoint returns
 usuario_logeado: false
 articulos_vistos: 2

2. amp-access expression can then, contain, something like

<div amp-access="usuario_logeado = true OR articulos_vistos < 10">...</div>

Important considerations

  1. An user in AMP is always identifed with his AMP_READER_ID. It's up to the publisher to match an AMP_READER_ID with whatever user identification is stored in his database
  2. All premium content is obfuscated client side, via a CSS style. It's still under discussion how to do this server side. Currently the AMP team is evaluating if the AMP_ACCESS component and amp-access attribut expressions can be executed in the AMP cache

Default is “client”. The "server" option is under design discussion and these docs will be updated when it is ready.