【解决方案】Typora上传博客图片无法显示解决方案

📔 千寻简笔记介绍

千寻简笔记已开源，Gitee与GitHub搜索chihiro-notes，包含笔记源文件.md，以及PDF版本方便阅读，且是用了精美主题，阅读体验更佳，如果文章对你有帮助请帮我点一个Star～


文章目录

  • 【解决方案】Typora上传博客图片无法显示解决方案
  • 📔 千寻简笔记介绍
  • :man_student:正文
  • :a:解决方案
  • :one:下载安装node.js
  • :two:~~Gitee的操作~~
  • :three:下载安装PicGo
  • :four:Typora的设置：`文件`-->`偏好设置`-->`图像`
  • :five:上传图片


👨🎓正文

🅰️解决方案

1️⃣下载安装node.js

安装成功后windows+R，命令行输入下面命令来检测安装成功和版本号：

node -v 和 npm -v

安装成功后，切记重启windows

作者20230327：gitee图床已不可用，可以使用千牛云做图床，其余步骤不变，可以查看主页千牛云图床教程

2️⃣Gitee的操作

1）进入主界面，点击 + 创建新仓库

【解决方案】Typora上传博客图片无法显示解决方案_解决方案

2）新建仓库–>创建

【解决方案】Typora上传博客图片无法显示解决方案_npm_02

3）申请开源

【解决方案】Typora上传博客图片无法显示解决方案_npm_03

遇到的问题：内容过于简单（请完善内容、README、不少于 10 字真实有效的简介）

解决方案：

第一步：编辑README.md，找些内容复制进去。

【解决方案】Typora上传博客图片无法显示解决方案_下载安装_04

第二步：新建一个文件，随便是什么都可以。

【解决方案】Typora上传博客图片无法显示解决方案_javascript_05

【解决方案】Typora上传博客图片无法显示解决方案_解决方案_06

第三步：点击管理保存提交审核。

提示：当前仓库 Web 页面仅限登录用户可访问。仓库公开申请已提交审核中，我们将在 2 个工作日内为你处理。

4）设置–>私人令牌

【解决方案】Typora上传博客图片无法显示解决方案_npm_07

5）生成新令牌，选择权限，保持最小权限的原则。

【解决方案】Typora上传博客图片无法显示解决方案_前端_08

【解决方案】Typora上传博客图片无法显示解决方案_npm_09

6）复制私人令牌，令牌需要保存好。

提示：如果你忘记了或者希望更新这个私人令牌，可点击右边按钮重新生成，生成新的令牌后，当前的令牌将不能访问 Gitee OpenAPI。

【解决方案】Typora上传博客图片无法显示解决方案_解决方案_10

3️⃣下载安装PicGo

1）链接

2）拉到最下面，找到PicGo-Setup-2.3.0-x64.exe，下载安装。

【解决方案】Typora上传博客图片无法显示解决方案_解决方案_11

3）打开PicGo，安装插件：gitee

提示：默认安装编号1，编号1安装不成功在去安装编号2，安装一个即可。

【解决方案】Typora上传博客图片无法显示解决方案_javascript_12

4）配置图床

【解决方案】Typora上传博客图片无法显示解决方案_下载安装_13

repo：存放照片仓库名（opxc/chihiro-images）

【解决方案】Typora上传博客图片无法显示解决方案_javascript_14

5）测试图床是否成功。

导致失败的原因：仓库开源，还没有通过。

【解决方案】Typora上传博客图片无法显示解决方案_下载安装_15

【解决方案】Typora上传博客图片无法显示解决方案_解决方案_16

在相册和gitee上都可以看到文件表示成功。

【解决方案】Typora上传博客图片无法显示解决方案_解决方案_17

4️⃣Typora的设置：文件–>偏好设置–>图像

【解决方案】Typora上传博客图片无法显示解决方案_前端_18

5️⃣上传图片

【解决方案】Typora上传博客图片无法显示解决方案_下载安装_19