- 作者: wugenqiang
- 個人博客:https://wugenqiang.github.io/
- 學習筆記:https://wugenqiang.github.io/CS-Notes
Typora+PicGo+Gitee實現圖片上傳功能
前言
使用舉例:
好了,功能是不是很滿意?節省了很多時間是不是,很 nice!下面來具體實現:
建立 Gitee 圖牀
註冊 gitee 賬號並創建一個倉庫當圖牀
(1)註冊或登陸 Gitee
Gitee 官網網址:https://gitee.com/
註冊賬號在這裏就不說明了啊,註冊好賬號之後登陸 Gitee
(2)新建倉庫當圖牀
然後改圖片中的三處:
因爲我已經建立了 PictureBed 這個倉庫,所以提示已經存在。
生成私人令牌
點擊設置裏的私人令牌,點擊生成私人令牌
提交即可,複製令牌,可以寫在 text 文本中,稍後在 Gitee 圖牀配置中會用到!
!> 注:令牌只會顯示一次,如果不復制的話,就只能重新修改令牌,步驟:修改 --> 重新生成令牌
安裝 PicGo
這是一款圖片上傳的工具,目前支持微博圖牀,七牛圖牀,騰訊雲,又拍雲,GitHub,Gitee等圖牀,在這裏,我們使用 Gitee 作爲圖牀。
下載 PicGo
下載鏈接:https://github.com/Molunerfinn/picgo/releases
選個自己喜歡的版本,點擊進入,找到後綴 .exe
的,點擊後自動下載。或者直接使用最新版。
PicGo 配置 Gitee 圖牀
(1)下載 Gitee 插件
注:若沒有安裝 node.js ,則會安裝不了插件。因爲插件下載需要使用到 node.js 的 npm!
安裝 node.js
node.js 官網下載鏈接:https://nodejs.org/zh-cn/
安裝好之後,打開 PicGo 軟件,點擊插件設置,搜索 gitee,選擇第一個即可,右邊的插件也可以,配置過程也差不多
(2)配置 Gitee 圖牀
首先在 PicGo 設置中選擇 Gitee 圖牀
然後在圖牀設置中進行配置 Gitee 圖牀
點擊確定,就可以使用了,如果只想上傳圖片,到這一步就可以了,不過我還是推薦你繼續往下看,因爲真的很提高開發效率!
Typora 配置 Gitee 圖牀
使用這一步,首先要下載安裝 Typora,官網地址:https://www.typora.io/ 直接安裝即可,操作簡單。
安裝好 Typora 之後,打開進入 Typora,點擊上方目錄:文件 --> 偏好設置 --> 圖像 --> 配置圖牀
關鍵一步:
當點擊驗證圖片上傳選項時,會提示你使用下面網址上傳,記住它!比如我的是 http://127.0.0.1:36677/upload,要保證這裏的地址和 PicGo 中的上傳地址一致,所以要去 PicGo 中去驗證,不一樣就將 PicGo 中的地址改成這裏的就可以了。
到 PicGo 中去驗證:
點擊 PicGo 設置 --> 設置 Sever,若和 Typora 中圖片上傳地址不一樣,改成 Typora 中的監聽端口即可,然後確認。
測試使用
去前言部分看效果,測試嘛,你試試就知道啦!