使用自己的服务器搭建hexo博客如何创建一个404页面

网上有很多使用 github 托管自己博客的帖子教你如何创建 404 页面，因为 github 自动响应 404 状态码，所以不需要任何其他配置。但是自己的 nginx 或者 caddy 不配置的话只会返回明文状态码。看起太 low 了。下面教你如何配置

在本地博客文件夹创建一个 404 pages

进入到本地博客文件夹，输入

hexo new page 404

然后在 source 文件夹下面就会出现一个新的文件夹 404 ，打开文件夹里面的 index.md 文件，粘贴以下代码（使用 typora 的话记得按 ctrl+/ 进入编辑模式）：

---
title: 404 Not Found：该页无法显示
toc: false
comments: false
permalink: /404
---
<!DOCTYPE html>
<html>
    <head>
         <meta charset="UTF-8" />
         <title>404</title>                                                                                                                                        
    </head>
    <body>
         <script type="text/javascript" src="//qzonestyle.gtimg.cn/qzone/hybrid/app/404/search_children.js" homePageName="返回首页" homePageUrl="https://blog.pakro.top"></script>
    </body>
</html>

记得把 homePageUrl 改成自己的博客链接。

然后推送到远程服务器上

hexo clean && hexo g && hexo d

修改你的 web 服务器配置

我使用的 caddy 服务器。随便说一句，caddy 配置起来真的比 nginx 简单多了，尤其是新开一个服务器的时候。

caddy 配置方法

找到自己 Caddyfile (一般在 /etc/caddy 文件夹下)，添加红框内的三行代码

  errors /var/log/caddy_errors.log {
    404 404.html
  }

重启 caddy 即可。

nginx 配置方法

我好久都没有用 nginx 了，所以这一部分是抄的： https://www.suscrb.com/2019/10/17/Configure404pages/

编辑 /etc/nginx/nginx.conf 文件

在 http 区域添加：

fastcgi_intercept_errors on;

在 server 区域 listen 443 处修改：

error_page 404 /404.html;
location = /404.html {
  root  /home/hexo/404;
}

其中:

第一处的 error_page 的/ 404.html 代表你 404 文件名字 , 一般不用改, 如果不放心就进入服务器里面的文件夹看看文件名是什么

location引用上面的 404.html,并且在里面配置 404 页面的文件夹路径

重启 nginx 即可。

查看是否成功

访问： https://blog.pakro.top/404 试试。