利用碼雲OpenApi|GiteePage搭建圖牀

因爲自建博客需要圖片服務器,考慮到用本機的圖片服務器,需要考慮數據備份,鏈接路徑等一系列問題,還是推薦使用第三方的服務

當前各個主要平臺的oss服務,有免費的有收費的,這裏就不多說了,免費可以用但是不太穩定萬一哪天不開放了被當做韭菜,付費的雖好,但是輕度使用場景下就大材小用了

本文只討論使用碼雲搭建第三方圖牀的問題,好了,開始使用碼雲搭建圖牀的具體操作

方式一:通過gitee倉庫文件上傳頁面實現

在碼雲上建一個空的遠程倉庫,然後建一個空的文件夾

這裏有幾點建議

  • 不要輕易修改倉庫的名字和文件夾的名字
  • 注意命名規範簡潔,有點強迫症不好意思,醜的鏈接接受不了

最終的路徑像這樣,當然你要圖片鏈接更加簡潔使用根目錄當我沒說
https://gitee.com/iMist/res/tree/master/upload_images

然後點擊上傳文件,進入上傳頁面,上傳一張圖片,這個就是我們以後會使用的圖牀界面

其實這個時候可以使用碼雲庫的鏈接訪問了,如果你的庫是public

你的鏈接類似這樣https://gitee.com/iMist/res/raw/master/upload_images/img_gitee_pages.png

注意:圖片鏈接需要將blob替換成raw,纔是圖片的永久鏈接

其實這個路徑可以用在博客中了,路徑還算簡短,但是到此爲止,就太沒有意思了,你用接口測試工具訪問一下這個圖片,每次都在幾百毫秒左右,我用wordpress本來就放棄了
一部分的速度要求,現在還搞這麼慢,不能忍

方式二:利用碼雲提供的Gitee Pages搭建靜態頁面服務

這個可以用來搭建靜態博客hexo等,但是我們是要來搭建圖牀的
img

img

點擊Gitee Pages,將當前分支一般是master分支作爲部署的分支,選擇根目錄(不填就行了代表整個倉庫),然後點擊啓動就開始部署了

部署完成就可以訪問之前上傳的測試圖片,地址像這樣https://imist.gitee.io/res/upload_images/img_gitee_pages.png

保留上傳鏈接作爲快捷圖牀服務

https://gitee.com/iMist/res/upload/master/upload_images
以後就可以快速打開圖牀了,接口測試工據測試一下,緩存生效了,速度很快,適合靜態資源的保存

寫在最後,這種方式有點不好的就是每次都要重新部署一下服務才能訪問圖片,要掏錢才能推送立刻部署

方式三:通過碼雲OpenAPI自行搭建圖牀(推薦)

前面兩種方法相當簡單,但是比較low,都免費了還方便使用git管理,管他呢,現在推薦第三種方式通過碼雲openapi編寫代碼實現上傳圖片並且返回url html以及markdown格式的鏈接
首先
首先了解一下碼雲的OpenApi
碼雲OpenApi文檔

點擊倉庫->新建文件接口文檔
img
好的,我們現在看一下文件上傳接口規範
img
這裏特意提一下access_token 這個參數就是碼雲OpenApi私人令牌,可以直接在申請,但是申請的令牌只有一天的有效期,這顯然不是我們需要的
,圖片需要base64編碼(暗示不可以上傳大圖),接口請求參考如下
img
上傳圖片響應
img

再來介紹第二個接口,這裏直接通過接口測試工具展示了,比較需要注意的是登錄賬號是綁定的郵箱號(POST請求,Content-Type: application/x-www-form-urlencoded ) ,client_secretclient_id需要創建第三方應用獲取,scope代表授權項,空格隔開

curl -X POST --data-urlencode "grant_type=password" --data-urlencode "username={email}" --data-urlencode "password={password}" --data-urlencode "client_id={client_id}" --data-urlencode "client_secret={client_secret}" --data-urlencode "scope=projects user_info issues notes" https://gitee.com/oauth/token

img
密碼登錄響應

img
第三個接口是當 access_token 過期後(有效期爲一天),你可以通過以下 refresh_token 方式重新獲取 access_token( POST請求 ),請求響應和第二個登錄接口響應一致
https://gitee.com/oauth/token?grant_type=refresh_token&refresh_token={refresh_token}

瞭解完這些就直接編寫代碼就可以了,這裏我不清楚可不可以用部署的靜態頁面通過代碼上傳,沒有測試過,但是我是部署了一個輕量級服務來實現的,代碼這裏就不發了,就是調用一下接口就行了,比較簡單,看一下最終的效果(我寫的頁面比較low,沒有潤色打磨,畢竟是自己用的將就看一下)
img

小確幸

每一絲靈感都值得被記錄,每一筆記錄都是成長,每一點成長都值得歡呼

博主個人站: www.imisty.cn
CSDN博客: https://blog.csdn.net/lookinthefog
博客園 :https://imist.cnblogs.com/

希望能夠認識一些熱愛技術的小夥伴,歡迎友鏈接喲

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章