国思软件 - 技术文章 - 解放双手，markdown文章神器,Typora+PicGo+七牛云图床实现自动上传图片

> 本文主要分享使用Typora作为Markdown编辑器，PicGo为上传图片工具，使用七牛云做存储来解放双手实现图片的自动化上传与管理。提高写作效率，提升逼格。用过 Markdown 的朋友一定会深深爱上这种优雅的写作方式，比起惨不忍睹的 Word 简直要帅气得多了。

Typora 是一款简单、高效而且优雅的 Markdown 编辑器，它提供了一种所见即所得的全新的 Markdown 写作体验。它把源码编辑和效果预览两者合二为一，在输入 Markdown 代码的时候即时生成预览效果。Typora 的一切都围绕纯粹的生产效率而设计。

Typora一直是我最喜欢的 markdown 编辑器，写博客、记笔记的首选软件。相信大部分朋友也在使用 Typora 这款软件，最新的Typora终于支持图床功能。

## 1、创建并上传文件到存储空间

### 1.1、注册七牛账号，并且实名认证

### 1.2、创建储存空间

打开侧边栏，选择对象存储

![创建储存空间](http://doc.rdiframework.net/rdiblog/20210112151557.png-pw)

选择新建空间

![新建空间](http://doc.rdiframework.net/rdiblog/20210112151619.png-pw)

- 存储空间名称：按规则随便取
- 存储区域：选择离靠近的地区
- 访问控制：选择**公开**，否则**外网无法访问，没法作为图床**

### 1.3、上传文件

![上传文件](http://doc.rdiframework.net/rdiblog/20210112151607.png-pw)

- 选择文件管理，点击上传文件即可上传

- 不绑定私有域名时默认外链域名即为官方分配的30天有效临时域名，

如果绑定私有域名可以选择私有域名

- 点击详情即可预览图片

- 点击更多，选中复制外链即可获得图片外链

获取外链之后直接输入浏览器网址栏，或者在代码里引用就行了！

## 2、创建二级域名并解析到七牛云CNAME

七牛云默认会每隔30天重新分配一个临时的测试域名，也就是说，过了30天域名重置以后，之前的外链就全部失效，为了预防这种情况，我们需要绑定一个自己的私人域名。

### 2.1、设置存储空间域名绑定

![设置存储空间域名绑定](http://doc.rdiframework.net/rdiblog/20210112151722.png-pw)

- 选择自定义域名，添加一条你要绑定的子域名，其他设置不需要动，添加完保存即可

子域名格式需要为：主机记录.域名，比如`img.xxxxx.com`这样

- 配置完成后鼠标移至CNAME按钮上，复制`CNAME`

比如我的配置就是`***.rdi***work.net.qiniudns.com`

### 2.2、前往域名服务商创建二级域名

这个就省略了，自行创建即可。

## 3、下载并安装图床管理工具PicGo

在前面我们已经搭建了用于存放图片的云存储，我们如何高效快速的把图片存储到七牛云上呢？

相信许多自己做网站动静分离的童鞋一直苦于繁琐的图片上传操作，以七牛云为例，上传一张图片需要登录七牛云，然后手动上传图片，再自己编辑链接，然后复制到 markdown 里四个步骤，当然我们自己的博客系统Copy图片时自动就会上传到对应的云存储中，接下来介绍的 PicGo 就是将这繁琐的操作简化。

有时我们不单单维护一个博客系统，有可能有多个，全使用MarkDown语法 编写，这时使用Typora来统一的编写工具那就非常的方便管理了。

PicGo用于免费搭建个人图床，并且跨平台支持 Windows、macOS 和 Linux 系统，它的使用非常简单，只需先设置好图床网站 / 云存储服务的账号之后，用鼠标将图片拖放到 PicGo 主窗口的图片上传框，即可完成图片的上传并返回一个url链接到剪切板。

现在图床基本可以使用了，但是为了能更方便的管理，最重要的是能跟Typora无缝衔接，我们还需要PicGo辅助，

PicGo[下载地址](https://github.com/Molunerfinn/PicGo/releases)，选择版本并且根据自己的操作系统选择对应的安装包即可。

![下载并安装图床管理工具PicGo](http://doc.rdiframework.net/rdiblog/20210112151738.png-pw)

安装好后打开界面如下所示：

![PicGo主界面](http://doc.rdiframework.net/rdiblog/20210112151812.png-pw)

在左侧的图床设置中，有非常多的图床可供选择，大家可以根据自己的使用进行选择，这儿我们选择“七牛图床”

![七牛图床设置](http://doc.rdiframework.net/rdiblog/20210112151754.png-pw)

**需要填写的配置项：**

- 设定AK和SK：前往七牛云个人中心 ->密匙管理复制黏贴即可

![设定AK和SK](http://doc.rdiframework.net/rdiblog/20210112151830.png-pw)

- 设定储存空间名：和七牛存储空间名称一致

- 设定访问网址：即你的二级域名，这里**需要在域名之前加上http://**

![设定访问网址](http://doc.rdiframework.net/rdiblog/20210112151841.png-pw)

- 创建空间时，选择的存储区域，从z0到z1，依次对应：华东、华北、华南、北美、东南亚。七牛云的存储对象的地区对应表如下：

![创建空间](http://doc.rdiframework.net/rdiblog/20210112151849.png-pw)

![存储区域](http://doc.rdiframework.net/rdiblog/20210112151902.png-pw)

然后点“确认”按钮，保存设置，回到上传区选项即可上传图片到图床。

- 上传图片成功后剪贴板会自动获取图片引用的外链
- 在相册可以查看通过PicGo上传过的图片

我们拖动一张图片到下图区域就会自动上传到七牛云中

![拖动上传](http://doc.rdiframework.net/rdiblog/20210112151916.png-pw)

单击“相册”，可以查看已上传的图片。

![相册](http://doc.rdiframework.net/rdiblog/20210112151924.png-pw)

要实现Typora中图片自动的上传，我们需要设置PicGo Server，如下图所示。

![PicGo Server](http://doc.rdiframework.net/rdiblog/20210112151936.png-pw)

![设置PicGo-Server](http://doc.rdiframework.net/rdiblog/20210112152036.png-pw)

默认配置即可，只要保证端口没有被占用。

## 4、Typora配置图片上传

### 4.1、配置上传服务设定

设置好PicGo后来到Typora进行配置，打开Typora的文件菜单，选择“偏好设置”，选择“图像”，如下图所示。

![配置上传服务设定](http://doc.rdiframework.net/rdiblog/20210112143152.png-pw)

- 上传服务：选择PicGo
- PicGo路径：选择PicGo安装根目录的.exe文件

配置好后，可以单击上图中的“验证图片上传选项”，来确定配置的正确性，如下图所示。

![验证图片上传选项](http://doc.rdiframework.net/rdiblog/20210112151956.png-pw)

### 4.2、上传图片

上传图片有三种方式：

- 加入图片时直接上传

在偏好设置 --》图像 --》插入图片时 设置

- 对图片右键上传

- 在格式 --》图像 --》 上传所有本地图片

图片上传成功，会在右下角显示提示信息。

![图片上传成功提示](http://doc.rdiframework.net/rdiblog/20210112152010.png-pw)

如果出现报错，一般是端口被占用，可以打开PicGo的server看看端口是否还是36677，改变了的话改回来就好了。

以上我们就完成了图片的自动上传，编写文章非常的方便了。

-----

一路走来数个年头，感谢RDIFramework.NET框架的支持者与使用者，大家可以通过下面的地址了解详情。

RDIFramework.NET官方网站：[http://www.rdiframework.net/](http://www.rdiframework.net/)

[http://www.guosisoft.com/](http://www.guosisoft.com/)

特别说明，框架相关的技术文章请以官方网站为准，欢迎大家收藏！

RDIFramework.NET框架由海南国思软件科技有限公司专业团队长期打造、一直在更新、一直在升级，请放心使用！

欢迎关注RDIFramework.NET框架官方微信公众号（微信号：**guosisoft**），及时了解最新动态。

使用微信扫描二维码立即关注

![微信号：**guosisoft**](http://doc.rdiframework.net/weixin.png)

正文到此结束

所属分类：码农生涯

本文标签： 项目管理挨踢业界常用工具
版权声明： 本站原创文章，由guosisoft.com发布，遵循 CC 4.0 by-sa 版权协议，转载请附上原文出处链接和本声明。

该篇文章的评论功能暂时被站长关闭

解放双手，markdown文章神器,Typora+PicGo+七牛云图床实现自动上传图片

热门推荐

相关文章

说给你听

本文目录

文章标签

网站信息

我们的产品

相关链接

关于我们

联系我们