assetPrefix
Внимание: Развертывание на Vercel автоматически настраивает глобальный CDN для вашего проекта Next.js. Вам не нужно вручную настраивать Asset Prefix.
Полезно знать: В Next.js 9.5+ добавлена поддержка настраиваемого Base Path, который лучше подходит для размещения вашего приложения в подкаталоге, например
/docs
. Мы не рекомендуем использовать пользовательский Asset Prefix для этого случая.
Настройка CDN
Для настройки CDN вы можете задать префикс ресурсов (asset prefix) и настроить источник 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, вам нужно будет добавить префикс самостоятельно
- Запросы
/_next/data/
для страниц сgetServerSideProps
. Эти запросы всегда будут выполняться против основного домена, так как они не статические. - Запросы
/_next/data/
для страниц сgetStaticProps
. Эти запросы всегда будут выполняться против основного домена для поддержки Инкрементальной статической генерации (ISG), даже если вы её не используете (для единообразия).