如何在 cpanel 上部署 nextjs 应用程序？

Question

我按照这些步骤在 cPanel 上部署了我的 nextjs。

转到 package.json 并添加此行："homepage": "http://afsanefadaei.ir"
运行 next build 将 .next 文件夹作为我的构建文件夹
转到 cpanel >> file manager >> public_html 文件夹并将 .next 文件夹的内容上传到此目录
添加或编辑此文件：.htaccess 到：

但是当我访问该网站时，我遇到了这个：

你知道这有什么问题吗？

Answer 1

您的 .next 没有 index.html 文件。
好像你有服务器端（主要使用 nodejs），但不幸的是你不能从 cpanel 运行服务器端。
据我所知，如果您倾向于只使用前端，则应该使用 next export 而不是 next build。

但最重要的是第 1 点，确保你的 .next 文件夹中有 index.html。

Answer 2

我将 out（通过 npm run build && npm run export 生成）文件夹上传到 public_html 并创建了 .htaccess 文件，如

<IfModule mod_rewrite.c>

  RewriteEngine On
  RewriteBase /
  RewriteRule ^index.html$ - [L]
  RewriteCond %{REQUEST_FILENAME} !-f
  RewriteCond %{REQUEST_FILENAME} !-d
  RewriteCond %{REQUEST_FILENAME} !-L
  RewriteRule . /index.html [L]

</IfModule>

对我有用

Problem: When I refresh the page on some different route let's say /about, it brings the index.js page contents but URL doesn't change to /

Answer 3

将其部署为 NodeJS 应用程序。

Answer 4

我可以使用上述答案之一托管应用程序，但是当我刷新页面时，应用程序会崩溃或转到初始路径。

这就是我解决这个问题的方法（解决方案来自 next.js 官方网站）。

使用 npm run build
在根文件夹中创建一个启动文件app.js并复制以下代码

const {
  createServer
} = require("http");
const {
  parse
} = require("url");
const next = require("next");

const port = process.env.PORT || 3000;

// Create the Express-Next App
const app = next({
  dev:false
});
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);
  });

在 cPanel 上创建一个 Node.js 应用程序并添加应用程序启动文件名
并启动应用程序。你完成了！

有关更多信息，请查看 Next.js Custom Server

的官方文档

Answer 5

这是一个完整的 .htaccess，用于实现带有 Apache 重定向的 Node.js 应用程序。如果您使用 next start 服务器部署了 NextJS 应用程序（侦听特定端口），那么这在 cPanel 上非常有效。

RewriteEngine On

# Need to disable DirectoryIndex to avoid rewriting directory URL to index.html
DirectoryIndex disabled

# Redirect home page request to the NextJS server
RewriteCond %{REQUEST_URI} ^/$
RewriteRule ^(.*)$ http://127.0.0.1:4002/ [P,L]

# Redirect all other requests to the NextJS server with the URI appended
RewriteCond %{REQUEST_FILENAME} !-f
RewriteCond %{REQUEST_FILENAME} !-d
RewriteRule ^(.*)$ http://127.0.0.1:4002/ [P,L]

如何在 cpanel 上部署 nextjs 应用程序？

How to deploy a nextjs application on cpanel?

deployment

.htaccess

cpanel

reactjs

next.js

对我有用