Commit 132042dd authored by Văn Hoàng's avatar Văn Hoàng

Revert "feat: tao dynamic OG image 1200x630 bang next/og - auto fit anh bai viet + title overlay"

This reverts commit 4b8920f5.
parent 800bd21c
...@@ -3,6 +3,7 @@ import links from "@links/index"; ...@@ -3,6 +3,7 @@ import links from "@links/index";
import { import {
fetchDynamicPostById, fetchDynamicPostById,
fetchDynamicPostByExternalLink, fetchDynamicPostByExternalLink,
getDynamicPostSeoImage,
getDynamicPostExcerpt, getDynamicPostExcerpt,
stripHtml, stripHtml,
} from "./templates/data"; } from "./templates/data";
...@@ -45,6 +46,7 @@ export async function generateMetadata({ ...@@ -45,6 +46,7 @@ export async function generateMetadata({
stripHtml(post.summary) || stripHtml(post.summary) ||
getDynamicPostExcerpt(post).slice(0, 160) || getDynamicPostExcerpt(post).slice(0, 160) ||
"Tin tức từ VCCI HCM"; "Tin tức từ VCCI HCM";
const imageUrl = getDynamicPostSeoImage(post);
const articleUrl = `${links.siteURL.replace(/\/+$/, "")}${path}${ const articleUrl = `${links.siteURL.replace(/\/+$/, "")}${path}${
postId || categoryIdParam postId || categoryIdParam
? `?${new URLSearchParams({ ? `?${new URLSearchParams({
...@@ -54,11 +56,6 @@ export async function generateMetadata({ ...@@ -54,11 +56,6 @@ export async function generateMetadata({
: "" : ""
}`; }`;
const ogImageParams = new URLSearchParams();
if (postId) ogImageParams.set("id", postId);
if (!postId && slug?.length) ogImageParams.set("slug", slug.join("/"));
const ogImageUrl = `/api/og-post?${ogImageParams.toString()}`;
return { return {
title, title,
description, description,
...@@ -70,7 +67,7 @@ export async function generateMetadata({ ...@@ -70,7 +67,7 @@ export async function generateMetadata({
siteName: "VCCI HCM", siteName: "VCCI HCM",
images: [ images: [
{ {
url: ogImageUrl, url: imageUrl,
width: 1200, width: 1200,
height: 630, height: 630,
alt: title, alt: title,
...@@ -83,7 +80,7 @@ export async function generateMetadata({ ...@@ -83,7 +80,7 @@ export async function generateMetadata({
card: "summary_large_image", card: "summary_large_image",
title, title,
description, description,
images: [ogImageUrl], images: [imageUrl],
}, },
}; };
} }
......
import { ImageResponse } from "next/og";
import {
fetchDynamicPostById,
fetchDynamicPostByExternalLink,
getDynamicPostSeoImage,
getDynamicPostExcerpt,
stripHtml,
} from "@/app/(main)/[...slug]/templates/data";
export const runtime = "nodejs";
export const revalidate = 3600;
export async function GET(request: Request) {
try {
const { searchParams } = new URL(request.url);
const id = searchParams.get("id") ?? "";
const slug = searchParams.get("slug") ?? "";
let post = null;
try {
post = id
? await fetchDynamicPostById(id)
: slug
? await fetchDynamicPostByExternalLink(`/${slug}`)
: null;
} catch {
post = null;
}
const title = post?.title ?? "VCCI HCM";
const description =
stripHtml(post?.summary) ||
(post ? getDynamicPostExcerpt(post).slice(0, 120) : "");
const imageUrl = post ? getDynamicPostSeoImage(post) : "";
const hasImage = imageUrl && imageUrl !== "/thumbnail.png";
return new ImageResponse(
(
<div
style={{
display: "flex",
flexDirection: "column",
width: 1200,
height: 630,
backgroundColor: "#0a4d8c",
position: "relative",
fontFamily: "sans-serif",
}}
>
{hasImage && (
<img
src={imageUrl}
style={{
position: "absolute",
top: 0,
left: 0,
width: 1200,
height: 630,
objectFit: "cover",
}}
/>
)}
</div>
),
{
width: 1200,
height: 630,
},
);
} catch {
return new ImageResponse(
(
<div
style={{
display: "flex",
alignItems: "center",
justifyContent: "center",
width: 1200,
height: 630,
backgroundColor: "#0a4d8c",
color: "#ffffff",
fontSize: 48,
fontWeight: 700,
fontFamily: "sans-serif",
}}
>
VCCI-HCM
</div>
),
{ width: 1200, height: 630 },
);
}
}
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment