feat(ai): Deutsch als starker Prior im OCR-Prompt

Neue SPRACHE-Sektion weist Gemini explizit darauf hin, dass die
Texte ausschliesslich deutsch sind -- Umlaute, deutsche Zutaten,
deutsche Masseinheiten als Prior fuer die Zeichen-Rekonstruktion.
Soll die "Kontext-Detektiv"-Logik bei handgeschriebenen oder
verblassten Rezepten verbessern.

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>

Dockerfile

@@ -8,13 +8,39 @@ WORKDIR /app
 RUN apk add --no-cache python3 make g++ libc6-compat vips-dev
 
 COPY package*.json ./
-RUN npm ci
+# Sharp-Prebuilt-Install unter Docker-Buildx-QEMU war trotz aller Flag-
+# Varianten unzuverlaessig. Finale Strategie:
+#   - --cpu/--os/--libc explizit setzen: sharp's offizielle Doc-Empfehlung
+#     fuer Cross-Platform-Docker-Builds (siehe sharp-Install-Doku),
+#     umgeht QEMU-Detection-Bugs.
+#   - --ignore-scripts + npm rebuild: loest das Parallel-Install-Race,
+#     bei dem sharp's install-Skript vor dem Entpacken der Prebuilt-Binary
+#     laeuft.
+#   - Explizites Nachinstallieren der Prebuilts als Sicherheit: falls (A)
+#     noch nicht reicht, zwingt (B) die Plattform-Pakete auf Disk.
+#   - node-addon-api + node-gyp als Runtime-Deps: falls am Ende doch alles
+#     nicht klappt und sharp from-source baut (mit dem oben installierten
+#     python3 + make + g++ + vips-dev).
+RUN npm install --cpu=arm64 --os=linux --libc=musl \
+      --ignore-scripts --include=optional --no-audit --no-fund
+RUN npm install --cpu=arm64 --os=linux --libc=musl \
+      --ignore-scripts --no-save --no-audit --no-fund \
+      @img/sharp-linuxmusl-arm64@0.34.5 \
+      @img/sharp-libvips-linuxmusl-arm64@1.2.4
+RUN npm rebuild
 
 COPY . .
 RUN npm run build
 
-# Remove dev dependencies for the runtime image
-RUN npm prune --omit=dev
+# Fresh-Install fuer den Runtime-Stage: nur Produktions-Deps, gleiche Strategie.
+RUN rm -rf node_modules \
+  && npm install --cpu=arm64 --os=linux --libc=musl \
+       --ignore-scripts --omit=dev --include=optional --no-audit --no-fund \
+  && npm install --cpu=arm64 --os=linux --libc=musl \
+       --ignore-scripts --no-save --no-audit --no-fund \
+       @img/sharp-linuxmusl-arm64@0.34.5 \
+       @img/sharp-libvips-linuxmusl-arm64@1.2.4 \
+  && npm rebuild
 
 FROM node:22-alpine AS runner
 WORKDIR /app

docker-compose.prod.yml

@@ -17,6 +17,10 @@ services:
       - GEMINI_API_KEY=${GEMINI_API_KEY:-}
       - GEMINI_MODEL=${GEMINI_MODEL:-gemini-2.5-flash}
       - GEMINI_TIMEOUT_MS=${GEMINI_TIMEOUT_MS:-20000}
+      # adapter-node-Default ist 512 KB. Tablet- und iPad-Pro-Kameras liefern
+      # JPEGs/HEICs bis 15 MB. Endpoint-Limit ist 20 MB; hier 25 MB fuer den
+      # Multipart-Overhead.
+      - BODY_SIZE_LIMIT=25000000
     depends_on:
       - searxng
     restart: unless-stopped

package.json

@@ -42,6 +42,8 @@
     "better-sqlite3": "^11.5.0",
     "linkedom": "^0.18.5",
     "lucide-svelte": "^1.0.1",
