注意:部署到 Vercel 会自动为你的 Next.js 项目配置一个全球 CDN。
你无需手动设置 Asset Prefix。
注意:部署到 Vercel 会自动为你的 Next.js 项目配置一个全球 CDN。
你无需手动设置 Asset Prefix。
小贴士:Next.js 9.5+ 新增了对可自定义的 基础路径 的支持,它更
适合将你的应用托管在/docs这样的子路径上。
我们不建议你为此用例使用自定义的 Asset Prefix。
要设置 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 会自动使用你的 asset prefix 用于从 /_next/ 路径(即 .next/static/ 文件夹)加载的 JavaScript 和 CSS 文件。例如,通过上述配置,对一个 JS chunk 的以下请求:
/_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 的请求,但它不影响以下路径: