J

主题

2025-05-192025-07-03指南指南
1766
6.7m
Get...

私密文章 ​

私密文章需要一个登录页进行登录，如果你想先体验登录页的效果，在导航栏 功能页 -> 登录页 点击查看。

您也可以通过 teek-login-page 插槽自定义登录页。

vue
<script setup lang="ts" name="TeekLayoutProvider">
import Teek from "vitepress-theme-teek";
import YourLoginPageComponent from "./YourLoginPageComponent";
</script>

<template>
  <Teek.Layout>
    <template #teek-login-page>
      <YourLoginPageComponent />
    </template>
  </Teek.Layout>
</template>

前言 ​

私密文章功能默认没有和后端集成，因此只能 防君子不防小人。

当然 Teek 也提供了一些钩子函数，支持您自定义登录逻辑和加密解密，此时您可以全部重写 Teek 的登录逻辑，比如集成后端。

当然如果全部重写登录逻辑，那么就要思考一个问题：为什么不完全自己写一个呢？毕竟去完全熟悉 Teek 的登录逻辑也许比自己实现耗费的精力更多 🐶。

安全检测代码 ​

因为 VitePress 是静态页面，所以我们无法往后端获取登录信息，那么也就有一个问题，如果用户禁用 JavaScript，那么私密文章将不会进行验证，也就可以直接浏览私密文章内容，那么如何处理这个问题呢？

打开 .vitepress/config.mts 文件，给 head 模块添加如下信息：

js
["noscript", {}, '<meta http-equiv="refresh" content="0; url={your link}">'];

{your link} 不要填写自己博客的任意地址，而是填写博客以外的地址，因为博客的页面总会触发这段代码，导致反复跳转该页面。

开启私密文章认证功能 ​

这一步是必须的，请阅读 功能页配置 来开启私密文章认证功能。

文章开启私密功能 ​

如果你想给某篇文章开启私密功能，请在 frontmatter 中添加如下内容：

yml
---
private: true
---

这是 最基本也是必须的步骤，开启了私密文章后，还需要配置对应的用户名和密码，看下面。

认证级别 ​

私密文章认证有 4 种级别：

  1. 单文章级别，每个文章有自己的用户名和密码
  2. 领域文章级别，可以给多个文章设置一个领域（组织），在该领域认证后，则该领域的其他所有文章都可以访问，它是一个组织的概念，理解就行
  3. 全局文章级别，在任意全局文章登录认证后，其他全局文章都可以访问
  4. 站点级别，在进入站点的时候需要进行认证，该级别和私密文章认证没有关系

如果同时设置多个文章级别的认证信息，那么有如下规则：

  • 一个文章同时设置 单文章级别认证信息、领域文章级别认证信息，则这两个级别的认证信息都对该文章 生效
  • 一个文章同时设置 单文章级别认证信息、全局文章级别认证信息，则 全局文章级别认证信息 对该文章 失效
  • 一个文章同时设置 领域文章级别认证信息、全局文章级别认证信息，则 全局文章级别认证信息 对该文章 失效
  • 一个文章同时设置 单文章级别认证信息、领域文章级别认证信息、全局文章级别认证信息，则 全局文章级别认证信息 对该文章 失效，另外两个认证信息都对该文章 生效

从上面可以看出，全局文章级别认证信息 优先级是最低的，是一个兜底的配置。

站点级别认证有一个角色的概念，默认为 common，即当进入站点并登录认证后，访问任何私密文章仍然需要重新进行认证，而如果是 admin 角色，则进入站点后，所有文章都可以访问。

单文章级别 ​

在某个私密文章的 frontmatter 中设置用户名和密码等配置：

yml
---
private: true # 开启文章私密
username: teek # 用户名
password: teek # 密码
expire: 2d # 可选，登录失效时间，如果不填则以全局配置为准，全局设置默认为 1d
session: false # 可选，开启是否在网页关闭或刷新后，清除登录状态，这样再次访问网页，需要重新登录，默认为 false
strategy: once # 可选，登录策略，once 代表一次登录，always 代表每次访问都登录，默认为 once
loginInfo: [{ username: "teek1", password: "teek1" }, { username: "teek2", password: "teek2" }]

警告

username 或 password 不允许是纯数字，如果您只想配置纯数字，则用引号起来，如 "1234"、'1234'。

可以看到 frontmatter 出现了 username、password，并且 loginInfo 里也出现多个 username、password。

这两种方式没有什么区别，无论是以 username、password 登录，还是 loginInfo 里的多个 username、password 都可以登录。

领域文章级别 ​

有的时候，我们并不需要给每一个文章设置用户名和密码，而是按「组」的概念设置。

比如我们有 指南 和 配置 两个专题的文章，那么我可以对这两个专题进行认证，在 .vitepress/config.mts 文件配置如下：

ts
// .vitepress/config.mts
import { defineTeekConfig } from "vitepress-theme-teek/config";

const teekConfig = defineTeekConfig({
  private: {
    enabled: true,
    realm: {
      guide: [
        { username: "teek-guide-1", password: "teek" },
        { username: "teek-guide-2", password: "teek" },
      ],
      config: [
        { username: "teek-config-1", password: "teek" },
        { username: "teek-config-2", password: "teek" },
      ],
    },
  },
});

在 指南 的各个文章 frontmatter 配置绑定对于的 realm：

yaml
private: true
privateRealm: guide

在 配置 的各个文章 frontmatter 配置绑定对于的 realm：

yaml
private: true
privateRealm: config

全局文章级别 ​

有时候我们想直接提供一些用户名和密码，它能访问页面的所有文章，那么可以使用全局文章级别配置：

ts
// .vitepress/config.mts
import { defineTeekConfig } from "vitepress-theme-teek/config";

const teekConfig = defineTeekConfig({
  private: {
    enabled: true,
    pages: [
      { username: "tee-pages-1", password: "teek" },
      { username: "tee-pages-1", password: "teek" },
    ],
  },
});

此时可以访问 非单文章级别、非领域文章级别 的其他任何私密文章。

站点级别 ​

站点级别的认证主要是卡控站点的访问，而不是文章的访问。

在 .vitepress/config.mts 里开启站点级别认证并设置认证信息：

ts
// .vitepress/config.mts
import { defineTeekConfig } from "vitepress-theme-teek/config";

const teekConfig = defineTeekConfig({
  private: {
    enabled: true,
    siteLogin: true,
    site: [
      { username: "teek-site-1", password: "teek" },
      { username: "teek-site-2", password: "teek" },
    ],
  },
});

这些用户名和密码默认是 common 角色，即只适用于进入站点时登录，当访问任意私密文章时，仍需单独对私密文章认证。

如果想登录站点后可以访问所有私密文章，则给账号开启 admin 角色进行如下配置：

ts
// .vitepress/config.mts
import { defineTeekConfig } from "vitepress-theme-teek/config";

const teekConfig = defineTeekConfig({
  private: {
    enabled: true,
    siteLogin: true,
    site: [
      { username: "teek-site-1", password: "teek" },
      { username: "teek-site-2", password: "teek" },
      { username: "teek-site-2", password: "teek", role: "admin" },
    ],
  },
});

其他配置 ​

除了用户名和密码之外，Teek 也有其他的配置项来加强私密文章功能，更多配置请阅读 功能页配置

最近更新