Marco/infoalloggi-monorepo
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages 6 Wiki Activity Actions

Add Open Graph meta tags for improved SEO and social sharing

Browse source 
Implement API route for fetching images with caching support
Fix cover image URL handling in getAnnunciByCod function
This commit is contained in:
Marco Pedone 2025-08-08 10:27:21 +02:00
parent b23739b371
commit 8f629c272a
3 changed files with 41 additions and 2 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

9
apps/infoalloggi/src/pages/annuncio/[cod].tsx
View file

@ -56,6 +56,7 @@ import { TouchProvider } from "~/components/custom_ui/HybridTooltip";
import InformationBubble from "~/components/InformationBubble";
import TipologiaPosizioneEnum from "~/schemas/public/TipologiaPosizioneEnum";
import { useEffect, useState } from "react";
import { env } from "~/env.mjs";
type AnnuncioProps = {
cod: string;
@ -106,6 +107,12 @@ const AnnuncioDettaglio: NextPage<AnnuncioProps> = ({
<main>
<Head>
<title>{`${cod} | ${titolo}`}</title>
<meta property="og:url" content={window.location.href} />
<meta property="og:type" content="website" />
<meta
property="og:logo"
content={`${env.NEXT_PUBLIC_BASE_URL}/Infoalloggi.png`}
/>
{data.titolo_it && (
<meta
property="og:title"
@ -116,7 +123,7 @@ const AnnuncioDettaglio: NextPage<AnnuncioProps> = ({
{data.coverImage && (
<meta
property="og:image"
content={data.coverImage}
content={`${env.NEXT_PUBLIC_BASE_URL}/api/og/${data.coverImage}`}
key="image"
/>
)}

32
apps/infoalloggi/src/pages/api/og/[...slug].ts Normal file
View file

@ -0,0 +1,32 @@
import type { NextApiRequest, NextApiResponse } from "next";
export default async function handler(
req: NextApiRequest,
res: NextApiResponse,
) {
if (req.method !== "GET") {
return res.status(405).json({ error: "Method Not Allowed" });
}
const slug = req.query;
console.log("Fetching image:", slug);
const image = Array.isArray(slug.slug) ? slug.slug.join("/") : slug.slug;
if (typeof image !== "string") {
return res.status(400).json({ error: "Invalid image parameter" });
}
const imageUrl = `${process.env.BACKENDSERVER_URL}/images/get/${image}`;
try {
const response = await fetch(imageUrl);
if (!response.ok) {
return res
.status(response.status)
.json({ error: "Failed to fetch image" });
}
const imageBuffer = await response.arrayBuffer();
res.setHeader("Content-Type", "image/png");
res.setHeader("Cache-Control", "public, max-age=31536000, immutable");
res.send(Buffer.from(imageBuffer));
} catch (error) {
console.error("Error fetching image:", error);
return res.status(500).json({ error: "Internal Server Error" });
}
}

2
apps/infoalloggi/src/server/controllers/annunci.controller.ts
View file

@ -82,7 +82,7 @@ export const getAnnunciByCod = async ({
}
const coverImage = annuncio.url_immagini
? annuncio.url_immagini[0]
? createSrc(annuncio.url_immagini[0])
? annuncio.url_immagini[0]
: null
: null;