feat(api): change route and allow choosing the format

2024-09-29 22:38:01 +02:00
parent 42a6b3c2df
commit 58d8342538
3 changed files with 352 additions and 10 deletions
--- a/package.json
+++ b/package.json
@@ -16,6 +16,7 @@
    "canvas": "^2.11.2",
    "nuxt": "^3.13.0",
    "qrcode": "^1.5.4",
+    "sharp": "^0.33.5",
    "vue": "latest",
    "vue-router": "latest",
    "zod": "^3.23.8"
--- a/pnpm-lock.yaml
+++ b/pnpm-lock.yaml
@@ -19,6 +19,9 @@ importers:
      qrcode:
        specifier: ^1.5.4
        version: 1.5.4
+      sharp:
+        specifier: ^0.33.5
+        version: 0.33.5
      vue:
        specifier: latest
        version: 3.5.10(typescript@5.6.2)
@@ -305,6 +308,12 @@ packages:
      }
    engines: { node: ">=16.13" }

+  "@emnapi/runtime@1.2.0":
+    resolution:
+      {
+        integrity: sha512-bV21/9LQmcQeCPEg3BDFtvwL6cwiTMksYNWQQ4KOxCZikEGalWtenoZ0wCiukJINlGCIi2KXx01g4FoH/LxpzQ==,
+      }
+
  "@es-joy/jsdoccomment@0.48.0":
    resolution:
      {
@@ -1044,6 +1053,168 @@ packages:
      }
    engines: { node: ">=18.18" }