+    "node-addon-api": "^8.7.0",
+    "node-gyp": "^12.3.0",
     "yauzl": "^3.3.0",
     "zod": "^3.23.8"
   }

src/lib/server/ai/gemini-client.ts

@@ -2,6 +2,7 @@ import { GoogleGenerativeAI } from '@google/generative-ai';
 import { env } from '$env/dynamic/private';
 import {
   RECIPE_EXTRACTION_SYSTEM_PROMPT,
+  RECIPE_EXTRACTION_USER_PROMPT,
   GEMINI_RESPONSE_SCHEMA,
   extractionResponseSchema,
   type ExtractionResponse
@@ -84,7 +85,10 @@ async function callGemini(
 
   const parts: Array<
     { inlineData: { data: string; mimeType: string } } | { text: string }
-  > = [{ inlineData: { data: imageBuffer.toString('base64'), mimeType } }];
+  > = [
+    { inlineData: { data: imageBuffer.toString('base64'), mimeType } },
+    { text: RECIPE_EXTRACTION_USER_PROMPT }
+  ];
   if (appendUserNote) parts.push({ text: appendUserNote });
 
   const result = await withTimeout(
@@ -114,6 +118,7 @@ export async function extractRecipeFromImage(
   imageBuffer: Buffer,
   mimeType: string
 ): Promise<ExtractionResponse> {
+  let firstMsg: string | null = null;
   try {
     return await callGemini(imageBuffer, mimeType);
   } catch (e) {
@@ -132,6 +137,9 @@ export async function extractRecipeFromImage(
         : new GeminiError('AI_FAILED', String(e));
     }
 
+    firstMsg = e instanceof Error ? e.message : String(e);
+    console.warn(`[gemini-client] first attempt failed, retrying: ${firstMsg}`);
+
     await new Promise((r) => setTimeout(r, 500));
     try {
       return await callGemini(
@@ -140,11 +148,23 @@ export async function extractRecipeFromImage(
         'Dein vorheriger Output war ungültig. Bitte antworte ausschließlich mit JSON gemäß Schema.'
       );
     } catch (retryErr) {
-      if (retryErr instanceof GeminiError) throw retryErr;
+      const retryMsg = retryErr instanceof Error ? retryErr.message : String(retryErr);
+      if (retryErr instanceof GeminiError) {
+        if (retryErr.code === 'AI_FAILED') {
+          throw new GeminiError(
+            'AI_FAILED',
+            `retry failed: ${retryMsg} (first: ${firstMsg})`
+          );
+        }
+        throw retryErr;
+      }
       const retryStatus = getStatus(retryErr);
       if (retryStatus === 429)
         throw new GeminiError('AI_RATE_LIMITED', 'Gemini rate limit on retry');
-      throw new GeminiError('AI_FAILED', String(retryErr));
+      throw new GeminiError(
+        'AI_FAILED',
+        `retry failed: ${retryMsg} (first: ${firstMsg})`
+      );
     }
   }
 }

src/lib/server/ai/image-preprocess.ts

@@ -1,4 +1,5 @@
-import sharp from 'sharp';
+import type SharpType from 'sharp';
+import { createRequire } from 'node:module';
 
 const MAX_EDGE = 1600;
 const JPEG_QUALITY = 85;
@@ -8,10 +9,25 @@ export type PreprocessedImage = {
   mimeType: 'image/jpeg';
 };
 
+// sharp per Node-Runtime-require laden, nicht via ES-Import: adapter-node
+// bundelt ES-Imports (auch dynamische, auch mit @vite-ignore) ins Server-
+// Bundle, was sharp's internes dynamic-require fuer die Plattform-.node-Binary
+// zerstoert. createRequire + require() ist pure Node-Runtime-Logik, die
+// Rollup nicht anfasst -- sharp wird regulaer aus node_modules geladen.
+const nodeRequire = createRequire(import.meta.url);
+let sharpModule: typeof SharpType | null = null;
+function loadSharp(): typeof SharpType {
+  if (!sharpModule) {
+    sharpModule = nodeRequire('sharp') as typeof SharpType;
+  }
+  return sharpModule;
+}
+
 // Resize auf max 1600px lange Kante, JPEG re-encode, Metadata strippen.
 // sharp liest HEIC/HEIF transparent, wenn libheif im libvips-Build enthalten ist
 // (in Alpine's vips-dev + in den offiziellen sharp-Prebuilds).
 export async function preprocessImage(input: Buffer): Promise<PreprocessedImage> {
+  const sharp = loadSharp();
   const pipeline = sharp(input, { failOn: 'error' }).rotate(); // respect EXIF orientation
   const meta = await pipeline.metadata();
   if (!meta.width || !meta.height) {

src/lib/server/ai/recipe-extraction-prompt.ts

@@ -1,18 +1,27 @@
 import { z } from 'zod';
 import { SchemaType } from '@google/generative-ai';
 
-export const RECIPE_EXTRACTION_SYSTEM_PROMPT = `Du bist ein Rezept-Extraktions-Assistent.
-Du bekommst ein Foto eines gedruckten oder handgeschriebenen Rezepts und gibst ein strukturiertes JSON zurück.
+export const RECIPE_EXTRACTION_SYSTEM_PROMPT = `Du bist ein hochpräziser OCR-Experte für kulinarische Dokumente (Rezepte). Deine Aufgabe ist die Extraktion von Rezeptdaten (Titel, Zutaten, Zubereitungsschritte, Zeiten, Portionen) in valides JSON gemäß dem vorgegebenen Schema.
 
-Regeln:
-- Extrahiere nur, was tatsächlich auf dem Bild lesbar ist. Sonst Feld auf null (oder leeres Array).
-- Zutaten: quantity als Zahl (Bruchteile wie ½, ¼, 1 ½ als Dezimalzahl 0.5, 0.25, 1.5), unit separat
-  (g, ml, l, kg, EL, TL, Stück, Prise, Msp, …).
+SPRACHE:
+- Die Texte sind ausschließlich auf Deutsch. Nutze deutsches Sprachverständnis (Umlaute ä/ö/ü/ß, deutsche Zutatennamen, deutsche Maßeinheiten) als starken Prior bei der Rekonstruktion unklarer Zeichen. Gib die Ausgabe vollständig auf Deutsch zurück.
+
+LOGIK-REGELN FÜR SCHWER LESBARE TEXTE:
+- Handle als "Kontext-Detektiv": Wenn Zeichen unklar sind, nutze kulinarisches Wissen zur Rekonstruktion (z.B. "Pr-se" -> "Prise").
+- Bei absoluter Unleserlichkeit eines Wortes: Nutze "[?]".
+- Halluziniere keine fehlenden Werte: Wenn eine Mengenangabe komplett fehlt, setze 'quantity' auf null. Was nicht auf dem Bild steht, ist null (oder leeres Array).
+
+FORMATIERUNGS-REGELN:
+- Zutaten: quantity (Zahl) separat von unit (String). Brüche (½, ¼, 1 ½) strikt in Dezimalzahlen (0.5, 0.25, 1.5).
+- Einheiten: Normalisiere auf (g, ml, l, kg, EL, TL, Stück, Prise, Msp).
 - Zubereitungsschritte: pro erkennbarer Nummerierung oder Absatz EIN Schritt.
-- Zeiten in Minuten (ganze Zahl). "1 Stunde" = 60.
-- Ignoriere Werbung, Foto-Bildunterschriften, Einleitungstexte. Nur das Rezept selbst.
-- Denke dir NICHTS dazu aus. Was nicht auf dem Bild steht, ist null.
-- Antworte ausschließlich im vorgegebenen JSON-Schema. Kein Markdown, kein Prosa-Text.`;
+- Zeit: Alle Angaben strikt in Minuten (Integer). "1 Stunde" = 60.
+- Rauschen ignorieren: Keine Werbung, Einleitungstexte oder Bildunterschriften extrahieren.
+
+STRIKTE ANWEISUNG: Gib ausschließlich das rohe JSON-Objekt gemäß Schema zurück. Kein Markdown-Code-Block, kein Einleitungstext, keine Prosa.`;
+
+export const RECIPE_EXTRACTION_USER_PROMPT =
+  'Analysiere dieses Bild hochauflösend. Extrahiere alle rezeptrelevanten Informationen gemäß deiner System-Instruktion. Achte besonders auf schwache Handschriften oder verblassten Text und stelle sicher, dass die Zuordnung von Menge zu Zutat logisch korrekt ist.';
 
 // Gemini responseSchema (Subset von OpenAPI). Wird an GenerativeModel.generateContent
 // übergeben; Gemini respektiert die Struktur und liefert valides JSON.

src/routes/api/recipes/extract-from-photo/+server.ts

@@ -6,7 +6,11 @@ import { pickRandomPhrase } from '$lib/server/ai/description-phrases';
 import { createRateLimiter } from '$lib/server/ai/rate-limit';
 import type { Ingredient, Step } from '$lib/types';
 
-const MAX_BYTES = 8 * 1024 * 1024;
+// 20 MB deckt auch Tablet- und iPad-Pro-Fotos ab (oft 10-15 MB JPEG/HEIC).
+// Muss zusammen mit BODY_SIZE_LIMIT (docker-compose.prod.yml) hochgezogen werden --
+// SvelteKit rejected groessere Bodies frueher und wirft dann undurchsichtige
+// "Multipart erwartet"-Fehler.
+const MAX_BYTES = 20 * 1024 * 1024;
 const ALLOWED_MIME = new Set([
   'image/jpeg',
   'image/png',
@@ -41,16 +45,38 @@ export const POST: RequestHandler = async ({ request, getClientAddress }) => {
     );
   }
 
+  // Header-Snapshot fuer Diagnose beim Upload-Parse-Fehler. Wir loggen
+  // Content-Type, -Length und User-Agent — nichts, was Inhalt verraet.
+  const contentType = request.headers.get('content-type') ?? '(missing)';
+  const contentLength = request.headers.get('content-length') ?? '(missing)';
+  const userAgent = request.headers.get('user-agent')?.slice(0, 120) ?? '(missing)';
+
   let form: FormData;
   try {
     form = await request.formData();
-  } catch {
-    return errJson(400, 'BAD_REQUEST', 'Multipart body erwartet.');
+  } catch (e) {
+    const err = e as Error;
+    console.warn(
+      `[extract-from-photo] formData() failed: name=${err.name} msg=${err.message} ` +
+        `ct="${contentType}" len=${contentLength} ua="${userAgent}"`
+    );
+    return errJson(
+      400,
+      'BAD_REQUEST',
+      `Upload konnte nicht gelesen werden (${err.name}: ${err.message}).`
+    );
   }
   const photo = form.get('photo');
   if (!(photo instanceof Blob)) {
+    console.warn(
+      `[extract-from-photo] photo field missing or not a Blob. ct="${contentType}" ` +
+        `len=${contentLength} fields=${[...form.keys()].join(',')}`
+    );
     return errJson(400, 'BAD_REQUEST', 'Feld "photo" fehlt.');
   }
+  console.info(
+    `[extract-from-photo] received photo size=${photo.size} mime="${photo.type}" ua="${userAgent}"`
+  );
   if (photo.size > MAX_BYTES) {
     return errJson(
       413,
@@ -95,9 +121,11 @@ export const POST: RequestHandler = async ({ request, getClientAddress }) => {
             : e.code === 'AI_NOT_CONFIGURED'
               ? 503
               : 503;
-      // Nur Code + Meta loggen, niemals Prompt/Response-Inhalt.
+      // Nur Code + Meta + Error-Message loggen, niemals Prompt/Response-Inhalt.
+      // e.message enthaelt z.B. Zod-Validierungspfade oder "non-JSON output" --
+      // kein AI-Content, aber die Diagnose-Info, warum AI_FAILED kam.
       console.warn(
-        `[extract-from-photo] ${e.code} after ${Date.now() - startedAt}ms, ${preprocessed.buffer.byteLength} bytes`
+        `[extract-from-photo] ${e.code} after ${Date.now() - startedAt}ms, ${preprocessed.buffer.byteLength} bytes: ${e.message}`
       );
       return errJson(status, e.code, 'Die Bild-Analyse ist fehlgeschlagen.');
     }

src/routes/new/from-photo/+page.svelte

@@ -2,6 +2,7 @@
   import { goto } from '$app/navigation';
   import {
     Camera,
+    ImageUp,
     Loader2,
     Wand2,
     AlertTriangle,
@@ -17,6 +18,7 @@
 
   const store = new PhotoUploadStore();
   let saving = $state(false);
+  let cameraInput = $state<HTMLInputElement | null>(null);
   let fileInput = $state<HTMLInputElement | null>(null);
 
   function onPick(e: Event) {
@@ -85,20 +87,42 @@
       Fotografiere ein gedrucktes oder handgeschriebenes Rezept. Eine Seite,
       scharf, gut ausgeleuchtet.
     </p>
-    <button
-      type="button"
-      class="btn primary"
-      onclick={() => fileInput?.click()}
-      disabled={!network.online}
-    >
-      <Camera size={18} strokeWidth={2} />
-      <span>Foto wählen oder aufnehmen</span>
-    </button>
+    <div class="row">
+      <button
+        type="button"
+        class="btn primary"
+        onclick={() => cameraInput?.click()}
+        disabled={!network.online}
+      >
+        <Camera size={18} strokeWidth={2} />
+        <span>Kamera</span>
+      </button>
+      <button
+        type="button"
+        class="btn ghost"
+        onclick={() => fileInput?.click()}
+        disabled={!network.online}
+      >
+        <ImageUp size={18} strokeWidth={2} />
+        <span>Aus Dateien</span>
+      </button>
+    </div>
+    <!-- Zwei separate Inputs: capture="environment" oeffnet direkt die Kamera,
+         das andere zeigt den Datei-/Fotomediathek-Picker. Android-Chrome auf
+         Tablet zeigt sonst bei capture="environment" nur die Kamera; ohne
+         capture dagegen nur den Datei-Picker. Explizite Wahl ist eindeutig. -->
+    <input
+      bind:this={cameraInput}
+      type="file"
+      accept="image/*"
+      capture="environment"
+      hidden
+      onchange={onPick}
+    />
     <input
       bind:this={fileInput}
       type="file"
       accept="image/*"
-      capture="environment"
       hidden
       onchange={onPick}
     />

tests/integration/extract-from-photo.test.ts

@@ -70,8 +70,8 @@ describe('POST /api/recipes/extract-from-photo', () => {
     expect(body.recipe.id).toBeNull();
   });
 
-  it('413 when file exceeds 8 MB', async () => {
-    const big = Buffer.alloc(9 * 1024 * 1024);
+  it('413 when file exceeds 20 MB', async () => {
+    const big = Buffer.alloc(21 * 1024 * 1024);
     const fd = new FormData();
     fd.append('photo', new Blob([new Uint8Array(big)], { type: 'image/jpeg' }));
     // eslint-disable-next-line @typescript-eslint/no-explicit-any

vite.config.ts

@@ -3,6 +3,13 @@ import { defineConfig } from 'vitest/config';
 
 export default defineConfig({
   plugins: [sveltekit()],
+  // sharp muss extern bleiben: der Server-Bundle-Schritt kann sharp's
+  // dynamic-require fuer die native .node-Binary nicht aufloesen. Wenn
+  // sharp nicht gebundelt wird, laedt Node es zur Laufzeit regulaer aus
+  // node_modules/@img/sharp-linuxmusl-arm64, das dann funktioniert.
+  ssr: {
+    external: ['sharp']
+  },
   test: {
     include: ['tests/**/*.test.ts'],
     globals: false,