Skip to content

Repository files navigation

pixiv-viewer

Pixiv Viewer Kai

Yet Another Pixiv Illust & Novel Viewer.

Port of journey-ad/pixiv-viewer

JavaScript Vue.js Stylus PWA Cloudflare

Version License Pages Downloads

中文 | English

又一个 Pixiv 阅览工具,提供 pixiv 的插画、动图、漫画和小说等作品的在线浏览,适配多端样式,提供多种浏览布局选择,支持 PWA 安装,支持自定义 API 与图床,支持 RefreshToken/OAuth/Cookie 方式登录。

预览: 🔗 pixiv.pictures

下载: ⏬ GitHub Releases


📖 目录


✨ 功能特性

🏠 首页功能

功能 说明
多类型内容浏览 插画、漫画、小说、珍藏册等
排行榜 每日热门作品排行
特辑推荐 官方精选特辑内容
个性化推荐 基于个人喜好的作品推荐
发现页面 全站热门与新鲜内容
随便看看 随机浏览优质作品
珍藏册 集中展示喜爱作品

🔍 搜索功能

功能 说明
全方位搜索 插画·漫画、小说、用户、珍藏册
搜索热词 热门搜索词(长按查看标签封面)
智能补全 关键词自动补全建议
搜索条件 按收藏数、投稿时间等筛选
热门预览 非会员预览热门作品(前 30 条)
以图搜图 上传图片搜索相似作品
数字 ID 直达 直接输入作品 / 用户 ID 快速跳转

📊 排行榜

功能 说明
多维度排行 综合 / 插画 / 漫画 / 动图 / 小说
R18 / AI 排行 成人内容与 AI 生成作品排行
历史排行 按日期查看历史排行榜

📱 动态

功能 说明
关注更新 关注用户的新作品
我的收藏 已收藏的插画和小说
已关注用户 关注用户列表
推荐用户 推荐用户列表
全站最新 全站最新上传的作品

🖼️ 作品页面

功能 说明
插画操作 收藏、取消收藏、下载、评论、分享
源站链接 快速跳转 Pixiv 源站
ID 复制 一键复制作品 / 作者 ID
动图播放 支持 Ugoira 动图播放
动图下载 ZIP / GIF / WebM / APNG / MP4 / AVIF

👤 作者信息页面

功能 说明
关注管理 关注、取关作者
作品浏览 插画、漫画、收藏、小说、珍藏册
系列查看 漫画系列和小说系列
标签浏览 作者常用插画标签
相关用户 发现相似作者
推特图片 查看作者在 X 上发布的图片 / 视频

小说阅读

功能 说明
小说下载 TXT / HTML / Markdown / DOC / PDF / EPUB
阅读设置 自定义字体、颜色、阅读方向等
富文本排版 小说富文本格式渲染
阅读进度记忆 自动记录滚动位置,下次续读
原生阅读器 WebView 沉浸式阅读体验
小说翻译 集成在线翻译功能

漫画翻译

功能 说明
一键翻译 内置翻译引擎,无需外部服务
本地推理 ONNX Runtime Web 本地完成检测 / OCR / 修复
排版引擎 横排 / 竖排文字,自动匹配气泡与阅读顺序
多模型提供商 SiliconCloud 等多家 LLM 驱动
原图 / 译文切换 一键对比翻译结果

⚙️ 设置

登录方式

功能 说明
RefreshToken 登录 使用 Pixiv RefreshToken 直接登录
OAuth 登录 通过 Pixiv OAuth 授权登录
Cookie 登录 Cookie 方式登录(不推荐)

内容控制

功能 说明
R18 开关 控制是否显示成人内容
AI 作品开关 控制是否显示 AI 生成的作品
本地黑名单 屏蔽标签 / 用户,标签化 UI 管理,可单独移除

浏览体验

功能 说明
多语言支持 简体 / 繁体中文、英文、俄文等
深色模式 护眼夜间模式
主题色自定义 自定义应用主题颜色
图片信息流布局 瀑布流、网格、虚拟列表等
图片画质选择 Medium / Large / Large(WebP) 等
左右滑动浏览 详情页左右滑动切换
页面过渡动画 多种页面切换动画效果