+  "@img/sharp-darwin-arm64@0.33.5":
+    resolution:
+      {
+        integrity: sha512-UT4p+iz/2H4twwAoLCqfA9UH5pI6DggwKEGuaPy7nCVQ8ZsiY5PIcrRvD1DzuY3qYL07NtIQcWnBSY/heikIFQ==,
+      }
+    engines: { node: ^18.17.0 || ^20.3.0 || >=21.0.0 }
+    cpu: [arm64]
+    os: [darwin]
+
+  "@img/sharp-darwin-x64@0.33.5":
+    resolution:
+      {
+        integrity: sha512-fyHac4jIc1ANYGRDxtiqelIbdWkIuQaI84Mv45KvGRRxSAa7o7d1ZKAOBaYbnepLC1WqxfpimdeWfvqqSGwR2Q==,
+      }
+    engines: { node: ^18.17.0 || ^20.3.0 || >=21.0.0 }
+    cpu: [x64]
+    os: [darwin]
+
+  "@img/sharp-libvips-darwin-arm64@1.0.4":
+    resolution:
+      {
+        integrity: sha512-XblONe153h0O2zuFfTAbQYAX2JhYmDHeWikp1LM9Hul9gVPjFY427k6dFEcOL72O01QxQsWi761svJ/ev9xEDg==,
+      }
+    cpu: [arm64]
+    os: [darwin]
+
+  "@img/sharp-libvips-darwin-x64@1.0.4":
+    resolution:
+      {
+        integrity: sha512-xnGR8YuZYfJGmWPvmlunFaWJsb9T/AO2ykoP3Fz/0X5XV2aoYBPkX6xqCQvUTKKiLddarLaxpzNe+b1hjeWHAQ==,
+      }
+    cpu: [x64]
+    os: [darwin]
+
+  "@img/sharp-libvips-linux-arm64@1.0.4":
+    resolution:
+      {
+        integrity: sha512-9B+taZ8DlyyqzZQnoeIvDVR/2F4EbMepXMc/NdVbkzsJbzkUjhXv/70GQJ7tdLA4YJgNP25zukcxpX2/SueNrA==,
+      }
+    cpu: [arm64]
+    os: [linux]
+
+  "@img/sharp-libvips-linux-arm@1.0.5":
+    resolution:
+      {
+        integrity: sha512-gvcC4ACAOPRNATg/ov8/MnbxFDJqf/pDePbBnuBDcjsI8PssmjoKMAz4LtLaVi+OnSb5FK/yIOamqDwGmXW32g==,
+      }
+    cpu: [arm]
+    os: [linux]
+
+  "@img/sharp-libvips-linux-s390x@1.0.4":
+    resolution:
+      {
+        integrity: sha512-u7Wz6ntiSSgGSGcjZ55im6uvTrOxSIS8/dgoVMoiGE9I6JAfU50yH5BoDlYA1tcuGS7g/QNtetJnxA6QEsCVTA==,
+      }
+    cpu: [s390x]
+    os: [linux]
+
+  "@img/sharp-libvips-linux-x64@1.0.4":
+    resolution:
+      {
+        integrity: sha512-MmWmQ3iPFZr0Iev+BAgVMb3ZyC4KeFc3jFxnNbEPas60e1cIfevbtuyf9nDGIzOaW9PdnDciJm+wFFaTlj5xYw==,
+      }
+    cpu: [x64]
+    os: [linux]
+
+  "@img/sharp-libvips-linuxmusl-arm64@1.0.4":
+    resolution:
+      {
+        integrity: sha512-9Ti+BbTYDcsbp4wfYib8Ctm1ilkugkA/uscUn6UXK1ldpC1JjiXbLfFZtRlBhjPZ5o1NCLiDbg8fhUPKStHoTA==,
+      }
+    cpu: [arm64]
+    os: [linux]
+
+  "@img/sharp-libvips-linuxmusl-x64@1.0.4":
+    resolution:
+      {
+        integrity: sha512-viYN1KX9m+/hGkJtvYYp+CCLgnJXwiQB39damAO7WMdKWlIhmYTfHjwSbQeUK/20vY154mwezd9HflVFM1wVSw==,
+      }
+    cpu: [x64]
+    os: [linux]
+
+  "@img/sharp-linux-arm64@0.33.5":
+    resolution:
+      {
+        integrity: sha512-JMVv+AMRyGOHtO1RFBiJy/MBsgz0x4AWrT6QoEVVTyh1E39TrCUpTRI7mx9VksGX4awWASxqCYLCV4wBZHAYxA==,
+      }
+    engines: { node: ^18.17.0 || ^20.3.0 || >=21.0.0 }
+    cpu: [arm64]
+    os: [linux]
+
+  "@img/sharp-linux-arm@0.33.5":
+    resolution:
+      {
+        integrity: sha512-JTS1eldqZbJxjvKaAkxhZmBqPRGmxgu+qFKSInv8moZ2AmT5Yib3EQ1c6gp493HvrvV8QgdOXdyaIBrhvFhBMQ==,
+      }
+    engines: { node: ^18.17.0 || ^20.3.0 || >=21.0.0 }
+    cpu: [arm]
+    os: [linux]
+
+  "@img/sharp-linux-s390x@0.33.5":
+    resolution:
+      {
+        integrity: sha512-y/5PCd+mP4CA/sPDKl2961b+C9d+vPAveS33s6Z3zfASk2j5upL6fXVPZi7ztePZ5CuH+1kW8JtvxgbuXHRa4Q==,
+      }
+    engines: { node: ^18.17.0 || ^20.3.0 || >=21.0.0 }
+    cpu: [s390x]
+    os: [linux]
+
+  "@img/sharp-linux-x64@0.33.5":
+    resolution:
+      {
+        integrity: sha512-opC+Ok5pRNAzuvq1AG0ar+1owsu842/Ab+4qvU879ippJBHvyY5n2mxF1izXqkPYlGuP/M556uh53jRLJmzTWA==,
+      }
+    engines: { node: ^18.17.0 || ^20.3.0 || >=21.0.0 }
+    cpu: [x64]
+    os: [linux]
+
+  "@img/sharp-linuxmusl-arm64@0.33.5":
+    resolution:
+      {
+        integrity: sha512-XrHMZwGQGvJg2V/oRSUfSAfjfPxO+4DkiRh6p2AFjLQztWUuY/o8Mq0eMQVIY7HJ1CDQUJlxGGZRw1a5bqmd1g==,
+      }
+    engines: { node: ^18.17.0 || ^20.3.0 || >=21.0.0 }
+    cpu: [arm64]
+    os: [linux]
+
+  "@img/sharp-linuxmusl-x64@0.33.5":
+    resolution:
+      {
+        integrity: sha512-WT+d/cgqKkkKySYmqoZ8y3pxx7lx9vVejxW/W4DOFMYVSkErR+w7mf2u8m/y4+xHe7yY9DAXQMWQhpnMuFfScw==,
+      }
+    engines: { node: ^18.17.0 || ^20.3.0 || >=21.0.0 }
+    cpu: [x64]
+    os: [linux]
+
+  "@img/sharp-wasm32@0.33.5":
+    resolution:
+      {
+        integrity: sha512-ykUW4LVGaMcU9lu9thv85CbRMAwfeadCJHRsg2GmeRa/cJxsVY9Rbd57JcMxBkKHag5U/x7TSBpScF4U8ElVzg==,
+      }
+    engines: { node: ^18.17.0 || ^20.3.0 || >=21.0.0 }
+    cpu: [wasm32]
+
+  "@img/sharp-win32-ia32@0.33.5":
+    resolution:
+      {
+        integrity: sha512-T36PblLaTwuVJ/zw/LaH0PdZkRz5rd3SmMHX8GSmR7vtNSP5Z6bQkExdSK7xGWyxLw4sUknBuugTelgw2faBbQ==,
+      }
+    engines: { node: ^18.17.0 || ^20.3.0 || >=21.0.0 }
+    cpu: [ia32]
+    os: [win32]
+
+  "@img/sharp-win32-x64@0.33.5":
+    resolution:
+      {
+        integrity: sha512-MpY/o8/8kj+EcnxwvrP4aTJSWw/aZ7JIGR4aBeZkZw5B7/Jn+tY9/VNwtcoGmdT7GfggGIU4kygOMSbYnOrAbg==,
+      }
+    engines: { node: ^18.17.0 || ^20.3.0 || >=21.0.0 }
+    cpu: [x64]
+    os: [win32]
+
  "@ioredis/commands@1.2.0":
    resolution:
      {
@@ -2449,6 +2620,12 @@ packages:
        integrity: sha512-dOy+3AuW3a2wNbZHIuMZpTcgjGuLU/uBL/ubcZF9OXbDo8ff4O8yVp5Bf0efS8uEoYo5q4Fx7dY9OgQGXgAsQA==,
      }

