fix(podcast): lille omslag i link-forhåndsvisningen

Med det store omslag (3000 px) viste Messenger et kvadratisk billede i hele
beskedens bredde. Forhåndsvisningen bruger nu cover-lille.jpg (300 px), når
den findes, så den vises som en miniature ved teksten.

Claude-Session: https://claude.ai/code/session_012LCTmU2ewo8tnM1dByYAoG

main.py

@@ -7,6 +7,7 @@ from fastapi.staticfiles import StaticFiles
 from fastapi.templating import Jinja2Templates
 from starlette.middleware.sessions import SessionMiddleware
 
+import re
 import time
 import urllib.parse
 
@@ -441,16 +442,47 @@ async def podcast_ny_noegle(request: Request):
 
 # Det fælles familielink: ingen login, ingen kladder, noindex. Står før de
 # personlige ruter, så "f" aldrig forveksles med en nøgle.
+# Messenger/Facebooks link-forhåndsvisning og deres indbyggede browsere.
+_FORHAANDSVISNING = re.compile(r"facebookexternalhit|meta-external(agent|fetcher)|Facebot|WhatsApp", re.I)
+_INDBYGGET = re.compile(r"FBAN|FBAV|FB_IAB|FBIOS|Messenger|Instagram|LinkedInApp", re.I)
+
+
 @app.get("/podcast/f/{key}/", response_class=HTMLResponse)
 async def podcast_faelles_side(request: Request, key: str):
-    if podcast.blokeret(_klient_ip(request)) or not podcast.faelles_slaa_op(key, "side"):
+    ua = request.headers.get("user-agent", "")
+    forhaandsvisning = bool(_FORHAANDSVISNING.search(ua))
+    if podcast.blokeret(_klient_ip(request)) or not podcast.faelles_slaa_op(key, "" if forhaandsvisning else "side"):
         _ikke_fundet(request)
     rod = f"/podcast/f/{key}"
+    base = str(request.base_url).rstrip("/")
+    udsendelser = _podcast_kontekst(request, rod, med_kladder=False)
+    s = udsendelser[0] if udsendelser else {"titel": "Podcast", "slug": "", "har_cover": False}
+    # Et lille omslag (300 px), så Messenger viser en miniature ved teksten i
+    # stedet for et billede i hele beskedens bredde.
+    lille = bool(s.get("slug")) and podcast.cover(s["slug"], lille=True) is not None
+    og = {"titel": s["titel"], "url": f"{base}{rod}/",
+          "beskrivelse": "Familiens podcast. Lyt i browseren, eller abonnér i din podcast-app.",
+          "billede": (f"{base}{rod}/{s['slug']}/cover-lille.jpg" if lille else
+                      f"{base}{rod}/{s['slug']}/cover.jpg" if s.get("har_cover") else ""),
+          "str": 300 if lille else 3000}
+    headers = {"X-Robots-Tag": "noindex, nofollow, noarchive", "Referrer-Policy": "no-referrer",
+               "Cache-Control": "private, no-store"}
+    if forhaandsvisning:
+        # Forhåndsvisningen får kun titel, en neutral tekst og omslaget, aldrig
+        # episodelisten (den nævner familiemedlemmer ved navn).
+        return templates.TemplateResponse(request, "podcast_og.html", {"request": request, "og": og}, headers=headers)
+    indbygget = None
+    if _INDBYGGET.search(ua):
+        sti = f"{request.url.hostname}{rod}/"
+        if re.search(r"iPhone|iPad|iOS", ua):
+            indbygget = {"knap": "Åbn i Safari", "href": f"x-safari-https://{sti}"}
+        elif "Android" in ua:
+            indbygget = {"knap": "Åbn i Chrome", "href": f"intent://{sti}#Intent;scheme=https;end"}
+        else:
+            indbygget = {"knap": "", "href": ""}
     return templates.TemplateResponse(request, "podcast.html", {
-        "request": request, "user": None, "is_admin": False, "rod": rod, "delt": True,
+        "request": request, "user": None, "is_admin": False, "rod": rod, "delt": True, "og": og,
-        "udsendelser": _podcast_kontekst(request, rod, med_kladder=False), "saved": ""},
+        "indbygget": indbygget, "udsendelser": udsendelser, "saved": ""}, headers=headers)
-        headers={"X-Robots-Tag": "noindex, nofollow, noarchive", "Referrer-Policy": "no-referrer",
-                 "Cache-Control": "private, no-store"})
 
 
 @app.get("/podcast/f/{key}/{name}.xml")
@@ -464,6 +496,14 @@ async def podcast_faelles_feed(request: Request, key: str, name: str):
                     headers={"Cache-Control": "private, max-age=300", "X-Robots-Tag": "noindex, nofollow"})
 
 
