source: Klonkt/src/routes/og.js@ d22b55c

main
Last change on this file since d22b55c was 69815b2, checked in by Robin Genis <roboburr@…>, 3 months ago

feat: auto-generated per-site OG image from palette + accent

New OgImageService renders a themed 1200x630 social card (palette gradient +
accent + site title/tagline + klonkt wordmark) via @resvg/resvg-js, cached on
disk. Served at GET /og/:slug.png and used as the default og:image/twitter:image
when a site has no custom share image — so every site gets a branded preview.
Bundles a static Fraunces TTF for rendering; graceful no-op if resvg can't load.

Co-Authored-By: Claude <noreply@…>

  • Property mode set to 100644
File size: 956 bytes
Line 
1/**
2 * GET /og/:slug.png — themed Open Graph card for a site (1200x630 PNG).
3 * Generated from the site's palette + accent (see OgImageService), cached.
4 * Used as the default og:image so every site has a branded social preview.
5 */
6import express from 'express';
7import db from '../config/database.js';
8import { ogImageFor } from '../services/OgImageService.js';
9
10const router = express.Router();
11
12router.get('/:slug.png', (req, res) => {
13 let site;
14 try {
15 site = db.prepare(
16 'SELECT slug, title, tagline, description, palette, accent FROM sites WHERE slug = ?'
17 ).get(req.params.slug);
18 } catch { /* db error → 404 below */ }
19 if (!site) return res.status(404).end();
20
21 const png = ogImageFor(site);
22 if (!png) return res.status(404).end(); // resvg unavailable → no card (graceful)
23
24 res.set('Content-Type', 'image/png');
25 res.set('Cache-Control', 'public, max-age=86400');
26 return res.send(png);
27});
28
29export default router;
Note: See TracBrowser for help on using the repository browser.