+  color-string@1.9.1:
+    resolution:
+      {
+        integrity: sha512-shrVawQFojnZv6xM40anx4CkoDP+fZsw/ZerEMsW/pyzsRbElpsL/DBVW7q3ExxwusdNXI3lXpuhEZkzs8p5Eg==,
+      }
+
  color-support@1.1.3:
    resolution:
      {
@@ -2456,6 +2633,13 @@ packages:
      }
    hasBin: true

+  color@4.2.3:
+    resolution:
+      {
+        integrity: sha512-1rXeuUUiGGrykh+CeBdu5Ie7OJwinCgQY0bc7GCRxy5xVHy+moaqkpL/jqQq0MtQOeYcrqEz4abc5f0KtU7W4A==,
+      }
+    engines: { node: ">=12.5.0" }
+
  colord@2.9.3:
    resolution:
      {
@@ -3811,6 +3995,12 @@ packages:
        integrity: sha512-zz06S8t0ozoDXMG+ube26zeCTNXcKIPJZJi8hBrF4idCLms4CG9QtK7qBl1boi5ODzFpjswb5JPmHCbMpjaYzg==,
      }

+  is-arrayish@0.3.2:
+    resolution:
+      {
+        integrity: sha512-eVRqCvVlZbuw3GrM63ovNSNAeA1K16kaR/LRY/92w0zxQ5/1YzwblUX652i4Xs9RwAGjW9d9y6X88t8OaAJfWQ==,
+      }
+
  is-binary-path@2.1.0:
    resolution:
      {
@@ -5526,6 +5716,13 @@ packages:
        integrity: sha512-E5LDX7Wrp85Kil5bhZv46j8jOeboKq5JMmYM3gVGdGH8xFpPWXUMsNrlODCrkoxMEeNi/XZIwuRvY4XNwYMJpw==,
      }

+  sharp@0.33.5:
+    resolution:
+      {
+        integrity: sha512-haPVm1EkS9pgvHrQ/F3Xy+hgcuMV0Wm9vfIBSiwZ05k+xgb0PkBQpGsAA/oWdDobNaZTH5ppvHtzCFbnSEwHVw==,
+      }
+    engines: { node: ^18.17.0 || ^20.3.0 || >=21.0.0 }
+
  shebang-command@2.0.0:
    resolution:
      {
@@ -5577,6 +5774,12 @@ packages:
        integrity: sha512-ivHoFS9Yi9GY49ogc6/YAi3Fl9ROnF4VyubNylgCkA+RVqLaKWnDSzXOVzya8csELIaWaYNutsEuAhZrtOjozA==,
      }

