Troubleshooting Access Issues for Vercel Projects
Platform as a Service
After GitHub was blocked, accessing blogs is only possible via proxy, but Vercel offers decent access speeds in China, making it a good alternative.
On its official website, you can directly deploy a Hexo project without any configuration needed.
Updating the Blog
There are two methods for updates:
- Deploy directly using the command line tool
npm i -g vercel
vercel --prod --confirm
- Push to a GitHub repository and let Vercel pull the updates
404 Page
The default error page is not visually appealing and points to the official documentation.
The simplest way to customize it is to create a 404.html page in the source directory.
Here’s a simple 404 page:
<!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
After August 27, *.vercel.app was blocked by SNI and DNS pollution, making it inaccessible from China, which has caused significant issues. Using a CDN layer like Cloudflare can restore access.
I am using Cloudflare CDN.
Comparison of access speeds in China before and after
If the access speed with Cloudflare CDN is still not ideal, follow this guide to optimize further
