PandaBangumi for Typecho 更新！

本次 PandaBangumi 4.0.0 带来了以下更新：

追番日历、单部条目卡片回归
支持动画、书籍、游戏、三次元和音乐收藏
条目卡片支持动画、书籍、游戏、三次元和音乐
重新设计的响应式样式
Bangumi API 镜像支持
封面可缓存至插件目录下
收藏列表按需分页
后台代码速查与一键复制
编辑器快捷插入条目卡片
更完善的 PJAX 适配
缓存、请求与错误处理等后端改进

展示页面 | GitHub 仓库 | 插件下载

说明
原项目由 AlanDecode 创建，本项目基于 Izumiko 维护的版本继续开发。4.0 的重构过程中使用了 AI 辅助编程。

安装

安装前请确认运行环境满足以下要求：

PHP 8.0 或更高版本
PHP 启用 curl 和 openssl
插件目录允许 PHP 写入

随后：

从 Releases 下载发布包并解压。
将插件文件夹重命名为 PandaBangumi。
上传到 Typecho 的 usr/plugins 目录。
在 Typecho 后台启用插件。
填写 Bangumi 用户 ID，并按需设置 API 镜像、封面加载方式等选项。

启用后，可在插件设置页生成收藏列表、追番日历和条目卡片代码；文章编辑器工具栏也会出现条目卡片按钮，可直接输入 Subject ID，或直接粘贴 Bangumi 条目链接。

说明
支持解析 bangumi.tv、bgm.tv、chii.in 三种域名的 HTTPS 条目链接。

设置

用户 ID 是 Bangumi 主页 /user/ 后面的用户名或数字 ID。
Bangumi API 镜像为可选项，留空时使用官方 https://api.bgm.tv。
封面可以由访客浏览器直接加载，也可以缓存到本站后，通过本站地址加载。
数据刷新间隔默认 86400 秒，最低 300 秒。
收藏数量上限默认 30，可设为 0 至 300；日历的「仅在看」不受这个数量限制。

更新

PandaBangumi 4.0 重做了缓存目录、图片配置和前端入口，不再读取或迁移旧版缓存，因此不能直接覆盖升级。请先在 Typecho 后台停用插件，删除整个 usr/plugins/PandaBangumi 文件夹，再上传新版、重新启用并检查插件设置。

使用

提示
下面这些代码都可以由插件设置页的「代码速查」直接生成；收藏列表、日历和条目卡片都可以出现在普通文章或独立页面中，不需要在插件设置中分别开启。

日历

「仅在看」会根据插件设置中的用户 ID 筛选自己的收藏，「全部番剧」则会显示完整的每日放送列表。

只显示自己正在看的动画：

<div data-filter="watching" class="bgm-calendar"></div>

Bangumi 每日放送：

<div class="bgm-calendar"></div>

每日放送需要展示的条目太多，这里就不具体演示了。

在看动画：

<div data-type="watching" data-cate="anime" class="bgm-collection"></div>

看过动画：

<div data-type="watched" data-cate="anime" class="bgm-collection"></div>

在看或看过的三次元：

<div data-type="watching" data-cate="real" class="bgm-collection"></div>
<div data-type="watched" data-cate="real" class="bgm-collection"></div>

在读书籍：

<div data-type="reading" data-cate="book" class="bgm-collection"></div>

读过书籍：

<div data-type="read" data-cate="book" class="bgm-collection"></div>

在玩游戏：

<div data-type="playing" data-cate="game" class="bgm-collection"></div>

玩过游戏：

<div data-type="played" data-cate="game" class="bgm-collection"></div>

在听或听过的音乐：

<div data-type="listening" data-cate="music" class="bgm-collection"></div>
<div data-type="listened" data-cate="music" class="bgm-collection"></div>

卡片

推荐直接使用文章编辑器中的 Bangumi 按钮，手动插入时只需要 Subject ID。Subject ID 就是 Bangumi 条目地址 /subject/ 后面的数字，例如 https://bgm.tv/subject/364450 中的 364450。或手动插入：

<div class="bgm-card" data-id="364450"></div>

动画：

三次元：

游戏：

书籍：

音乐：

注意

关于镜像

Bangumi API 镜像只用于服务端数据请求，镜像地址不会直接暴露给访客。封面仍然使用 API 返回的图片地址；如果你计划自建 API 和图片镜像，不希望访客直接请求外部封面，可以将封面加载方式设置为「缓存到本站后加载」。

使用本站缓存时，请确保插件目录允许 PHP 写入。缓存文件保存在 usr/plugins/PandaBangumi/.cache/ 中。Apache 会使用插件附带的 .htaccess 阻止直接访问；Nginx 和 Caddy 不会读取 .htaccess，需要在站点配置中额外禁止访问该目录。

Nginx：