网络与数据

功能 说明
多图床选择 切换多个图片反代服务
多 API 实例选择 切换多个后端 API 实例
AppAPI 代理模式 直连 Pixiv App API(需自建代理)
pximg 图片直连 直连 Pixiv 原图服务器
IndexedDB 缓存 本地缓存提升加载速度
历史记录 查看作品浏览历史
清除缓存 一键清除应用缓存

下载功能

功能 说明
列表长按下载 长按列表图片快速下载
列表长按屏蔽 长按快速屏蔽用户
文件系统访问 API 使用现代浏览器 File System Access API
Tampermonkey 支持 支持通过油猴脚本下载
文件名格式自定义 自定义下载文件名模板
动图多格式导出 ZIP / GIF / WebM / APNG / MP4 / AVIF

备份还原

功能 说明
设置备份 备份 / 还原应用设置
浏览记录备份 备份 / 还原浏览历史
云端同步 PBKDF2 + AES 加密,冲突检测与智能合并
导出 RefreshToken 供其他应用使用

客户端支持

平台 支持
PWA 安装
Android / Windows
iOS / macOS

📸 截图展示

  • 移动端

查看更多


  • 桌面端

查看更多  


🚀 技术相关

前端架构

  • Vue 2.7:使用 Vue 2.7 版本,支持 Composition API
  • Vue Router:单页面应用路由管理,支持路由别名和历史记录
  • Vuex:集中式状态管理,应用设置持久化
  • Vue I18n:完整的国际化支持,支持多语言切换

UI 组件

  • Vant UI:基于 Vant UI 组件库,提供移动端优先的交互体验
  • Stylus:CSS 预处理器,支持嵌套和变量
  • 响应式设计:自动适配移动端、平板、桌面端

PWA 支持

  • Service Worker:支持离线访问和缓存策略
  • App Shell:应用外壳架构,提升首屏加载速度
  • 安装提示:支持桌面端和移动端的 PWA 安装
  • 应用快捷方式:支持桌面快捷方式(搜索、排行、动态、设置)

性能优化

  • 图片懒加载:移动端默认启用图片懒加载
  • 虚拟滚动:使用虚拟列表技术支持大量数据的高性能渲染
  • 路由过渡动画:使用 View Transitions API 实现流畅的页面切换
  • 代码分割:按需加载部分应用库,减少加载体积

高级特性

  • 多种布局引擎

    • Masonry(瀑布流布局)
    • Grid(网格布局)
    • Justified(两端对齐布局)
    • VirtualList(虚拟列表)
    • VirtualSlide(虚拟轮播)
  • 动图处理

    • 使用 gif.js 生成 GIF
    • 使用 ts-whammy 生成 WebM
    • 使用 modern-mp4 生成 MP4
    • 支持动图 ZIP 原文件下载
  • 文件系统访问

    • 使用 WICG File System Access API
    • 支持直接写入本地目录
    • 支持按作者分类下载
  • 网络请求

    • Axios 封装 HTTP 客户端
    • 支持请求重试机制
    • 支持多种代理服务切换
  • 存储方案

    • LocalForage 封装 IndexedDB
    • 支持 LocalStorage 和 SessionStorage
  • 漫画翻译引擎

    • ONNX Runtime Web(WebGPU/WASM)本地推理
    • Worker 线程推理(Comlink),避免阻塞主线程
    • 文本检测 + PaddleOCR 识别 + 图像修复流水线
    • 多提供商 LLM 翻译(SiliconCloud / DeepSeek / OpenAI 等)
    • Canvas 横排/竖排文字排版
  • 云端同步

    • PBKDF2 密钥派生 + AES 加密
    • 双向认证与作用域选择
    • 冲突检测(409)与智能合并

📦 开发指南

环境要求

  • Node.js >= 16.x
  • pnpm >= 9.x

安装依赖

pnpm install

开发模式

pnpm serve

应用将在 http://localhost:8080 启动,支持热重载。

生产构建

pnpm build

构建产物将输出到 dist 目录。

代码检查

pnpm lint

构建分析

pnpm analyze

将生成 Bundle 分析报告,帮助优化包体积。


