自定义404页面 | 实现国内正常访问 | Vercel

天水 547 2 min

更换平台即服务为Vercel，自定义404页面，解决*.vercel.app已被SNI阻断和DNS污染屏蔽问题

平台即服务

Github被墙后只能代理访问博客，Vercel国内访问速度还不错，是个不错的替换方案

在其官网选择Hexo项目直接部署即可，不需要任何配置

更新博客

存在两种更新方式：

安装命令行工具直接部署

npm i -g vercel
vercel --prod --confirm

Push到Github仓库让Vercel自行拉取

404页面

默认报错页面不美观且会指向官方文档

最简单的自定义方式是在source目录下创建404.html页面

这是一个简单的404页面

<!DOCTYPE html>
<html lang="en">
<head>
	<title>404 Error</title>
	<meta charset="utf-8">
	<meta http-equiv="X-UA-Compatible" content="IE=edge">
	<meta name="viewport" content="width=device-width, initial-scale=1">
	<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/css/bootstrap.min.css">
</head>
<style>
	body {
  background-color: #f1f1f1;
}
.vertical-center {
  min-height: 100%;
  min-height: 100vh;
  display: flex;
  align-items: center;
}
</style>
<body>
	<div class="vertical-center">
		<div class="container">
			<div id="notfound" class="text-center ">
				<h1>😮</h1>
				<h2>Oops! Page Not Be Found</h2>
				<p>Sorry but the page you are looking for does not exist</p>
				<a href="https://blog.btwoa.com/">Back to blog</a>
			</div>
		</div>
	</div>
</body>
</html>