+@app.get("/podcast/f/{key}/{name}/cover-lille.jpg")
+async def podcast_faelles_cover_lille(request: Request, key: str, name: str):
+    p = podcast.cover(name, lille=True)
+    if podcast.blokeret(_klient_ip(request)) or not podcast.faelles_slaa_op(key) or not p:
+        _ikke_fundet(request)
+    return FileResponse(p, media_type="image/jpeg", headers={"Cache-Control": "private, max-age=86400"})
+
+
 @app.get("/podcast/f/{key}/{name}/cover.jpg")
 async def podcast_faelles_cover(request: Request, key: str, name: str):
     p = podcast.cover(name)

podcast.py

@@ -115,8 +115,9 @@ def saet_kladde(name: str, slug: str, kladde: bool) -> bool:
     return True
 
 
-def cover(name: str) -> Path | None:
+def cover(name: str, lille: bool = False) -> Path | None:
-    p = ROOT / name / "cover.jpg"
+    """Omslaget; lille = 300 px-udgaven til link-forhåndsvisninger (cover-lille.jpg)."""
+    p = ROOT / name / ("cover-lille.jpg" if lille else "cover.jpg")
     return p if SHOW.match(name or "") and p.exists() else None
 
 

templates/podcast.html

@@ -1,7 +1,12 @@
 {% extends "base.html" %}
 {% block title %}{% if delt and udsendelser %}{{ udsendelser[0].titel }}{% else %}Podcast{% endif %}{% endblock %}
 {% block head %}{% if delt %}<meta name="robots" content="noindex, nofollow, noarchive">
-<meta name="referrer" content="no-referrer">{% endif %}{% endblock %}
+<meta name="referrer" content="no-referrer">
+{% if og %}<meta property="og:type" content="website">
+<meta property="og:title" content="{{ og.titel }}">
+<meta property="og:description" content="{{ og.beskrivelse }}">
+<meta property="og:url" content="{{ og.url }}">
+{% if og.billede %}<meta property="og:image" content="{{ og.billede }}">{% endif %}{% endif %}{% endif %}{% endblock %}
 {% block body %}
 {% if saved %}<div class="wt-flash">{{ saved }}</div>{% endif %}
 {% if not udsendelser %}
@@ -23,6 +28,15 @@
 
   <div class="wt-card" style="margin:1.4rem 0;padding:1rem 1.2rem">
     <h2 style="font-size:1.05rem;margin:0 0 .5rem">Abonnér i din podcast-app</h2>
+    {% if indbygget %}
+    <div class="wt-flash" style="margin:.4rem 0 .9rem">
+      Du har åbnet siden inde i Messenger, og den kan ikke åbne podcast-apps.
+      {% if indbygget.href %}Tryk her for at åbne siden i din almindelige browser, og abonnér derfra:
+      <div style="margin-top:.6rem"><a class="wt-btn wt-btn--primary" href="{{ indbygget.href }}">{{ indbygget.knap }}</a></div>
+      {% else %}Åbn siden i din almindelige browser (menuen ⋯ øverst), og abonnér derfra.{% endif %}
+      <div class="wt-muted" style="font-size:.85rem;margin-top:.5rem">Virker knappen ikke: tryk på ⋯ øverst og vælg "Åbn i ekstern browser". Du kan også bare lytte herunder.</div>
+    </div>
+    {% endif %}
     <p class="wt-muted" style="margin:.2rem 0 .8rem">{% if delt %}Tryk på din app, så kommer nye episoder af sig selv. Linket er familiens fælles, så del det kun inden for familien.{% else %}Tryk på din app. Nye episoder kommer så af sig selv. Adressen er din egen, så del den ikke; familien får hver sin.{% endif %}</p>
     <div style="display:flex;flex-wrap:wrap;gap:.5rem">
       <a class="wt-btn wt-btn--primary" href="podcast://{{ u.uden_skema }}">Apple Podcasts</a>

templates/podcast_og.html

@@ -0,0 +1,19 @@
+<!doctype html>
+<html lang="da">
+<head>
+<meta charset="utf-8">
+<title>{{ og.titel }}</title>
+<meta name="robots" content="noindex, nofollow, noarchive">
+<meta name="description" content="{{ og.beskrivelse }}">
+<meta property="og:type" content="website">
+<meta property="og:title" content="{{ og.titel }}">
+<meta property="og:description" content="{{ og.beskrivelse }}">
+<meta property="og:url" content="{{ og.url }}">
+<meta property="og:locale" content="da_DK">
+{% if og.billede %}<meta property="og:image" content="{{ og.billede }}">
+<meta property="og:image:width" content="{{ og.str }}">
+<meta property="og:image:height" content="{{ og.str }}">
+<meta name="twitter:card" content="summary">{% endif %}
+</head>
+<body><h1>{{ og.titel }}</h1><p>{{ og.beskrivelse }}</p></body>
+</html>