0. 准备

1. 创建 Next.js 应用

根据 Next - Installation 文档生成 Next 项目,修改 next.config.ts

const nextConfig: NextConfig = {
  output: 'standalone', 
  async headers() {
    return [
      {
        source: '/:path*{/}?',
        headers: [{ key: 'X-Accel-Buffering', value: 'no' }],
      },
    ]
  },
}

standalone 模式会仅生成用于生产环境的必要文件,而设置 X-Accel-Buffering 则用于支持 Next.js 的流式渲染 ,禁用了 Nginx 的响应缓存。

接着我们实现项目的 Docker 构建。根据 Deploy - Docker 文档中,将 Docker 示例中的 .dockerignoreDockerfile 复制到自己的项目中就可以了。

可以在项目根目录下执行以下命令,检查配置是否正确,本例应用名称使用 nextjs-app ,你也可以修改成自己需要的应用名称。

  1. 构建镜像:docker build -t nextjs-app .
  2. 构建成功后,启动容器:docker run -p 3000:3000 nextjs-app

当访问 http://localhost:3000,看到 Next 应用的页面,那么说明在本地构建和运行成功。

2. 配置服务器

接下来我们将配置服务器的:

  1. 配置 root 用户密码,配置 443/80 端口安全组配置
  2. 配置 SSH 密钥
  3. 配置 SSL 证书
  4. 在服务器上安装 Docker、Nginx