Merge pull request #41 from abekoh/ogp

OGP画像生成できなくなった問題修正
abekoh · Nov 20, 2021 · 3eedc7a · 3eedc7a · vercel · Nov 20, 2021
2 parents f14aed7 + 1991771
commit 3eedc7a
Show file tree

Hide file tree

Showing 13 changed files with 147 additions and 81 deletions.
diff --git a/fonts/NotoSansJP-Black.otf → assets/NotoSansJP-Black.otf b/fonts/NotoSansJP-Black.otf → assets/NotoSansJP-Black.otf
diff --git a/fonts/NotoSansJP-Bold.otf → assets/NotoSansJP-Bold.otf b/fonts/NotoSansJP-Bold.otf → assets/NotoSansJP-Bold.otf
diff --git a/fonts/NotoSansJP-Light.otf → assets/NotoSansJP-Light.otf b/fonts/NotoSansJP-Light.otf → assets/NotoSansJP-Light.otf
diff --git a/fonts/NotoSansJP-Medium.otf → assets/NotoSansJP-Medium.otf b/fonts/NotoSansJP-Medium.otf → assets/NotoSansJP-Medium.otf
diff --git a/fonts/NotoSansJP-Regular.otf → assets/NotoSansJP-Regular.otf b/fonts/NotoSansJP-Regular.otf → assets/NotoSansJP-Regular.otf
diff --git a/fonts/NotoSansJP-Thin.otf → assets/NotoSansJP-Thin.otf b/fonts/NotoSansJP-Thin.otf → assets/NotoSansJP-Thin.otf
diff --git a/fonts/OFL.txt → assets/OFL.txt b/fonts/OFL.txt → assets/OFL.txt
diff --git a/assets/logo.png b/assets/logo.png
diff --git a/next.config.js b/next.config.js
@@ -20,4 +20,5 @@ module.exports = {
       },
     ];
   },
+  outputFileTracing: true,
 };
diff --git a/package.json b/package.json
@@ -29,7 +29,7 @@
     "canvas": "^2.7.0",
     "jsonld": "^5.2.0",
     "moment": "^2.29.1",
-    "next": "11.1.1",
+    "next": "12.0.4",
     "prismjs": "^1.23.0",
     "react": "17.0.1",
     "react-dom": "17.0.1",

diff --git a/src/pages/api/ogp-images/[postid]/index.ts b/src/pages/api/ogp-images/[postid]/index.ts
@@ -26,7 +26,7 @@ const generateOgpImage = async (
   // setup
   const canvas = createCanvas(width, height);
   const ctx = canvas.getContext('2d');
-  registerFont(path.resolve('./fonts/NotoSansJP-Medium.otf'), {
+  registerFont(path.resolve(process.cwd(), 'assets', 'NotoSansJP-Medium.otf'), {
     family: 'Noto Sans JP',
   });
   const fontFamilyName = "'Noto Sans JP'";
@@ -51,7 +51,9 @@ const generateOgpImage = async (
   );
 
   // logo
-  const logoImage = await loadImage(path.resolve('./public/logo.png'));
+  const logoImage = await loadImage(
+    path.resolve(process.cwd(), 'assets', 'logo.png'),
+  );
   ctx.drawImage(
     logoImage,
     width - padding - margin - 380,

diff --git a/vercel.json b/vercel.json
@@ -0,0 +1,7 @@
+{
+  "functions": {
+    "pages/api/ogp-images/[postid]/index.ts": {
+      "includeFiles": "assets/**"
+    }
+  }
+}
diff --git a/yarn.lock b/yarn.lock
-Original file line number
+Diff line change
@@ Expand Up / @@ -20,4 +20,5 @@ module.exports = { @@
           },
         ];
       },
+      outputFileTracing: true,
     };