location ~ (^|/)\.cache(/|$) {
    return 404;
}

Caddy：

@hiddenCache path_regexp hiddenCache (^|/)\.cache(/|$)
respond @hiddenCache 404

提示
如果站点已经配置了全局隐藏目录保护，无需重复添加上述规则。配置完成后，可以尝试访问插件目录下的 .cache 路径，确认服务器返回 403 或 404。

关于数据刷新

PandaBangumi 会按照设置的刷新间隔缓存 JSON 数据。在 Bangumi 修改收藏状态后，博客页面不一定会立即更新；默认刷新间隔为 86400 秒，即 24 小时。

说明
选择「缓存到本站后加载」时，封面不会按照上述间隔重复下载。插件会根据 JSON 数据中的封面地址复用本站缓存；数据刷新后，如果封面地址发生变化，会在下次访问时下载新封面，地址没有变化则继续使用已有文件。不再被当前数据引用的旧封面会由定期维护逐步清理。

关于自建镜像

目前公开的镜像有；

这两个 API 镜像在反代官方 API 的同时也镜像了图片，可以直接使用，并适当考虑在插件中启用封面缓存功能。

而自行搭建的具体方法，可以参考《猫猫博客：自建 Bangumi API 和图片反代》。文章给出了 nginx 和 cloudflare worker 的反代方法，caddy 反代的配置在他的仓库中。这里照搬过来：

查看 Caddy 配置详情

# =====================================================================
# Bangumi 反向代理 - Caddy 版 (Caddyfile)
# ---------------------------------------------------------------------
# 代理：
#   api.example.com  ->  api.bgm.tv   (会改写 JSON 里的 lain.bgm.tv)
#   img.example.com  ->  lain.bgm.tv  (图片)
#
# Caddy 的好处是自动签发/续期 HTTPS，省事。
#
# ⚠️ 重要：改写响应体需要 replace-response 插件，标准版 Caddy 没有内置。
#    用以下任一方式获得带该插件的 Caddy：
#       方式A（推荐）: xcaddy build --with github.com/caddyserver/replace-response
#       方式B: 官方下载页自定义构建 https://caddyserver.com/download 勾选 replace-response
#
# 使用步骤：
#   1. 把所有 example.com 改成你自己的域名。
#   2. 确保 api./img. 两个子域名的 DNS 已解析到本机公网 IP（Caddy 要靠它签证书）。
#   3. caddy run --config ./bangumi-proxy.Caddyfile
#      或放到 /etc/caddy/Caddyfile 后 systemctl reload caddy
# =====================================================================

# ---- API: api.example.com -> api.bgm.tv ----
api.example.com {
    # 把 JSON 里写死的图片域名换成你自己的图片域名（需要 replace-response 插件）
    replace "lain.bgm.tv" "img.example.com"

    reverse_proxy https://api.bgm.tv {
        header_up Host api.bgm.tv
        # 关掉压缩，确保 replace 能改到响应体
        header_up Accept-Encoding ""
        transport http {
            tls
            tls_server_name api.bgm.tv
        }
    }

    # CORS（浏览器端调用时放开；纯服务端调用可删掉 header 与 @opts 这两段）
    header Access-Control-Allow-Origin "*"
    header Access-Control-Allow-Methods "GET,POST,PUT,PATCH,DELETE,OPTIONS"
    header Access-Control-Allow-Headers "Authorization,Content-Type"
    @opts method OPTIONS
    respond @opts 204
}

# ---- Images: img.example.com -> lain.bgm.tv ----
img.example.com {
    reverse_proxy https://lain.bgm.tv {
        header_up Host lain.bgm.tv
        transport http {
            tls
            tls_server_name lain.bgm.tv
        }
    }

    # 浏览器侧缓存（Caddy 标准版无服务端缓存；如需边缘缓存可用 cache-handler 插件）
    header Cache-Control "public, max-age=2592000"
    header Access-Control-Allow-Origin "*"
}

关于 PJAX

插件已经适配常见的 PJAX、Turbo 和 Turbolinks 事件。只有主题使用自定义页面切换逻辑，并且切换后组件没有加载时，才需要在主题回调中调用：

window.PandaBangumi.init();

旧版本使用的 window.initCollection() 已经移除。

就到这里了，关于更详细的插件重构记录，我会在之后整理出来。快来试试看吧～

PandaBangumi for Typecho 更新！

安装

设置

更新

使用

日历

收藏

卡片

注意

关于镜像

关于数据刷新

关于自建镜像

关于 PJAX

添加新评论

已有 2 条评论

PandaBangumi for Typecho 更新！

安装

设置

更新

使用

日历

收藏

卡片

注意

关于镜像

关于数据刷新

关于自建镜像

关于 PJAX

金华日记

Typecho 后台夜间模式插件：DarkMode

添加新评论

已有 2 条评论