Next.js 直接从 url 更改不起作用

Question

Next.js 版本 10.0.6 - 节点版本 12.18.4 - Linux 18.04

在我的服务器上，我尝试将 URL 直接更改为“关于”页面（通过键入 URL - 而不是通过单击链接），但它给了我一个 502 错误网关。任何复制粘贴到 URL 的操作都不起作用。只有在我的导航栏中，当我单击“关于”链接时才能导航到关于页面。

示例：

www.example.com/about

我的电脑上开发模式下的操作运行得非常好。问题出在我的服务器上。

我的部署步骤：

package.json 文件：

"scripts": {
    "dev": "next dev",
    "build": "next build && next export",
    "start": "next start"
  },

npm run build

我从“out”文件夹中取出所有文件并将它们放在我的服务器上。

nginx 配置文件：

server {
    listen myip:80 default_server;
    listen [::]:80 default_server;
    server_name example.com www.example.com;

location / {
 proxy_pass http://localhost:3000;
 proxy_http_version 1.1;
 proxy_set_header Upgrade $http_upgrade;
 proxy_set_header Connection 'upgrade';
 proxy_set_header Host $host;
 proxy_cache_bypass $http_upgrade;
 }

location ~ /.well-known {
  allow all;
}

 location ~* "/\.(htaccess|htpasswd)$" {
        deny    all;
        return  404;
    }

    location /vstats/ {
        alias   /home/admin/web/example.com/stats/;
        include /home/admin/conf/web/example.com.auth*;
    }

    include     /etc/nginx/conf.d/phpmyadmin.inc*;
    include     /etc/nginx/conf.d/phppgadmin.inc*;
    include     /etc/nginx/conf.d/webmail.inc*;

    include     /home/admin/conf/web/nginx.example.com.conf*;
}

我重启Nginx的服务并启动pm2。

sudo service nginx restart

pm2 start npm --name "next" -- start

我做错了什么？我的配置正确吗？

如果您需要任何其他信息，请随时询问我。

Answer 1

您可以将

trailingSlash: true

添加到您的

next.config.js

，以便

/about

可以路由到 HTML 文件。这是 Next.js 9 之前的默认行为，但现在需要显式启用。

// next.config.js

module.exports = {
    trailingSlash: true
}

Answer 2

trailingSlash 确实有帮助，但会导致 nginx 的另一个错误是在访问时：

http://example.com/somefolder --> http://example.com:8080/somefolder

---

重复：trailingSlash 无法通过 URL 访问我的页面，只能通过下一个 js 中的链接访问

重复：nginx问题https://serverfault.com/questions/351212/nginx-redirects-to-port-8080-when-accessing-url-without-slash