assetPrefix

注意：部署到 Vercel 会自动为你的 Next.js 项目配置全局 CDN。你无需手动设置 Asset Prefix。

须知：Next.js 9.5+ 增加了对可自定义的 Base Path 的支持，它更适合在类似 /docs 的子路径上托管你的应用程序。我们不建议你为此用例使用自定义 Asset Prefix。

设置 CDN

要设置 CDN，你可以设置 asset prefix 并配置你的 CDN 的源以解析到 Next.js 托管的域名。

打开 next.config.mjs 并根据阶段添加 assetPrefix 配置

next.config.mjs

// @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 将自动为它从 /_next/ 路径（.next/static/ 文件夹）加载的 JavaScript 和 CSS 文件使用你的 asset prefix。例如，使用上述配置，以下对 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 的请求，但它不影响以下路径

public 文件夹中的文件；如果你想通过 CDN 提供这些资源，你必须自己引入前缀
/_next/data/ 对 getServerSideProps 页面的请求。这些请求将始终针对主域名发出，因为它们不是静态的。
/_next/data/ 对 getStaticProps 页面的请求。这些请求将始终针对主域名发出，以支持增量静态生成，即使你没有使用它（为了保持一致性）。