<kbd id="afajh"><form id="afajh"></form></kbd>
<strong id="afajh"><dl id="afajh"></dl></strong>
    <del id="afajh"><form id="afajh"></form></del>
        1. <th id="afajh"><progress id="afajh"></progress></th>
          <b id="afajh"><abbr id="afajh"></abbr></b>
          <th id="afajh"><progress id="afajh"></progress></th>

          Typora + GitHub = 效率

          共 4973字,需瀏覽 10分鐘

           ·

          2021-01-28 20:16

          往期熱門(mén)文章:

          1、往期精選優(yōu)秀博文都在這里了!
          2、女朋友為我寫(xiě)了一個(gè)防猝死插件
          3、請(qǐng)謹(jǐn)慎使用Arrays.asList、ArrayList的subList
          4全球頂級(jí)的14位程序員!膜拜!
          5、為什么我不建議你用去 “ ! = null " 做判空?

          Typora 是一款簡(jiǎn)單、高效而且優(yōu)雅的 Markdown 編輯器,它提供了一種所見(jiàn)即所得的全新的 Markdown 寫(xiě)作體驗(yàn)。它把源碼編輯和效果預(yù)覽兩者合二為一,在輸入 Markdown 代碼的時(shí)候即時(shí)生成預(yù)覽效果。Typora 的一切都圍繞純粹的生產(chǎn)效率而設(shè)計(jì)。

          Typora一直是老逛最喜歡的 markdown 編輯器,寫(xiě)博客、記筆記的首選軟件。相信大部分朋友也在使用 Typora 這款軟件。

          但是 Typora 之前是不支持圖床功能的,只能通過(guò)第三方插件實(shí)現(xiàn)圖片自動(dòng)上傳的功能。不過(guò)最近 Typora 有了更新,終于支持圖床功能了,接下來(lái)我會(huì)分別介紹借助插件上傳圖片和 Typora 自身的圖床功能。老逛親身體驗(yàn),Typora 軟件自帶的圖片上傳功能很慢,不如自己寫(xiě)的插件好用。

          1. 借助插件實(shí)現(xiàn)自動(dòng)上傳

          之前老逛也是使用第三方插件進(jìn)行圖片的上傳,該插件安裝后的使用效果如下:

          把圖片拖進(jìn) md 編輯器,圖片會(huì)自動(dòng)上傳到圖床,上傳成功圖片頂部會(huì)出現(xiàn)綠色背景的白字進(jìn)行提醒。該插件支持、GitHub、七牛云、阿里云、碼云等。

          該插件是 Thobian 同學(xué)開(kāi)源的插件,僅支持 Windows 系統(tǒng)。

          2. 插件安裝

          安裝環(huán)境

          Typora 版本:0.9.68 (Windows x86)

          下載地址:https://typora.io/windows/typora-update-ia32-0320.exe

          Typora安裝目錄:D:\Program Files\Typora ,或者安裝在其他目錄

          安裝步驟

          1. 下載插件代碼,下載地址:https://github.com/Thobian/typora-plugins-win-img
          2. 復(fù)制插件相關(guān)代碼文件:window.html、plugins
          3. 將復(fù)制的插件代碼文件,粘貼到 Typora 安裝目錄下的 resources\app 文件夾下
          4. 安裝完成,重啟 Typora
          插件配置
          接下來(lái)可以配置將圖片上傳到哪個(gè)圖床,打開(kāi) plugins/image/upload.js 文件,拉到最下面 將最后一行的 $.image.init(); 按照下面的說(shuō)明進(jìn)行配置:
          上傳到Github - 推薦
          免費(fèi)且無(wú)需自己搭建服務(wù)器,是一種不錯(cuò)的方式,配置中需要填寫(xiě)token,添加 token 可登陸 GitHub后訪問(wèn)此鏈接:https://github.com/settings/tokens
          僅給 typora 使用的 token 授予最小的權(quán)限(repo.public_repo) 即可。
          //注冊(cè)token的盡量不要跟其他應(yīng)用共用,同時(shí)授予最小權(quán)限
          //免費(fèi)+無(wú)需自己搭建服務(wù)器,是一種不錯(cuò)的方式
          $.image.init({
          ????target:'github',
          ????quality:1, //圖片壓縮開(kāi)關(guān),1表示原圖上傳 取值為:0
          ????github:{
          ????????Token : 'xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx', // 添加一個(gè)僅給typora使用的token 授予最小的權(quán)限(repo.public_repo) ,添加token:https://github.com/settings/tokens
          ????????CommitterName : 'nickname', // 提交人昵稱,寫(xiě)你github的昵稱
          ????????CommitterEmail : '[email protected]', // 提交人郵箱,寫(xiě)你github的郵箱
          ????????Repository : 'xxxxxxxxxxxxxxxxxxxxxxxxxxxxxx', // github項(xiàng)目名,比如你的項(xiàng)目地址是:https://github.com/Thobian/typora-plugins-win-img 那就是后面的“Thobian/typora-plugins-win-img”
          ????????Filepath : 'typora', // 圖片在項(xiàng)目中的保存目錄,可以不用提前創(chuàng)建目錄,github提交時(shí)發(fā)現(xiàn)沒(méi)有會(huì)自動(dòng)創(chuàng)建
          ????????// 【注意:開(kāi)啟CDN后會(huì)將原github的文件地址換成 jsDelivr 的地址,如出現(xiàn)鏡像出現(xiàn)國(guó)內(nèi)無(wú)法訪問(wèn),或者不再繼續(xù)運(yùn)營(yíng)你的圖片也將不能訪問(wèn)到,請(qǐng)謹(jǐn)慎開(kāi)啟該功能】
          ????????jsDelivrCND : false, // 是否開(kāi)啟GitHub圖片走鏡像,國(guó)內(nèi)有時(shí)候訪問(wèn)不太方便,如要打開(kāi)設(shè)置為:true
          ????}
          });
          上傳到自建服務(wù)器
          將圖片上傳地址換成你自己的后端接口,由于調(diào)用時(shí)不帶登錄態(tài),請(qǐng)注意接口安全別被壞人利用。
          為了防止壞人利用你服務(wù)器接口,插件支持設(shè)置請(qǐng)求頭,可一定程度避免被利用
          接口協(xié)議:
          • 請(qǐng)求方式:POST
          • 請(qǐng)求參數(shù):data:image/png;base64,xxxxxx (圖片原轉(zhuǎn)換成base64后的值)
          • 成功響應(yīng):{‘code’:0, ‘message’:‘成功’, ‘data’:{‘url’=>‘imageURL’}}
          • 失敗響應(yīng):{‘code’:x, ‘message’:‘錯(cuò)誤原因’, ‘data’:null} 失敗時(shí),code必須未非0
          后端接口代碼可以參考代碼文件:upload.php
          $.image.init({
          ????target:'self',
          ????self:{
          ????????//默認(rèn)上傳地址 https://jiebianjia.com/typora-plugins/upload.html
          ????????url:"https://you-server/the-image-upload-path",
          ????????headers:{
          ????????????//默認(rèn): token:B40289FC92ED660F433BF0DB01577FDE
          ????????????token:"value"??//自己定義好,并在接口里面檢查避免壞人利用你接口
          ????????}
          ????}
          });
          上傳到騰訊云OSS
          //為了你騰訊云的安全,強(qiáng)烈建議你為這個(gè)操作添加一個(gè)單獨(dú)的子賬號(hào),并只開(kāi)啟API訪問(wèn)權(quán)限
          //添加子賬號(hào):https://console.cloud.tencent.com/cam
          //更多關(guān)于騰訊云子賬號(hào)(CAM)說(shuō)明:https://cloud.tencent.com/document/product/598/13665
          $.image.init({
          ????target:'tencent',
          ????tencent : {
          ????????Bucket: 'bucket-name', // 對(duì)象存儲(chǔ)->存儲(chǔ)桶列表(存儲(chǔ)桶名稱就是Bucket)
          ????????SecretId: 'SecretId', // 訪問(wèn)控制->用戶->用戶列表->用戶詳情->API密鑰 下查看
          ????????SecretKey: 'SecretKey', // 訪問(wèn)控制->用戶->用戶列表->用戶詳情->API密鑰 下查看
          ????????Region: 'Region', // 對(duì)象存儲(chǔ)->存儲(chǔ)桶列表(所屬地域中的英文就是Region)
          ????????folder: 'typora', // 可以把上傳的圖片都放到這個(gè)指定的文件夾下
          ????},
          });
          上傳到阿里云OSS
          //為了你阿里云賬號(hào)的安全,強(qiáng)烈建議你為這個(gè)操作添加一個(gè)單獨(dú)的子賬號(hào),并只開(kāi)啟API訪問(wèn)權(quán)限
          //添加子賬號(hào):https://ram.console.aliyun.com/users
          //給子賬號(hào)授權(quán):https://ram.console.aliyun.com/permissions
          //更多關(guān)于阿里云子賬號(hào)(RAM)說(shuō)明:https://help.aliyun.com/product/28625.html
          //SecretId 就是阿里云的:AccessKey ID
          //SecretKey 就是阿里云的:AccessKey Secret,這個(gè)值只能在你創(chuàng)建 AccessKey 時(shí)看到,所以要保管好,否則只能重新生成
          $.image.init({
          ????target:'aliyun',
          ????aliyun : {
          ????????// 個(gè)人覺(jué)得阿里云的這個(gè) AccessKey 沒(méi)有騰訊云的好用
          ????????SecretId: 'xxxx', // 需要先創(chuàng)建 RAM 用戶,同時(shí)訪問(wèn)方式選擇“編程訪問(wèn)”
          ????????SecretKey: 'xxxx', // 最好是子賬號(hào)的key,僅授予oss讀寫(xiě)權(quán)限(不包括刪除)
          ????????Folder: 'typora', // 可以把上傳的圖片都放到這個(gè)指定的文件夾下
          ????????BucketDomain : 'http://xxx.com/', // 存儲(chǔ)空間下有個(gè):Bucket 域名 挑一個(gè)就好了
          ????}
          });

          上傳到七牛云
          //“密鑰管理”頁(yè)面地址:https://portal.qiniu.com/user/key
          $.image.init({
          ????target:'qiniu',
          ????qiniu: {
          ????????UploadDomain: 'https://xxx.com', // 上傳地址,需要根據(jù)你存儲(chǔ)空間所在位置選擇對(duì)應(yīng)“客戶端上傳”地址 詳細(xì)說(shuō)明:https://developer.qiniu.com/kodo/manual/1671/region-endpoint
          ????????AccessDomain: 'http://xxx.com/', // 上傳后默認(rèn)只會(huì)返回相對(duì)訪問(wèn)路徑,需要設(shè)置好存儲(chǔ)空間的訪問(wèn)地址。進(jìn)入“文件管理”下面可以看到個(gè)“外鏈域名”就是你的地址了,復(fù)制過(guò)來(lái)替換掉 xxx 就可以了。
          ????????AccessKey : 'xxxx', // AK通過(guò)“密鑰管理”頁(yè)面可以獲取到
          ????????SecretKey: 'xxxx', // SK通過(guò)“密鑰管理”頁(yè)面可以獲取到
          ????????Folder: 'typora', // 可以把上傳的圖片都放到這個(gè)指定的文件夾下
          ????????????
          ????????policyText: {
          ????????????scope: "xxx", // 對(duì)象存儲(chǔ)->空間名稱,訪問(wèn)控制記得設(shè)置成公開(kāi)
          ????????????deadline: 225093916800, // 寫(xiě)死了:9102-12-12日,動(dòng)態(tài)的好像偶爾會(huì)簽名要不過(guò)
          ????????},
          ????}
          });
          上傳到碼云
          // !!!注意當(dāng)圖片大于1M時(shí), gitee 必須登錄后才能查看!!!
          $.image.init({
          ????target:'gitee',
          ????gitee: {
          ????????????message: "From:https://github.com/Thobian", // 必須參數(shù),提交消息(默認(rèn)為:add image)
          ????????????branch: "master", // 要提交到的分支(默認(rèn)為:master)
          ????????????token: 'xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx', // 碼云token申請(qǐng)地址 https://gitee.com/profile/personal_access_tokens
          ????????????userName: 'userName', // 用戶名 比如你的gitee個(gè)人主頁(yè)地址是:https://gitee.com/thobian ,那userName就是:thobian
          ????????????repositorie: 'repositorie', // 倉(cāng)庫(kù)名 比如你的gitee圖片倉(cāng)庫(kù)地址是:https://gitee.com/thobian/typora,那么repositorie就是 typora
          ????????????Folder: 'image', // 可以把上傳的圖片都放到這個(gè)指定的文件夾下
          ????????????BucketDomain: 'https://gitee.com/api/v5/repos/',// 這個(gè)是不用變的,直接copy就好
          ????}
          });
          如果在設(shè)置插件時(shí)遇到任何問(wèn)題可以取 issue 中尋找解決方案:
          https://github.com/Thobian/typora-plugins-win-img/issues
          3. Typora 自動(dòng)上傳功能
          雖然插件支持多種圖庫(kù),但僅僅支持 Windows 系統(tǒng)。不過(guò) Typora 已經(jīng)支持圖片上傳功能了,在配置之前,要確保軟件的版本更新到最新,老版本是不支持圖片上傳功能,配置中沒(méi)有上傳圖片該選項(xiàng):

          更新軟件
          下載最新的軟件 https://www.typora.io/#windows,本文中阿改使用的版本是 0.9.86,升級(jí)后打開(kāi) 文件 -> 偏好設(shè)置 -> 圖片插入 ,就會(huì)發(fā)現(xiàn)有圖片上傳這個(gè)選項(xiàng)了,如下圖所示,選擇我勾選的配置。

          緊接著點(diǎn)擊上圖中的「下載或更新」按鈕,下載 PicGo-Core 核心支持。下載完畢后進(jìn)行配置。
          配置 Token
          選擇 sm.ms 作為圖床,官網(wǎng)地址:https://sm.ms
          特點(diǎn):永久存儲(chǔ)免注冊(cè),圖片鏈接支持https,可以刪除上傳的圖片,提供多種圖片鏈接格式,建立于2015年,目前免費(fèi)用戶無(wú)法使用香港節(jié)點(diǎn)因此速度比較慢
          圖片上傳限制:每個(gè)圖片最大5M,每次最多上傳10張
          1. 注冊(cè)或登陸 sm.ms
          https://sm.ms/login
          2. 生成 token
          https://sm.ms/home/apitoken3.
          3. 配置 token
          在 Typora 配置中,圖像 -> 打開(kāi)配置文件,將下面代碼 copy 進(jìn)去,然后 token 改成自己的就可以了。

          注意修改后重啟軟件:
          {
          ??"picBed": {
          ????"uploader": "smms", 傳圖床為 SM.MS,
          ????"smms": {
          ??????"token": "xxxxxxxxxxxxxxxxxxxxx"?//這里面的token換成剛剛生成的 sm.ms 的token
          ????}
          ??},
          ??"picgoPlugins": {}
          }

          效果預(yù)覽
          感覺(jué)上傳的速度不如第三方插件上傳的速度快,但是第三方插件僅僅支持 Windows 系統(tǒng),并且拖進(jìn)去的圖像需要在點(diǎn)擊一下才能上傳至圖床,而自帶的上傳功能拖進(jìn)去即可,并由動(dòng)畫(huà)緩存反饋。各有優(yōu)勢(shì)吧,此外大家可以嘗試其它圖床,七牛云等等。
          對(duì)于 Mac 用戶使用該軟件實(shí)現(xiàn)圖床功能還是很簡(jiǎn)單的,直接 Typora + iPic 就行了,本文就不介紹了。

          往期熱門(mén)文章:

          1、歷史文章分類導(dǎo)讀列表!精選優(yōu)秀博文都在這里了!》

          2、萬(wàn)億級(jí)數(shù)據(jù)應(yīng)該怎么遷移?
          3、從應(yīng)用到底層 36張圖帶你進(jìn)入Redis世界
          4、寫(xiě)代碼有這16個(gè)好習(xí)慣,可以減少80%非業(yè)務(wù)的bug
          5、順豐快遞:請(qǐng)簽收MySQL靈魂十連

          6一個(gè)基于SpringBoot + MyBatis + Vue的代碼生成器
          7Redis 分布式鎖使用不當(dāng),超賣了100瓶飛天茅臺(tái)!!!

          8、如何設(shè)計(jì)訂單系統(tǒng)?這篇寫(xiě)得太好了!
          9如果MySQL磁盤(pán)滿了,會(huì)發(fā)生什么?還真被我遇到了!
          10、阿里開(kāi)源的27個(gè)項(xiàng)目,值得收藏!
          瀏覽 69
          點(diǎn)贊
          評(píng)論
          收藏
          分享

          手機(jī)掃一掃分享

          分享
          舉報(bào)
          評(píng)論
          圖片
          表情
          推薦
          點(diǎn)贊
          評(píng)論
          收藏
          分享

          手機(jī)掃一掃分享

          分享
          舉報(bào)
          <kbd id="afajh"><form id="afajh"></form></kbd>
          <strong id="afajh"><dl id="afajh"></dl></strong>
            <del id="afajh"><form id="afajh"></form></del>
                1. <th id="afajh"><progress id="afajh"></progress></th>
                  <b id="afajh"><abbr id="afajh"></abbr></b>
                  <th id="afajh"><progress id="afajh"></progress></th>
                  中文字幕无码电影 | 青娱乐极品精品 | 四色成人电影 | 日本女人在线 | 丰满老妇高潮一级A片 |