网站能打开不代表它真的能用

刚开始的时候我对做完了的判断很简单浏览器能打开首页文章能显示基本就差不多了

后来这几天一直在补东西才发现首页能打开只是最前面的一步登录头像上传评论点赞收藏还有后台发布文章只要中间有一段没有接好用户看到的就是一个坏掉的按钮

先把问题找出来

页面刚做出来的时候我花了不少时间调整颜色字体和手机端的排版看着首页能显示文章也能打开我当时确实以为剩下的都是小细节

结果登录以后点点赞页面还是说没有登录收藏也遇到过类似的问题头像上传则直接出现过 403 Forbidden 后台权限看着没什么问题前台请求就是过不去

这些问题看起来不像一件事最后查下来很多都和请求有没有走到正确的地方有关浏览器带的是 Cookie Strapi 需要的是认证信息中间还要经过 Nuxt 和 Nginx 哪一段没有接上按钮看起来就像坏了

登录不是点一下按钮

登录态是我花时间最多的一块浏览器保存的是 httpOnly Cookie 后端接口需要 Bearer Token 中间的服务端代理还要把它转过去如果 Cookie 没保存好或者转发时漏了认证信息页面就只能把用户当成游客

我现在遇到类似问题会先看浏览器 Network 请求有没有发出去返回的是 401 还是 403 响应里有没有 Cookie 先把问题定位到哪一层再回代码里改通常比盯着页面上的操作失败有用

async function checkLoginRequest() {
  const response = await $fetch.raw('/api/auth/me', {
    credentials: 'include',
    ignoreResponseError: true,
  });

  if (response.status === 401) {
    throw new Error('当前没有有效的登录状态');
  }

  if (!response.ok) {
    throw new Error(`登录接口异常：${response.status}`);
  }

  return response._data;
}

这段代码不复杂但它提醒我一件事先看真实返回再猜页面哪里坏了

后台能看到前台不一定能用

文章封面和评论都放在 Strapi 里管理最开始我也踩过一个坑以为数据库里有数据前台就一定能拿到实际上文章有没有发布关联有没有填好接口有没有开放都会影响最后的结果

反向代理也一样前面是 Nginx 中间是 Nuxt 后面才是 Strapi 登录上传和文章接口的路径不一样不能只配一条看起来能用的规则之前后台上传 /upload 遇到的 404 最后就是 Nginx 没有匹配到不带斜杠的那个路径

后来我把内容创建和修改尽量放回后台完成前台负责阅读后台负责管理出了问题以后至少知道应该先去哪里看

这几天又把域名换了

网站原来一直用裸 IP 访问备案和 DNS 准备好以后才把 tianxuan7.cloud 和 www.tianxuan7.cloud 接到服务器上再用 Let s Encrypt 申请证书

这一步也没有想象中复杂但有几个地方不能漏 Nginx 要把 80 跳到 443 Nuxt 和 Strapi 的公开地址要改成 HTTPS Cookie 只能在 HTTPS 下标记为 Secure 最后还要检查 RSS API 后台和图片有没有跟着一起工作

现在域名已经可以正常访问证书也配置了自动续期它不代表网站从此不用管了只是以后改配置时少绕一层弯

看起来不大的调整

这几天还改了几处看起来不大的东西

浅色背景从接近白色改成了偏暖的浅灰首页标题的金色也压低了一点资料卡的顶部横幅换成了自己选的图片加了一层遮罩和一点毛玻璃图片不会把文字和头像抢走

缓存也顺便看了一遍现在 Nginx 没有做整站反代缓存 HTML 和接口主动不缓存带 hash 的静态资源才会长时间放在浏览器里这样命中率不会特别高但登录状态和文章更新不容易读到旧数据对这个站来说先把数据读对比盲目追缓存数字更重要

还没有真正结束

做到现在天璇已经能写文章浏览搜索登录和互动也能从后台管理内容验证码状态已经放进 Redis 备份和恢复也做过一次演练域名和 HTTPS 也已经切过去了

不过它还没有到完全不用操心的程度真实浏览器里的登录后上传评论和点赞写入普通账号权限后台维护还有英文和手机端的完整回归都还要再检查一遍网站地图也还没补上邮件的 SPF DKIM DMARC 还没有完全确认

所以现在回头看网站能打开还是只算第一关真正花时间的是让每个按钮走完自己的路出问题时知道从哪里查起这个过程不算特别酷但确实比一开始想的更有意思

先把这一篇记下来后面再慢慢补

网站能打开 不代表它真的能用