部署说明

  1. 环境准备:Git、Node.js、pnpm

  2. 准备好 PxveAPI/HibiAPI 实例和 pximg 代理,参考:

  1. 下载或者 git clone 项目代码到本地目录

  2. 进入项目目录,在项目根目录下新建 .env 文件,参照 .env.example 的格式填入环境变量

cp .env.example .env
# 编辑 .env 文件,填入必要的配置
# ⚠ 注意不要将 `.env` 文件提交到 Git 仓库
  1. 在代码里全局搜索 pixiv.pictures 替换为你自己的域名

  2. 执行如下命令进行打包,打包完的文件在 dist 目录里,可自行部署到服务器

pnpm install
pnpm build

💖 赞助支持

如果这个项目对你有帮助,欢迎请我喝杯咖啡

ko-fi

您的支持是我持续更新的动力!


❓ 常见问题

如何获取 RefreshToken?

参考教程:https://www.nanoka.top/posts/e78ef86/

提示 API 超限或 Rate Limit

  • 在设置中切换其他 API 实例
  • 使用 RefreshToken 或 OAuth 方式登录

图片加载很慢

  • 在设置中切换其他图床
  • 启用 pximg 图片直连模式(需要良好的网络环境)
  • 下载客户端版本使用

使用美国/英国 IP 无法查看某些作品

参考 Pixiv 官方公告:https://www.pixiv.net/info.php?id=10837

建议:

  1. 使用自己的账号登录
  2. 在 Pixiv 官方网页端里设置地区为非美国/英国地区(建议选择日区)

Cookie/SessionID 登录出错

建议使用 RefreshToken 方式登录,更加稳定可靠。

列表与详情图片不匹配或重复、搜索结果与搜索标签不匹配

这是自建 API 的 CDN 缓存导致的,解决方案:

  • 切换其他 API 实例
  • 登录后使用

提示“尚无此页”或“尚无权限浏览该作品”或“您的访问权限被限制了”

通常表示该作品已被作者删除或隐藏。

Android 版本点击下载就闪退

  • 在系统设置中授予应用存储权限
  • 下载最新版本后再尝试

如何安装 iOS 版本?

可到 Github Releases 下载

注意 iOS 版本未签名,需要自行签名侧载安装:

自建部署如何预设图床与 API 实例?

参照 .env.example 里的注释或参考讨论:


🤝 贡献指南

欢迎贡献代码、翻译或提出建议!

翻译

本项目使用 Vue I18n 进行国际化。

非中文语言翻译主要来自机器翻译,如有不妥,欢迎贡献翻译。

翻译文件位于 src/locales/ 目录。

代码贡献

  1. Fork 本仓库
  2. 创建特性分支 (git checkout -b feature/AmazingFeature)
  3. 提交更改 (git commit -m 'Add some AmazingFeature')
  4. 推送到分支 (git push origin feature/AmazingFeature)
  5. 开启 Pull Request

报告问题

请使用 GitHub Issues 报告 bug 或提出功能请求。


🏆 致谢

特别感谢

贡献者

相关项目

服务

技术栈


🔗 相关站点


📜 免责声明

本项目与 pixiv.net(ピクシブ株式会社)无任何隶属关系。

本项目网站、APP 所展示的所有作品的版权均为 Pixiv 或其原作者所有。

本项目仅供交流与学习,不得用于任何商业用途。


📄 许可证

本项目基于 AGPL-3.0 License 开源。

Copyright © 2020 Jad

Copyright © 2022 Sakura Yumine


如果这个项目对你有帮助,请给一个 ⭐️ Star 支持一下!

Made with ❤️ by Sakura Yumine

About

Yet Another Pixiv Illust&Novel Viewer. 又一个 Pixiv 阅览工具,提供 pixiv 的插画、动图、漫画和小说等作品的在线浏览,适配多端样式,提供多种浏览布局选择,支持 PWA 安装,支持自定义 API 与图床,支持 RefreshToken/OAuth/Cookie 方式登录。

Topics

Resources

Stars

741 stars

Watchers

5 watching

Forks

Releases

Sponsor this project

Contributors

Languages