60 lines
1.7 KiB
TypeScript
60 lines
1.7 KiB
TypeScript
|
import { ImageResponse } from '@vercel/og';
|
|||
|
|
import { NextRequest } from 'next/server';
|
|||
|
|
|
|||
|
|
export const runtime = 'edge';
|
|||
|
|
|
|||
|
|
// 为静态导出生成参数
|
|||
|
|
export async function generateStaticParams() {
|
|||
|
|
// 生成常用的图片尺寸
|
|||
|
|
const commonSizes = [
|
|||
|
|
{ width: '400', height: '250' },
|
|||
|
|
{ width: '800', height: '500' },
|
|||
|
|
{ width: '1200', height: '600' },
|
|||
|
|
{ width: '600', height: '400' },
|
|||
|
|
{ width: '300', height: '200' },
|
|||
|
|
];
|
|||
|
|
|
|||
|
|
return commonSizes;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
export async function GET(
|
|||
|
|
req: NextRequest,
|
|||
|
|
{ params }: { params: { width: string; height: string } }
|
|||
|
|
) {
|
|||
|
|
try {
|
|||
|
|
// 从路径参数获取尺寸
|
|||
|
|
const width = parseInt(params.width || '400');
|
|||
|
|
const height = parseInt(params.height || '250');
|
|||
|
|
|
|||
|
|
return new ImageResponse(
|
|||
|
|
(
|
|||
|
|
<div
|
|||
|
|
style={{
|
|||
|
|
width: '100%',
|
|||
|
|
height: '100%',
|
|||
|
|
display: 'flex',
|
|||
|
|
flexDirection: 'column',
|
|||
|
|
alignItems: 'center',
|
|||
|
|
justifyContent: 'center',
|
|||
|
|
backgroundColor: '#f3f4f6',
|
|||
|
|
color: '#6b7280',
|
|||
|
|
fontSize: '24px',
|
|||
|
|
fontWeight: 'bold',
|
|||
|
|
}}
|
|||
|
|
data-oid="z3uc0gr"
|
|||
|
|
>
|
|||
|
|
<div data-oid="hrryby5">{`${width} × ${height}`}</div>
|
|||
|
|
</div>
|
|||
|
|
),
|
|||
|
|
|
|||
|
|
{
|
|||
|
|
width,
|
|||
|
|
height,
|
|||
|
|
},
|
|||
|
|
);
|
|||
|
|
} catch (e) {
|
|||
|
|
console.error(e);
|
|||
|
|
return new Response('Failed to generate image', { status: 500 });
|
|||
|
|
}
|
|||
|
|
}
|