沐码小站

很多网站的 HTTPS 证书并不只用在服务器上，还会同时用于七牛云对象存储或 CDN 的自定义域名。麻烦的不是申请一次证书，而是每次续签后还要手工去多个地方替换。本文给出一套可长期运行的自动化方案：使用 Let’s Encrypt 签发免费证书，借助阿里云 DNS API 完成 DNS 验证，再通过 Certbot deploy hook 在续签成功后自动 reload Nginx、上传证书到七牛云并切换绑定域名配置，最后用 systemd 定时执行 renew。整套流程只需首次配置一次，后续即可自动运行。

很多场景下，我们会使用 bool 值来描述实体状态，通常用实体的一个属性来表示。对于多个 bool 状态标记，我们可以使用位标记来替换它，仅使用一个属性来表示实体下所有的 bool 状态。这样做的好处是，一方面减少实体的属性，代码层面会更简洁；另一方面，单标记比多标记更节省空间，在数据存盘时能节约大量磁盘空间。

Nuxt服务端渲染解决了Vue单页应用SEO的痛点，但是在权限认证上也带来了一些麻烦。Nuxt项目中，用户切换路由时请求页面和在页面中触发ajax请求数据的的路径是不同的。本文介绍一下两种请求统一进行身份验证的方法。

CSS变量可以用来优化代码，比如相同的颜色值散落在代码各处，使用CSS变量可以将颜色值收敛起来，将来发生调整可以很简单地一键替换。除此之外，还有一些场景也特别适合使用CSS变量，比如前端主题化（深色模式等）、响应式布局等。 本文简单介绍一下CSS变量的一些使用。

本文为沐码小站开源服务端程序运行和部署说明。

很久之前（好像刚好是一年前）写过一个Vue组件，可以匹配文本内容中的关键字然后高亮，类似浏览器搜索结果。实现原理是，将文本字符串中的关键字搜索出来，然后使用特殊的标签（本文示例使用font标签）包裹关键词替换匹配内容，最后得到一个HTML字符串，渲染该字符串并在font标签上使用CSS样式即可实现高亮的效果。当时的实现过于简单，没有支持接收HTML字符串作为内容进行关键词匹配。这两天有同学问到，就又思考了这个问题，发现并不是那么麻烦，写了几行代码解决了一下。

多行文本超过指定行数折叠是一个常遇到的需求，网上也有人实现过类似的功能，不过还是想自己写写看，于是就写了一个Vue的组件，本文简单介绍一下实现思路。

个人网站使用Mysql数据库，当前字符集是utf8，不支持存储emoji表情，因为utf8最多支持存储3字节的字符，存个字母、普通的汉字都是没问题的，但是存emoji表情字符需要占用4个字节。mysql扩展了一个新的字符集utf8mb4来解决这个问题，utf8mb4是utf8的超集，最长可以用4个字节来存储一个字符，当然也可以存emoji表情，以及一些不常用的汉字等。

一些常用工具、资源的备忘录，用到的时候总是要百度或者翻半天，所以就统一收集在这里吧，持续补充。

el-table的height属性可以方便地实现表格固定，但是这个值该设置为多少以适配屏幕大小呢？设置过小，则可能出现可视区域内有空白位置，但是表格内却出现滚动条；设置过大，则在一些小屏幕设备上浏览时，页面本身和表格内部都可能会出现滚动条。两种情况体验都是极差的，为了解决这个问题，我们需要动态地计算页面空白区域的高度，然后设置到height属性，即根据页面大小，动态计算height属性。