Create pretty route for outfit images

This is mostly for decoupling's sake: I want pretty outfit URLs that aren't dependent on the `/api/outfitImage` path structure, so that we can serve them as ~permanent pretty URLs that don't actually indicate where or how the image is stored.

api/outfitPageSSR.js

@@ -76,12 +76,14 @@ async function handle(req, res) {
   const updatedAtTimestamp = Math.floor(
     new Date(outfit.updatedAt).getTime() / 1000
   );
-  const outfitUrl = `https://impress-2020.openneo.net/outfits/${encodeURIComponent(
+  const outfitUrl =
-    outfit.id
+    `https://impress-2020.openneo.net/outfits` +
-  )}`;
+    `/${encodeURIComponent(outfit.id)}`;
-  const imageUrl = `https://impress-2020.openneo.net/api/outfitImage?size=600&id=${encodeURIComponent(
+  const imageUrl =
-    outfit.id
+    `https://impress-2020.openneo.net/outfits` +
-  )}&updatedAt=${updatedAtTimestamp}`;
+    `/${encodeURIComponent(outfit.id)}` +
+    `/v/${encodeURIComponent(updatedAtTimestamp)}` +
+    `/600.png`;
   const metaTags = `
     <meta property="og:title" content="${escapeHtml(outfit.name)}">
     <meta property="og:type" content="website">

vercel.json

@@ -1,7 +1,11 @@
 {
   "routes": [
+    {
+      "src": "/outfits/(?<id>[^/]+)/v/(?<updatedAt>[^/]+)/(?<size>150|300|600).png",
+      "dest": "/api/outfitImage.js?size=$size&id=$id&updatedAt=$updatedAt"
+    },
     { "src": "/outfits/new(\\?|$)", "dest": "/index.html" },
-    { "src": "/outfits/(?<id>[^/]*)", "dest": "/api/outfitPageSSR.js?id=$id" },
+    { "src": "/outfits/(?<id>[^/]+)", "dest": "/api/outfitPageSSR.js?id=$id" },
     {
       "handle": "filesystem"
     },