ImageResponse

يسمح لك مُنشئ ImageResponse بإنشاء صور ديناميكية باستخدام JSX وCSS. هذا مفيد لإنشاء صور وسائل التواصل الاجتماعي مثل صور Open Graph وبطاقات Twitter وغيرها.

الخيارات المتاحة لـ ImageResponse هي:

import { ImageResponse } from 'next/og'

new ImageResponse(
  element: ReactElement,
  options: {
    width?: number = 1200
    height?: number = 630
    emoji?: 'twemoji' | 'blobmoji' | 'noto' | 'openmoji' = 'twemoji',
    fonts?: {
      name: string,
      data: ArrayBuffer,
      weight: number,
      style: 'normal' | 'italic'
    }[]
    debug?: boolean = false

    // خيارات سيتم تمريرها إلى استجابة HTTP
    status?: number = 200
    statusText?: string
    headers?: Record<string, string>
  },
)

خصائص CSS المدعومة

يرجى الرجوع إلى توثيق Satori للحصول على قائمة بميزات HTML وCSS المدعومة.

سجل الإصدارات

الإصدارالتغييرات
v14.0.0تم نقل ImageResponse من next/server إلى next/og
v13.3.0يمكن استيراد ImageResponse من next/server.
v13.0.0تم تقديم ImageResponse عبر حزمة @vercel/og.