+  simple-swizzle@0.2.2:
+    resolution:
+      {
+        integrity: sha512-JA//kQgZtbuY83m+xT+tXJkmJncGMTFT+C+g2h2R9uxkYIrE2yy9sgmcLhCnw57/WSD+Eh3J97FPEDFnbXnDUg==,
+      }
+
  sirv@2.0.4:
    resolution:
      {
@@ -6805,6 +7008,11 @@ snapshots:
    dependencies:
      mime: 3.0.0

+  "@emnapi/runtime@1.2.0":
+    dependencies:
+      tslib: 2.7.0
+    optional: true
+
  "@es-joy/jsdoccomment@0.48.0":
    dependencies:
      comment-parser: 1.4.1
@@ -7101,6 +7309,81 @@ snapshots:

  "@humanwhocodes/retry@0.3.0": {}

+  "@img/sharp-darwin-arm64@0.33.5":
+    optionalDependencies:
+      "@img/sharp-libvips-darwin-arm64": 1.0.4
+    optional: true
+
+  "@img/sharp-darwin-x64@0.33.5":
+    optionalDependencies:
+      "@img/sharp-libvips-darwin-x64": 1.0.4
+    optional: true
+
+  "@img/sharp-libvips-darwin-arm64@1.0.4":
+    optional: true
+
+  "@img/sharp-libvips-darwin-x64@1.0.4":
+    optional: true
+
+  "@img/sharp-libvips-linux-arm64@1.0.4":
+    optional: true
+
+  "@img/sharp-libvips-linux-arm@1.0.5":
+    optional: true
+
+  "@img/sharp-libvips-linux-s390x@1.0.4":
+    optional: true
+
+  "@img/sharp-libvips-linux-x64@1.0.4":
+    optional: true
+
+  "@img/sharp-libvips-linuxmusl-arm64@1.0.4":
+    optional: true
+
+  "@img/sharp-libvips-linuxmusl-x64@1.0.4":
+    optional: true
+
+  "@img/sharp-linux-arm64@0.33.5":
+    optionalDependencies:
+      "@img/sharp-libvips-linux-arm64": 1.0.4
+    optional: true
+
+  "@img/sharp-linux-arm@0.33.5":
+    optionalDependencies:
+      "@img/sharp-libvips-linux-arm": 1.0.5
+    optional: true
+
+  "@img/sharp-linux-s390x@0.33.5":
+    optionalDependencies:
+      "@img/sharp-libvips-linux-s390x": 1.0.4
+    optional: true
+
+  "@img/sharp-linux-x64@0.33.5":
+    optionalDependencies:
+      "@img/sharp-libvips-linux-x64": 1.0.4
+    optional: true
+
+  "@img/sharp-linuxmusl-arm64@0.33.5":
+    optionalDependencies:
+      "@img/sharp-libvips-linuxmusl-arm64": 1.0.4
+    optional: true
+
+  "@img/sharp-linuxmusl-x64@0.33.5":
+    optionalDependencies:
+      "@img/sharp-libvips-linuxmusl-x64": 1.0.4
+    optional: true
+
+  "@img/sharp-wasm32@0.33.5":
+    dependencies:
+      "@emnapi/runtime": 1.2.0
+    optional: true
+
+  "@img/sharp-win32-ia32@0.33.5":
+    optional: true
+
+  "@img/sharp-win32-x64@0.33.5":
+    optional: true
+
  "@ioredis/commands@1.2.0": {}

  "@isaacs/cliui@8.0.2":
@@ -8232,8 +8515,18 @@ snapshots:

  color-name@1.1.4: {}

+  color-string@1.9.1:
+    dependencies:
+      color-name: 1.1.4
+      simple-swizzle: 0.2.2
+
  color-support@1.1.3: {}

+  color@4.2.3:
+    dependencies:
+      color-convert: 2.0.1
+      color-string: 1.9.1
+
  colord@2.9.3: {}

  commander@2.20.3: {}
@@ -9121,6 +9414,8 @@ snapshots:

  is-arrayish@0.2.1: {}

+  is-arrayish@0.3.2: {}
+
  is-binary-path@2.1.0:
    dependencies:
      binary-extensions: 2.3.0
@@ -10227,6 +10522,32 @@ snapshots:

  setprototypeof@1.2.0: {}

+  sharp@0.33.5:
+    dependencies:
+      color: 4.2.3
+      detect-libc: 2.0.3
+      semver: 7.6.3
+    optionalDependencies:
+      "@img/sharp-darwin-arm64": 0.33.5
+      "@img/sharp-darwin-x64": 0.33.5
+      "@img/sharp-libvips-darwin-arm64": 1.0.4
+      "@img/sharp-libvips-darwin-x64": 1.0.4
+      "@img/sharp-libvips-linux-arm": 1.0.5
+      "@img/sharp-libvips-linux-arm64": 1.0.4
+      "@img/sharp-libvips-linux-s390x": 1.0.4
+      "@img/sharp-libvips-linux-x64": 1.0.4
+      "@img/sharp-libvips-linuxmusl-arm64": 1.0.4
+      "@img/sharp-libvips-linuxmusl-x64": 1.0.4
+      "@img/sharp-linux-arm": 0.33.5
+      "@img/sharp-linux-arm64": 0.33.5
+      "@img/sharp-linux-s390x": 0.33.5
+      "@img/sharp-linux-x64": 0.33.5
+      "@img/sharp-linuxmusl-arm64": 0.33.5
+      "@img/sharp-linuxmusl-x64": 0.33.5
+      "@img/sharp-wasm32": 0.33.5
+      "@img/sharp-win32-ia32": 0.33.5
+      "@img/sharp-win32-x64": 0.33.5
+
  shebang-command@2.0.0:
    dependencies:
      shebang-regex: 3.0.0
@@ -10255,6 +10576,10 @@ snapshots:
    transitivePeerDependencies:
      - supports-color

+  simple-swizzle@0.2.2:
+    dependencies:
+      is-arrayish: 0.3.2
+
  sirv@2.0.4:
    dependencies:
      "@polka/url": 1.0.0-next.28
--- a/server/routes/png.ts
+++ b/server/routes/png.ts
@@ -2,30 +2,39 @@ import { createCanvas, loadImage } from "canvas";
 import QRCode from "qrcode";
 import { z } from "zod";
 import { resolve } from "path";
+import sharp from "sharp";

 const time = (label: string) => {
  const start = performance.now();
  return () => {
-    console.log(label, "\t", performance.now() - start);
+    console.log(`${label}\t${performance.now() - start}`);
  };
 };

-const querySchema = z.object({
+const IMAGE_FORMATS = ["jpeg", "png", "webp"] as const;
+
+const settingsSchema = z.object({
+  format: z.enum(IMAGE_FORMATS).default("png"),
  logo: z.string().min(1),
  content: z.string().min(1),
 });

 export default defineEventHandler(async (event) => {
-  const parsed = querySchema.safeParse(getQuery(event));
+  const query = getQuery(event);
+
+  const parsed = settingsSchema.safeParse(query);
  if (!parsed.success) {
    return createError({
      status: 400,
-      message: `Invalid request query: missing ${parsed.error.errors.map((x) => x.path.join(".")).join(", ")}`,
+      data: {
+        errors: Object.fromEntries(
+          parsed.error.errors.map((x) => [x.path.join("."), x.message]),
+        ),
+      },
    });
  }

-  const logo = parsed.data.logo;
-  const text = parsed.data.content;
+  const { format, logo, content } = parsed.data;

  const tt = time("total");
  let t;
@@ -35,7 +44,7 @@ export default defineEventHandler(async (event) => {

  t = time("render");
  const canvas = createCanvas(SIZE, SIZE);
-  await QRCode.toCanvas(canvas, text, {
+  await QRCode.toCanvas(canvas, content, {
    errorCorrectionLevel: "H",
    width: SIZE,
    margin: 1,
@@ -43,7 +52,7 @@ export default defineEventHandler(async (event) => {
  t();

  t = time("count");
-  const qrCode = QRCode.create(text, { errorCorrectionLevel: "H" });
+  const qrCode = QRCode.create(content, { errorCorrectionLevel: "H" });
  const moduleCount = qrCode.modules.size + 2;
  t();

@@ -75,11 +84,18 @@ export default defineEventHandler(async (event) => {
  t();

  t = time("buffer");
-  const image = canvas.toBuffer();
+  let image = canvas.toBuffer();
  t();

+  if (format !== "png") {
+    t = time("convert");
+    image = await sharp(image).toFormat(format).toBuffer();
+    t();
+  }
+
  tt();

-  event.node.res.setHeader("Content-Type", "image/png");
+  event.node.res.setHeader("Content-Type", `image/${format}`);
  return image;
 });
+