LOADING...
RTheme V4 博客系统的部署完全指南。该版本采用了基于 React 和 Next.js 的混合架构(Hybrid Applications),文章详细介绍了利用 Vercel Serverless 服务与 PostgreSQL 数据库进行托管的完整流程,涵盖了从代码 Fork、环境变量配置(含加密算法设置)、域名绑定到站点初始化的所有步骤。
RThemeV4相较于V3版本,外观差别不是很大。主要的更改来自其架构,目前为止RThemeV4更像是一个独立的博客系统而不只是一个静态页面的主题,这是因为V4中整体进行了React化,搭配Nextjs即可动态的从数据库中获取数据并在服务器端渲染页面。因此,部署V4版本就不像之前的版本那样简单——之前的版本只要托管静态资源即可,而现在更需要的是服务器与数据库。
不过,此博客系统因为使用了 Hybrid Applications(混合应用程序)架构,即大量不会经常改变的内容(如文稿等)会在构建通过请求数据库进行渲染,随后作为静态资源分发给用户,以便减少对数据库和服务器的需求,部分经常改变的内容(如用户资料、动态等)则会使用SSR技术,在请求时再渲染,这样的架构使得博客对数据库和服务器的使用强度又远小于纯动态站点,仅仅使用Serverless函数和小型数据库即可完美运行,如此我们就可以使用Vercel这样的提供Serverless服务与Postgresql数据库的平台来托管此站点。当然,也可使用VPS等直接部署。下文介绍几种部署方式:
vercel开发了nextjs,并且免费提供了Postgresql数据库,可以快速部署RThemeV4. 美中不足的一点是,因为vercel免费提供的vercel.app域名在大陆地区访问异常,你需要一个自有域名来防止你的服务无法正常访问。
你需要:
在这里我们使用了曾获密码算法大赛冠军的argon2id算法,在使用RS512算法加密校验JWT的同时也用了一套自研的加密算法,用以保护你的服务器。
你需要生成一个RS512密钥。以下是生成方法:
image.png
3. 添加你的自定义域名
在Vercel项目的Settings>Domains页面添加你的自定义域名。你可能需要根据你的域名注册地址,修改域名的cname记录和A记录。
image.png
4. 自定义你的站点
前往你的Github存储库,完成以下操作:
image.png
将public文件夹下的avatar.jpg与icon.png替换为你的头像与图标(注意,名称需要与之前相同,即avatar.jpg与icon.jpg)
修改origin/about文件夹下的about.mdx文件,此文件对应博客中的关于页面,可使用markdown语法。(此操作在以后的更新后也会简化,在站点中即可操作)
重要:修改根目录下的config.js文件,按照注释修改即可。注意遵从“看不懂就不改”原则,之后我会再补充每一项的详细设置。
当你修改完成后,Vercel将会自动更新站点。你可能需要3-5分钟等待Vercel部署完成。随后,即可打开你的站点,进行用户初始化。
打开你部署的站点,点击左上角头像图片,选择注册,并登录:
image.png
image.png
作为第一个用户,你会被授予管理员权限。之后,你可以随时点击左上角头像,进行文章的增删改查操作
注意:当你编辑完文章并发布后,你会被转到此文章的页面。但是此时,站点并未更新,所以这个新的文章就不会显示在列表页。
因此,你需要在每次发布新文章后,转到你的vercel项目,点击Deployments,选择redeploy,等待博客重新构建才会完成。(在随后更新的版本中也会添加一键构建的功能,在博客内操作即可。)
image.png
(未完待续...)
openssl genrsa -out private_key.pem 2048
评论