assetPrefix

ملاحظة: النشر على Vercel يقوم تلقائيًا بضبط شبكة توصيل محتوى (CDN) عالمية لمشروع Next.js الخاص بك. لا تحتاج إلى إعداد بادئة الأصول (Asset Prefix) يدويًا.

معلومة مفيدة: بدءًا من Next.js 9.5+ تمت إضافة دعم لـ مسار الأساس (Base Path) القابل للتخصيص، والذي يكون أكثر ملاءمة لاستضافة تطبيقك على مسار فرعي مثل /docs. لا ننصح باستخدام بادئة أصول مخصصة لهذا الغرض.

إعداد شبكة توصيل المحتوى (CDN)

لإعداد شبكة توصيل المحتوى (CDN)، يمكنك ضبط بادئة الأصول وتكوين أصل CDN الخاص بك ليحل إلى النطاق الذي يستضيف Next.js.

افتح ملف next.config.mjs وأضف تكوين assetPrefix بناءً على المرحلة:

// @ts-check
import { PHASE_DEVELOPMENT_SERVER } from 'next/constants'

export default (phase) => {
  const isDev = phase === PHASE_DEVELOPMENT_SERVER
  /**
   * @type {import('next').NextConfig}
   */
  const nextConfig = {
    assetPrefix: isDev ? undefined : 'https://cdn.mydomain.com',
  }
  return nextConfig
}

سيستخدم Next.js تلقائيًا بادئة الأصول الخاصة بك لملفات JavaScript و CSS التي يتم تحميلها من المسار /_next/ (مجلد .next/static/). على سبيل المثال، مع التكوين أعلاه، طلب جزء JS التالي:

/_next/static/chunks/4b9b41aaa062cbbfeff4add70f256968c51ece5d.4d708494b3aed70c04f0.js

سيصبح بدلاً من ذلك:

https://cdn.mydomain.com/_next/static/chunks/4b9b41aaa062cbbfeff4add70f256968c51ece5d.4d708494b3aed70c04f0.js

سيعتمد التكوين الدقيق لرفع ملفاتك إلى CDN معين على CDN الذي تختاره. المجلد الوحيد الذي تحتاج إلى استضافته على CDN الخاص بك هو محتويات .next/static/، والتي يجب رفعها كـ _next/static/ كما يشير عنوان URL أعلاه. لا ترفع بقية مجلد .next/ الخاص بك، حيث لا يجب تعريض كود الخادم الخاص بك والتكوينات الأخرى للعامة.

بينما تغطي assetPrefix طلبات _next/static، إلا أنها لا تؤثر على المسارات التالية:

• الملفات في مجلد public؛ إذا كنت تريد تقديم هذه الأصول عبر CDN، فسيتعين عليك إضافة البادئة بنفسك