自定义404页面 | 实现国内正常访问 | Vercel
本文部分信息可能已发生改变,请自行甄别
平台即服务
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>
Cloudflare
8月27日后,*.vercel.app已被SNI阻断和DNS污染,国内无法正常访问,引起了不小的麻烦。但可以另辟蹊径,套层CDN就可以正常访问了
CDN我选用的是Cloudflare免费方案
国内访问速度前后对比
Cloudflare CDN部署后访问速度仍不理想,可以按这篇教程继续优化
[Cloudflare for SaaS实现CDN自定义节点](通过Cloudflare for SaaS实现CDN自定义节点(自选IP) | Blog | btwoa)
参考:
Vercel: Custom 404 Page
Github: vercel.app Blocked by SNI and DNS Pollution in China