将 Next.js 部署到共享主机

Chr*_*ger 0 deployment shared-hosting node.js next.js

我需要将 Next.js 应用程序部署到支持 Node.js 的共享托管服务提供商。Next.js 官方文档说您(仅?)需要next start在服务器上运行(我猜是通过 SSH)。

  1. 我只需要部署build版本还是需要通过 ssh 在服务器上运行构建命令?
  2. npm start一旦构建准备好,运行真的是我唯一需要做的事情吗?我有点担心服务器因任何原因停止并且站点关闭。我GOOGLE了不少,发现一些人利用提pm2(参见文章freeCodeCamp。)但不知道Next.js也许在生产时会自动重新启动服务器?

oko*_*ozo 7

您可以在这里找到非常有用的讨论: https://github.com/vercel/next.js/discussions/12234

我发现缺乏使用 cPanel 部署到共享主机的信息,因此经过多次尝试和错误,我希望这对那些在 Nextjs 部署到自定义服务器(如 Vercel 文档中提到的)方面陷入困境的人有所帮助,在本例中是共享主机。

  1. 建造

根据我在托管服务器上运行的经验,有时会由于共享托管服务器中提供的虚拟内存有限而npm run build导致。因此,解决方法很简单,在本地计算机上执行构建,然后将计算机上创建的文件夹复制到托管服务器上项目的根文件夹中。build errors.next

  1. 部署更简单

我不需要“pm2”或“nginx”来运行 Nextjs 项目。这非常简单,只需将package.json“server.js”复制.next到项目的根文件夹中即可。(参见下面的server.js内容)

  1. 服务器启动文件

(您可以将其命名为 server.js 或 app.js 或 index.js 或任何您想要的名称,只要它与您在 cPanel 中对 Node 应用程序的定义一致即可)。以下是服务器启动文件所需的最少代码:

const { createServer } = require("http");
const { parse } = require("url");
const next = require("next");
const dev = process.env.NODE_ENV !== "production";

const port = !dev ? process.env.PORT : 3000;

// Create the Express-Next App
const app = next({ dev });
const handle = app.getRequestHandler();

app
  .prepare()
  .then(() => {
    createServer((req, res) => {
      const parsedUrl = parse(req.url, true);
      const { pathname, query } = parsedUrl;
      handle(req, res, parsedUrl);
      console.log("pathname", pathname);
    }).listen(port, (err) => {
      if (err) throw err;
      console.log(`> Ready on http://localhost:${port}`);
    });
  })
  .catch((ex) => {
    console.error(ex.stack);
    process.exit(1);
  });
Run Code Online (Sandbox Code Playgroud)


小智 5

在服务器上,你可以这样做,当然你应该有 pm2 (npm install -g pm2) 和 nginx 配置来代理传递你的下一个服务器将运行的端口,例如 6060(添加到 nginx.conf/server /location 这一行:proxy_pass http://localhost:6060) 然后:

  1. 上传源文件夹(pages、public、src、package.json)——例如将你的文件夹上传到像 /var/www/your-folder 这样的地方
  2. chown 它: sudo chown -R $USER:$USER /var/www/your-folder
  3. cd 到您的文件夹并运行: npm -i
  4. 然后编辑 package.json 并更改“next start -p your-port”,例如 6060
  5. npm 运行构建
  6. 运行 pm2(在你的文件夹中):pm2 start "npm run start" --name project-whatever-you-like

为了让 pm2 自动重启,您运行: pm2 startup systemd , pm2 将生成一行,您应该复制该行并运行它。

在共享主机上,现在有很多提供商支持运行 nodejs 应用程序,但我不知道他们是否可以运行 nextjs 应用程序,例如在 plesk 中,您可以通过配置 app.js 路径和项目文件夹路径、公共文件夹路径等来配置运行 nodejs 应用程序,但是对于下一个应用程序,您没有要运行的 app.js,而是要启动下一个服务器的脚本。无论如何你可以试试:)

或者你可以简单地转移到 vps,它的价格现在相当便宜,你可以用自己的服务器做很多事情(谷歌计算引擎提供免费的东西 - 几乎免费一年)


Ave*_*man 5

高级别后续行动:根据我读到的其他回复,似乎有些东西正在丢失,所以我们不要只见树木不见森林。

如果您的应用程序仅使用 nextjs 的前端部分,那么无论主机是否提供 Nodejs,在共享主机上都应该没问题,因为构建命令使其可以部署在任何可以提供 HTML 服务的服务器上。然后在每个客户端上编译 JS。

如果您的应用程序使用了 nextjs 的后端服务器,那么您就需要在主机上运行兼容版本的 Nodejs。如果你不使用它们,应该没问题,因为它基本上就像 React 一样。

构建后,我已将多个 React (CRA) 应用程序部署到我的共享主机,它们都工作正常。该主机是运行cloudlinux 6(认为:Linux内核~3.10)的老式廉价共享主机,不提供nodejs后端,仅提供Apache Web服务器。

如果他们使用后端服务器(例如 nextjs 的 、app.js),我会将 nextjs 应用程序部署到由 HyperExpert 托管的 VPS - 他们提供一个空白的操作系统(我的 Ubuntu 20.04 ATM)。它要求您设置自己的代理服务器(例如 nginx)和 Web 服务器(例如 lighthttpd、Apache 或 nginx 都可以),但是您可以更灵活地决定使用什么。

在 VPS 上,您还可以通过 docker、podman、systemd-container 等将应用程序打包为容器,这可以帮助在更新时使重新部署更加干净,并有助于调度,例如将应用程序作为服务运行和限制资源。

重要提示:我认为这是人们迷路的地方

无论哪种情况您始终需要在本地运行构建命令来准备应用程序的部署。

然后您的服务器所需要做的就是将生成的文件夹(例如.next)上传到您的主机。为其创建自己的文件夹,您可以mydomain.com/folderyouuploaded在浏览器中打开。

提示:如果您将其命名为开头没有的名称.,则它不会被隐藏。mv .next myappnamev1.0.0例如,在上传之前运行。

大多数人还会使用子域 ( myapp.mydomain.com) 直接通过您的域,该子域指向index.html您上传的构建文件夹中包含的文件夹。这通常在 cPanel 或任何共享主机的面板类型中完成。

npm i除非您想在开发人员模式下运行您的应用程序,否则您永远不必运行(我想不出在主机上执行此操作的充分理由)。

如果你想将其容器化,那就会涉及更多一些,但最终会得到回报。使用工具箱等工具或者如果您使用tar.gzsystemd-container,您甚至可以在容器内编辑文件,这在某些情况下肯定会有所帮助(想一想:在您希望避免整个文件的情况下进行一些小调整)重新部署容器)。

如果您的应用程序变得足够大,我建议使用 CI/CD 管道,但这超出了本答案的范围。祝你好运!