资讯详情

Typora + GitHub + PicGo 图床搭建:把 PicGo 的 GitHub 配置改到 TaoToken 统一通道

📅 2026/10/8 22:25:30 | 华诺云谱 👁 阅读
Typora + GitHub + PicGo 图床搭建:把 PicGo 的 GitHub 配置改到 TaoToken 统一通道
1. Typora 写作场景下的图床链路与 GitHub 直连的痛点Typora 是一款所见即所得的 Markdown 编辑器写技术博客、项目文档、课程笔记的人几乎都绕不开它。它最大的好处是本地写作体验顺滑图片可以直接拖进来。但问题也随之而来拖进来的图片默认存本地路径一旦把 Markdown 复制到 CSDN、语雀、GitHub Issue 或者发给同事图片全部变成裂图。图床就是解决这个问题的方案而 GitHub PicGo 是免费图床里最经典的一套组合。这套组合的链路其实很清晰Typora 负责写作PicGo 负责把本地图片上传到远端并返回一个可访问的 URLGitHub 仓库负责存储图片文件。三者通过 PicGo 的配置文件串起来。但真正动手搭的时候坑集中在三个地方GitHub 仓库的可见性与 Token 权限、PicGo 的 GitHub 配置项填法、以及 Typora 的图像设置如何和 PicGo 对接。很多人卡在 PicGo 上传报 404 或者 Typora 里图片上传后不显示本质都是这三处没对齐。我这次要讲的不是注册一个账号然后点下一步这种注水流程而是把 PicGo 的 GitHub 请求端点改到 TaoToken 统一通道之后怎么完成一次真实的上传、回读 Markdown 链接、确认图片能正常渲染。TaoToken 在这里扮演的是一个统一出口的角色你原本 PicGo 里要填 GitHub 的 API 地址、Token、仓库信息现在把请求端点收敛到 TaoToken 的 API 通道PicGo 的配置结构不变但请求走的是统一入口。这样做的好处是配置项集中、便于多仓库切换也方便后续把其他工具比如 Cline、Claude Code 的图片处理链路接到同一个通道上。适合谁看正在用 Typora 写技术文章、需要把图片托管到 GitHub、并且希望配置可复制、可验证、可排障的人。如果你只是偶尔贴一张图本地路径也够用但只要你开始批量写带截图的教程图床就是刚需。下面从仓库创建开始一步步把链路搭起来每一步都给可复制的配置和验证命令。2. TaoToken 前置准备与 PicGo 的 GitHub 配置项对齐在动 PicGo 之前先把 TaoToken 这边的入口准备好。TaoToken 的官网是 https://taotoken.net/?utm_sourcetaotoken_aicg_blog_endutm_mediumcsdnutm_campaignrewriteutm_content API 入口是 https://taotoken.net/api 注意 API 地址不带 UTM 参数配置里填的时候不要画蛇添足。你需要先去控制台创建一个 API Key路径在 https://taotoken.net/console?utm_sourcetaotoken_aicg_blog_endutm_contentconsoleutm_campaignrewrite 创建完在 API Keys 页面能看到 https://taotoken.net/api-keys?utm_sourcetaotoken_aicg_blog_endutm_contentapi-keysutm_campaignrewrite 。这个 Key 就是后面 PicGo 配置里要填的凭证。这里要澄清一个容易混淆的点PicGo 的 GitHub 图床配置里有一个 Token 字段原本填的是 GitHub Personal Access Token现在我们把请求端点改到 TaoToken 统一通道后这个字段填的是 TaoToken 的 API Key而仓库信息owner、repo、branch、path仍然指向你真实的 GitHub 仓库。也就是说TaoToken 负责请求的转发与鉴权收敛GitHub 仓库负责实际存储。这样配置的好处是你不需要在每台机器上散落多个 GitHub Token只需要一个 TaoToken Key换仓库时改 repo 字段即可。PicGo 的 GitHub 配置项一共就这么几个我列个对照表避免你填错位置配置项含义填什么repo仓库全名你的用户名/仓库名如yourname/imgbedbranch分支一般填main或mastertoken鉴权凭证TaoToken 的 API Keypath存储路径如images/留空则存根目录customUrl自定义访问域名可留空或填 GitHub 原始域名apiEndpoint请求端点改为 TaoToken 统一通道地址其中apiEndpoint是这次改造的关键。PicGo 默认请求https://api.github.com我们把它改成 TaoToken 的 API 通道让上传请求先经过统一入口。改完之后 PicGo 的界面操作完全不变你还是在 Typora 里按快捷键上传只是底层请求的出口变了。在准备阶段还要确认一件事你的 GitHub 仓库必须是公开的Public否则图片 URL 在外部渲染时会 404。私有仓库的 raw 链接需要鉴权Typora 预览和 CSDN 渲染都拿不到。创建仓库时选 Public初始化一个 README 即可。仓库建好后记下owner/repo和分支名下一步写配置要用。如果你还没装 PicGo去官网下载对应平台的安装包Windows 选.exemacOS 选.dmg。安装完成后先不要急着点图床设置我们直接改配置文件这样更可控也方便你复制粘贴。3. 可复制的 PicGo 配置文件片段与 Typora 图像设置PicGo 的配置文件在不同系统下路径不同先找到它WindowsC:\Users\用户名\.picgo\config.jsonmacOS / Linux~/.picgo/config.json如果文件不存在先打开一次 PicGo 图形界面随便点一下图床设置它会自动生成。然后关掉 PicGo用编辑器打开config.json把 GitHub 图床这一段改成下面这样。注意 JSON 里不能有注释我下面的注释只用于说明你复制时要去掉。{ picBed: { current: github, github: { repo: yourname/imgbed, branch: main, token: 你的TaoToken_API_Key, path: images/, customUrl: , apiEndpoint: https://taotoken.net/api } }, picgoPlugins: {}, settings: { logLevel: [info, warn, error] } }几个字段再强调一遍repo是用户名/仓库名中间是斜杠不是空格branch要和你 GitHub 仓库的默认分支一致现在新建仓库默认是main老仓库可能是master填错会报Branch not foundtoken填 TaoToken 的 API KeyapiEndpoint填https://taotoken.net/api不要带末尾斜杠也不要带 UTM 参数。path建议填images/这样所有图片集中在一个目录方便管理。改完保存重新打开 PicGo。此时在 PicGo 的「图床设置」里应该能看到 GitHub 那一栏已经填好了。你可以先点「设为默认图床」确保上传时走的是 GitHub。接下来配置 Typora。打开 Typora进入「文件」→「偏好设置」→「图像」做三件事第一插入图片时选择「上传图片」并勾选「对本地位置的图片应用上述规则」和「对网络位置的图片应用上述规则」。这样你拖进来的本地图片会自动触发上传。第二上传服务选择「PicGo(app)」然后点「验证图片上传选项」。如果配置正确Typora 会调用 PicGo 上传一张测试图并返回一个 URL。这一步是整条链路的第一次真实验证如果这里报错说明 PicGo 配置有问题先别往下走。第三PicGo 路径要指向你实际安装的可执行文件。Windows 一般是C:\Program Files\PicGo\PicGo.exemacOS 是/Applications/PicGo.app。路径填错会提示「PicGo 未找到」。这里有个细节Typora 调用 PicGo 时走的是 PicGo 的命令行接口而不是图形界面。所以 PicGo 必须处于运行状态可以最小化到托盘否则 Typora 上传会失败。我试过把 PicGo 完全退出Typora 点上传直接报连接失败托盘里留着就行。配置完成后Typora 的图像设置面板大概是这样# Typora 图像设置示意实际在 GUI 中勾选 [image] insert_type upload upload_service picgo picgo_path C:\\Program Files\\PicGo\\PicGo.exe apply_to_local true apply_to_network true这段 TOML 只是帮你理解各选项的对应关系Typora 实际不读这个文件你还是在 GUI 里勾选。勾选完成后随便在文档里拖一张图观察 Typora 底部状态栏会显示「上传中…」成功后图片路径会从本地路径变成https://开头的 URL。4. 验证请求执行一次上传并回读 Markdown 链接配置写完不算完必须做一次端到端验证。验证的目标是在 Typora 里插入一张本地图片触发上传拿到远端 URL并且这个 URL 能在浏览器里打开、能在 Markdown 预览里正常渲染。第一步准备一张测试图。随便截个图保存为test-upload.png放在桌面。然后在 Typora 里新建一个文档把这张图拖进去。此时 Typora 会弹出上传进度几秒后图片下方会出现一个可点击的链接图标。第二步检查上传结果。打开 PicGo 的「相册」页面应该能看到刚才上传的图片记录包含文件名和 URL。URL 形如https://raw.githubusercontent.com/yourname/imgbed/main/images/test-upload.png。复制这个 URL在浏览器里打开能正常显示图片就说明上传成功。第三步回读 Markdown 链接。在 Typora 里按Ctrl/切换到源码模式你会看到图片的 Markdown 语法从![](test-upload.png)变成了![](https://raw.githubusercontent.com/...)。这就是我们要的结果本地路径被替换成了远端 URL。第四步验证渲染。切回预览模式图片应该正常显示。再把这段 Markdown 复制到 CSDN 的编辑器里图片同样能渲染。如果 CSDN 里裂图多半是 URL 用了私有仓库或者分支名不对。如果你想用命令行验证PicGo 提供了 CLI 接口。在终端里执行# 调用 PicGo 上传一张图片输出 JSON 结果 picgo upload /path/to/test-upload.png返回结果里会有imgUrl字段就是远端地址。你可以用curl再确认一次这个地址可访问curl -I https://raw.githubusercontent.com/yourname/imgbed/main/images/test-upload.png返回HTTP/2 200就说明图片真实可访问。如果返回404检查仓库是否公开、分支名是否正确、path是否和实际上传路径一致。还有一个验证点是 TaoToken 通道是否生效。你可以在 PicGo 的日志里看到请求的端点。打开 PicGo 的「设置」→「日志」找到最近一次上传记录请求地址应该是https://taotoken.net/api开头而不是https://api.github.com。这一步确认了请求确实走了统一通道。整个验证流程走完你应该得到三个确定的结果PicGo 相册里有记录、浏览器能打开 URL、Typora 源码模式里是远端链接。三个都满足链路就算通了。5. 本篇常见错误排查401、local proxy failed、reading choices、OAuth配置过程中最容易撞上的几类报错我按真实日志逐条拆。401 Unauthorized。这是鉴权失败出现在 PicGo 上传时。原因通常是token字段填错。如果你把 GitHub Token 和 TaoToken Key 搞混了或者 Key 复制时多了空格都会 401。排查方法打开config.json确认token字段是 TaoToken 的 API Key前后无空格。然后去 TaoToken 的 API Keys 页面重新复制一次粘贴时注意不要带上换行。改完保存重启 PicGo 再试。local proxy failed / connect ECONNREFUSED。这个报错说明 PicGo 请求apiEndpoint时连不上。常见原因是apiEndpoint填了带末尾斜杠的地址或者填了带 UTM 参数的完整 URL。正确写法是https://taotoken.net/api干净利落。另一个原因是本机网络环境对taotoken.net的解析异常可以用ping taotoken.net确认能通。如果公司网络有出口限制换一个网络环境再试。reading choices / Cannot read property choices of undefined。这个报错一般出现在把 PicGo 的请求端点接到某个对话类 API 时返回结构不是图床期望的 JSON。图床上传期望的返回是{url: ...}或 GitHub 标准的{content: {...}}结构而对话类接口返回的是choices数组。如果你在apiEndpoint里误填了模型对话的地址就会撞这个错。确认apiEndpoint填的是https://taotoken.net/api这个统一通道而不是模型对话的 deep link。模型对话入口是 https://taotoken.net/model-chat?utm_sourcetaotoken_aicg_blog_endutm_contentmodel-chatutm_campaignrewrite 那是给聊天用的不要填进 PicGo。OAuth / Bad credentials。这个报错说明 GitHub 侧的凭证校验没过。如果你用的是 GitHub Personal Access Token需要勾选repo权限如果走 TaoToken 通道则确认 TaoToken Key 有效且未过期。另外GitHub 在 2021 年后不再支持密码鉴权任何用账号密码的方式都会报 OAuth 错误。排查顺序先确认token字段是 TaoToken Key再确认仓库repo字段拼写正确最后确认分支存在。Branch not found。branch字段和仓库实际分支不一致。新建仓库默认main但有些老仓库是master。去 GitHub 仓库首页看默认分支名填一致即可。图片上传成功但 Typora 不显示。这种情况多半是customUrl配置问题。如果你填了自定义域名但域名没配好图片 URL 会指向一个打不开的地址。建议customUrl留空用 GitHub 原始 raw 域名。另外确认仓库是 Public私有仓库的 raw 链接需要鉴权Typora 拿不到。PicGo 命令行调用失败。Typora 调用 PicGo 走的是 CLI如果 PicGo 没运行或者安装路径和 Typora 里填的不一致就会失败。确认 PicGo 在托盘运行且 Typora 里的 PicGo 路径指向实际可执行文件。排查时有一个通用技巧先看 PicGo 日志日志里会记录请求的完整 URL 和返回状态码。401 看 token404 看 repo 和 branch连接失败看 apiEndpoint。把日志里的 URL 复制出来用curl手动请求一次能快速定位是配置问题还是网络问题。6. 把链路固化下来多仓库切换与长期维护链路跑通之后真正影响长期使用的是维护成本。这里给几个实操建议。第一把config.json备份一份。PicGo 升级或者重装时配置文件可能被覆盖。备份路径建议放在你的 dotfiles 仓库里和 Typora 的主题配置放一起。恢复时直接覆盖回去省去重新填配置的麻烦。第二多仓库切换。如果你有多个 GitHub 仓库分别存不同项目的图片不需要改token只需要改repo和path。可以在 PicGo 里配置多个 GitHub 图床实例每个实例对应一个仓库用的时候在 PicGo 界面切换默认图床。这样 Typora 上传时会走当前默认的那个。第三长期编码和 Agent 场景。如果你除了写博客还在用 Claude Code、Cline 这类工具做开发图片处理链路可以统一到同一个通道。Claude Code 的接入配置在 https://taotoken.net/claude-code?utm_sourcetaotoken_aicg_blog_endutm_contentclaude-codeutm_campaignrewrite Coding Plan 在 https://taotoken.net/coding-plan?utm_sourcetaotoken_aicg_blog_endutm_contentcoding-planutm_campaignrewrite 。这些工具和 PicGo 共用同一个 API 出口配置项集中管理换 Key 时只改一处。第四文档参考。TaoToken 的接入文档在 https://taotoken.net/doc?utm_sourcetaotoken_aicg_blog_endutm_contentdocutm_campaignrewrite 里面有各工具的配置示例。遇到配置项不确定时先翻文档再动手比在搜索引擎里翻半天高效。最后说一个我踩过的坑PicGo 的path字段如果填了images/上传后的 URL 里会带这个路径。如果你后来改了path旧图片的 URL 不会自动迁移已经发出去的文章里的图片会裂。所以path一旦定下来尽量别改。如果非要改用 GitHub 的移动功能把旧文件挪到新目录保持 URL 结构一致。链路固化之后你的写作流程就变成Typora 里拖图自动上传Markdown 里是远端链接复制到任何平台都能渲染。整个过程不需要手动打开浏览器传图也不需要记图片存在哪。这才是图床真正省事的地方。
📝

华诺云谱内容团队

资深建站顾问 · 行业研究员

10年+企业数字化服务经验,专注智能建站、SEO优化与品牌营销,持续输出建站技巧、行业洞察与营销干货,已帮助5000+企业实现数字化增长。

你可能需要的服务

订阅华诺云谱资讯周报

每周一封,精选建站技巧、SEO与营销干货,直达邮箱。已有 8,000+ 企业主订阅,助你少走弯路。

↑