netlify blobを使って保存

src/components/SEO/index.spec.tsx

@@ -84,7 +84,9 @@ describe("SEO", () => {
     expect(twitterCreator).toBe("@meitante1conan");
     expect(twitterTitle).toBe("testTitle");
     expect(twitterDescription).toBe("testDescription");
-    expect(twitterImage).toBe("https://example.com/test.png");
+    expect(twitterImage).toBe(
+      "https://blog.tubone-project24.xyz/ogp.png?title=testTitle"
+    );
   });
   it("should render metadata (not article)", () => {
     render(
@@ -166,6 +168,8 @@ describe("SEO", () => {
     expect(twitterTitle).toBe("testTitle");
     expect(twitterCreator).toBe("@meitante1conan");
     expect(twitterDescription).toBe("testDescription");
-    expect(twitterImage).toBe("https://example.com/test.png");
+    expect(twitterImage).toBe(
+      "https://blog.tubone-project24.xyz/ogp.png?title=testTitle"
+    );
   });
 });

src/components/SEO/index.tsx

@@ -98,6 +98,9 @@ const SEO = ({
   isPost,
   tag,
 }: Props) => {
+  const ogpImageLink = `https://blog.tubone-project24.xyz/ogp.png?title=${encodeURI(
+    title
+  )}`;
   return (
     <Helmet>
       <title>{title}</title>
@@ -139,7 +142,7 @@ const SEO = ({
       <meta name="twitter:creator" content="@meitante1conan" />
       <meta name="twitter:title" content={title} />
       <meta name="twitter:description" content={description} />
-      <meta name="twitter:image" content={image} />
+      <meta name="twitter:image" content={ogpImageLink} />
     </Helmet>
   );
 };