Changeset 072a242 in Klonkt

Timestamp:

07/21/2026 03:26:24 AM (7 weeks ago)

Author:

Robin <roboburr@…>

Branches:

main

Children:

b9beb16

Parents:

dede82e

git-author:

Robin <roboburr@…> (07/21/2026 03:26:22 AM)

git-committer:

Robin <roboburr@…> (07/21/2026 03:26:24 AM)

Message:

Fix: unlocked post renders via its own page; no duplicate supporter button

Two things the tester hit once the passkey flow worked:

1. Duplicate "Word supporter". The gate's no-WebAuthn fallback relabelled the unlock button to "Word supporter", which sat next to the real "Word supporter op Patreon" button. In the two-button layout that fallback now hides the (unusable) unlock button instead; the single-button layout keeps the relabel since it's the only button.

2. The unlocked content sat in a bare <div>, so it lost the post page's layout and scoped typography ("div niet in een goeie div"). Instead of injecting HTML into the gate, /paid/unlock now returns a short-lived (120s) signed unlock capability and the client reloads the real post URL with it (?u=). GET /:slug renders the FULL post through its normal template when the capability is valid: correct wrapper, scoped styles, and working audio players (which bind on load and couldn't init in injected HTML). Not a cookie and not stored: the token lives only in that one URL and expires.

Changed files:
src/routes/paid.js

• /unlock returns { ok, redirect } with a 120s unlock blob; drop the renderPostBodyHtml import (no longer injected here)

src/routes/posts.js

• a valid ?u= capability bypasses the paid gate and renders the post

src/views/pages/paid-gate.ejs

• no-WebAuthn fallback hides the unlock button when a Patreon page exists; success reloads the real post via the redirect

-robo
Co-Authored-By: Claude Opus 4.8 <noreply@…>

Location:

src

Files:

• routes/paid.js (modified) (2 diffs)
• routes/posts.js (modified) (2 diffs)
• views/pages/paid-gate.ejs (modified) (2 diffs)

src/routes/paid.js

@@ -15 +15 @@
 import PaidPatreon from '../services/PaidPatreonService.js';
 import Passkey from '../services/PasskeyService.js';
-import { renderPostBodyHtml } from './posts.js';
 
 const router = express.Router();
@@ -128 +127 @@
   const post = db.prepare("SELECT * FROM posts WHERE site_id = ? AND slug = ? AND status = 'published'").get(r.site.id, String(payload.post || ''));
   if (!post || !post.paid) return res.status(404).json({ error: 'gone' });
-  res.json({ ok: true, title: post.title || '', html: renderPostBodyHtml(r.site, post, req) });
+  // Hand back a short-lived, single-post unlock capability. The client reloads
+  // the real post page with it (?u=), so the post renders through its normal
+  // template: correct layout, scoped styles, working audio. Not a cookie and
+  // not stored: a 120s signed blob that lives only in that one URL.
+  const token = signBlob({ purpose: 'unlocked', siteId: r.site.id, post: post.slug }, 120);
+  res.json({ ok: true, redirect: `${res.locals.siteUrlBase || ''}/${encodeURIComponent(post.slug)}?u=${encodeURIComponent(token)}` });
 });
 

src/routes/posts.js

@@ -22 +22 @@
 import { premiumUnlocked } from '../services/PatreonService.js';
 import { defaultMinCents as paidDefaultMinCents, patreonUrl as paidPatronUrl } from '../services/PaidPatreonService.js';
+import { verifyBlob } from '../services/CryptoBox.js';
 import MusicMeta from '../services/MusicMeta.js';
 
@@ -1238 +1239 @@
   // never see the unlock button).
   const canEditThis = req.session?.user && PermissionsService.canEditPost(req.session.user, post, site);
-  if (post.paid && !canEditThis) {
+  // A fresh unlock capability (?u=) from /paid/unlock lets a just-verified
+  // supporter render the FULL post through this normal template (correct layout,
+  // scoped styles, working audio). Short-lived signed blob, single post, not a
+  // cookie and not stored.
+  const _u = req.query.u ? verifyBlob(String(req.query.u)) : null;
+  const _unlocked = _u && _u.purpose === 'unlocked' && _u.siteId === site.id && String(_u.post) === String(post.slug);
+  if (post.paid && !canEditThis && !_unlocked) {
     const { newerPost, olderPost } = postNeighbors(site, post, res.locals.tenancy === 'hub');
     return renderPage(req, res, 'pages/paid-gate', {

src/views/pages/paid-gate.ejs

@@ -37 +37 @@
   var base = "<%= (typeof siteUrlBase !== 'undefined' && siteUrlBase ? siteUrlBase : '') %>";
   var slug = "<%= pgSlug %>";
+  var hasPatron = <%= _hasPatron ? 'true' : 'false' %>;
   var btn = document.getElementById('pg-unlock');
   var status = document.getElementById('pg-status');
-  var page = document.getElementById('pg-page');
   function say(msg, err) { status.hidden = false; status.textContent = msg; status.classList.toggle('is-err', !!err); }
   function toLink() { location.href = base + '/paid/link?post=' + encodeURIComponent(slug); }
 
-  if (!window.SimpleWebAuthnBrowser || !window.PublicKeyCredential) { btn.textContent = 'Word supporter'; btn.addEventListener('click', toLink); return; }
+  // No WebAuthn here: an assertion is impossible. With a Patreon page there is
+  // already a "Word supporter" button, so hide the (dead) unlock button rather
+  // than turn it into a second "Word supporter". Without one, this IS the button.
+  if (!window.SimpleWebAuthnBrowser || !window.PublicKeyCredential) {
+    if (hasPatron) { btn.style.display = 'none'; }
+    else { btn.textContent = 'Word supporter'; btn.addEventListener('click', toLink); }
+    return;
+  }
 
   btn.addEventListener('click', function () {
@@ -61 +68 @@
       .then(function (r) { return r.json().then(function (j) { return { status: r.status, j: j }; }); })
       .then(function (res) {
-        if (res.j && res.j.ok) {
-          // Swap the gate for the full post, client-side (no cookie kept).
-          var h = document.createElement('div');
-          h.innerHTML = (res.j.title ? '<h1 class="post-title">' + res.j.title + '</h1>' : '') +
-            '<div class="post-content">' + res.j.html + '</div>';
-          page.replaceWith(h);
+        if (res.j && res.j.ok && res.j.redirect) {
+          // Reload the real post page via the one-shot unlock capability, so it
+          // renders through its normal template (layout, styles, audio).
+          location.href = res.j.redirect;
         } else if (res.status === 403) {
           toLink();   // no valid passkey yet (or lapsed tier): link via Patreon