fix: escape og image url query string

This commit fixes a bug that caused some og image URLs to not work correctly because of escaping characters like "&". The fix involves escaping the query string and putting it in another query parameter "q" and then unescaping it on the API side and extracting the original parameters.
This commit is contained in:
Hossein Mehrabi 2023-12-07 03:13:57 +03:30
parent d701604586
commit 795ad26e40
No known key found for this signature in database
GPG Key ID: 45C04964191AFAA1
2 changed files with 6 additions and 4 deletions

View File

@ -11,8 +11,6 @@ export const config = {
// Doc: https://vercel.com/docs/concepts/functions/edge-functions/og-image-generation/og-image-examples#using-a-local-image
// Font: https://vercel.com/docs/functions/edge-functions/og-image-generation/og-image-examples#using-a-custom-font
export default async function handler(request: NextRequest) {
const { href } = request.nextUrl
const lora = await fetch(
new URL('../../../assets/Lora-Regular.ttf', import.meta.url),
).then((res) => res.arrayBuffer())
@ -21,7 +19,9 @@ export default async function handler(request: NextRequest) {
new URL('../../../assets/Inter-Regular.ttf', import.meta.url),
).then((res) => res.arrayBuffer())
const searchParams = new URL(href).searchParams
const searchParams = new URLSearchParams(
decodeURIComponent(request.nextUrl.searchParams.get('q') || ''),
)
const contentType = searchParams.get('contentType')
const title =
contentType == null

View File

@ -15,7 +15,7 @@ export const getOpenGraphImageUrl = ({
pagePath?: string | null
}) => {
const url = new URL('/api/og', getWebsiteUrl())
const searchParams = url.searchParams
const searchParams = new URLSearchParams()
title && searchParams.set('title', title)
imageUrl && searchParams.set('image', imageUrl || '')
@ -23,5 +23,7 @@ export const getOpenGraphImageUrl = ({
date && searchParams.set('date', date || '')
pagePath && searchParams.set('pagePath', pagePath || '')
url.searchParams.set('q', encodeURIComponent(searchParams.toString()))
return url.toString()
}