add doc for image hosting

This commit is contained in:
Le Tan 2019-11-30 10:57:57 +08:00
parent 339d4ef6e9
commit 51d3102f19
21 changed files with 173 additions and 4 deletions

View File

@ -6,7 +6,7 @@
"attachments": [ "attachments": [
], ],
"created_time": "2018-11-24T05:04:27Z", "created_time": "2018-11-24T05:04:27Z",
"modified_time": "2018-12-15T03:23:15Z", "modified_time": "2019-11-29T23:43:00Z",
"name": "index.md", "name": "index.md",
"tags": [ "tags": [
] ]

View File

@ -0,0 +1,61 @@
# Image Hosting
From v2.8, VNote supports several image hosting services. Now VNote could upload local images to cloud services.
There are 4 services now VNote supports:
- GitHub;
- Gitee;
- Wechat;
- Tencent Cloud;
For each service, you need to configure the service provider and provide some kind of tokens to VNote to enable VNote access the service.
There are two common options for each service:
- `Keep image scale`: Whether keep the scaling of the images in the new links;
- `Copy the new content instead of replacing`: After uploading images, just copy the content with new links, without touching the original file;
## Configurations
### GitHub
![GitHub Settings](_v_images/20191130075031784_31140.png)
For GitHub, you need to provide:
- `Personal access token`: Go to the `Settings` of GitHub, then `Developer Settings`, then `Personal Access Tokens`, and generate a new token with full control of repo.
![](_v_images/20191130075523834_16766.png)
- `Repo name`: Name of the repository in GitHub to hold your images;
- `User name`: User name of GitHub;
### Gitee
Gitee is quite the same as GitHub.
### Wechat
![Wechat Settings](_v_images/20191130075908274_23745.png)
Go to [Wechat Public Platform](https://mp.weixin.qq.com/), then `Development`, then `Basic Settings`, and get your `AppID` and `AppSecret`.
One more step is to write your IP address into the `IP Whitelist` to allow uploading images from your local host.
The `markdown2WechatToolUrl` is a link which you want VNote to open automatically after copying the new content.
### Tencent Cloud
![Tencent Cloud Settings](_v_images/20191130080638729_9969.png)
1. Go to [Tencent Cloud Platform](https://console.cloud.tencent.com/) and select the `Object Store` product;
2. Go to the `Keys Management` and generate a new API key (`SecretId` and `SecretKey`);
3. Go back to the `Object Store` panel and select the `Store Bucket List` to create a store bucket (with the `Access Permission` being `Public Read Private Write`);
4. Click the `Basic Settings` on the left and get the `Access Domain`;
5. In the same page, add a rule to the `CORS Settings`;
![CORS](_v_images/20191130081348493_22310.png)
## How to use
After you finish writing a note, you could choose to upload images to image hosting service in the context menu (in Edit mode).
![](_v_images/20191130102608106_5131.png)
VNote will go through all the local images and upload them to chosen service.
- If you choose to replace image links in the original file, the content will be modified after finishing uploading. VNote will prompt to delete unused local images when you save the note.
- Otherwise, VNote will copy the new content with new image links and leave the original note untouched.
Thanks @fengwenhua for this pull request!

Binary file not shown.

After

Width:  |  Height:  |  Size: 33 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 53 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 31 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 31 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 36 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 32 KiB

View File

@ -101,6 +101,16 @@
"tags": [ "tags": [
] ]
}, },
{
"attachment_folder": "",
"attachments": [
],
"created_time": "2019-11-29T23:45:27Z",
"modified_time": "2019-11-30T02:29:33Z",
"name": "Image Hosting.md",
"tags": [
]
},
{ {
"attachment_folder": "", "attachment_folder": "",
"attachments": [ "attachments": [

View File

@ -3,7 +3,9 @@
::: alert-success ::: alert-success
VNote 2.7.2 is released! Check out [what's new](https://github.com/tamlok/vnote/releases)! VNote 2.8 is released! Check out [what's new](https://github.com/tamlok/vnote/releases)!
Check this [showcase screencast](https://www.bilibili.com/video/av77455284) to know what you could do with VNote!
::: :::

View File

@ -36,7 +36,7 @@
"attachments": [ "attachments": [
], ],
"created_time": "2018-11-24T09:30:11Z", "created_time": "2018-11-24T09:30:11Z",
"modified_time": "2018-12-15T02:55:04Z", "modified_time": "2019-11-29T23:44:26Z",
"name": "index.md", "name": "index.md",
"tags": [ "tags": [
] ]

View File

@ -0,0 +1,18 @@
{
"created_time": "2018-12-15T06:25:05Z",
"files": [
{
"attachment_folder": "",
"attachments": [
],
"created_time": "2018-12-15T06:25:05Z",
"modified_time": "2018-12-15T06:25:05Z",
"name": "法律.md",
"tags": [
]
}
],
"sub_directories": [
],
"version": "1"
}

Binary file not shown.

After

Width:  |  Height:  |  Size: 34 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 53 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 29 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 31 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 36 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 38 KiB

View File

@ -101,6 +101,16 @@
"tags": [ "tags": [
] ]
}, },
{
"attachment_folder": "",
"attachments": [
],
"created_time": "2019-11-30T02:30:17Z",
"modified_time": "2019-11-30T02:57:24Z",
"name": "图床.md",
"tags": [
]
},
{ {
"attachment_folder": "", "attachment_folder": "",
"attachments": [ "attachments": [

View File

@ -0,0 +1,66 @@
# 图床
从v2.8开始VNote支持多个图床服务将本地图片上传到云服务。
当前VNote支持4个服务
- GitHub;
- Gitee;
- 微信公众平台;
- 腾讯云;
对于每个服务您都需要配置服务提供商并向VNote提供相关令牌以访问这些服务。
每个服务当前有一些共同的选项:
- `保留图片缩放` 新的图片链接中是否保留缩放;
- `复制而非替换新内容` 上传图片后,只复制带有新链接的内容,不要替换原文件;
## 配置
### GitHub
![GitHub配置](_v_images/20191130103522395_15721.png)
对于GitHub需要提供
- `个人访问令牌` 访问GitHub的`Settings``Developer Settings``Personal Access Tokens`,然后生成一个新的令牌(需要提供仓库的全部访问权限)。
![GitHub Token](_v_images/20191130103859393_3087.png)
- `仓库名`用于保存图片的GitHub仓库名
- `用户名`GitHub用户名
### Gitee
Gitee的配置和GitHub大同小异。
### 微信公众平台
![微信设置](_v_images/20191130104030424_13873.png)
访问[微信公众平台](https://mp.weixin.qq.com/)`开发``基本配置`,找到`开发者ID``开发者密码`即可。
另外,还需要在`IP白名单`中添加当前电脑的IP地址。
`markdown2WechatToolUrl` 可以填写一个链接VNote在复制内容后自动打开该链接方便后续发布。
### 腾讯云
![腾讯云配置](_v_images/20191130104358684_32512.png)
访问[腾讯云管理后台](https://console.cloud.tencent.com/)`云产品``对象存储`
`密钥管理`中新建密钥,拿到`SecretId``SecretKey`
回到`对象存储`,选择`存储桶列表``创建存储桶`,访问权限选择`公有读私有写`即可。
在左侧`基础配置`可以看到VNote需要的`访问域名`
最后还需要添加一个CORS规则
![CORS规则](_v_images/20191130104812563_29347.png)
## 如何使用
完成编写一篇笔记后,可以在上下文菜单中选择上传本地图片到指定图床服务中(在编辑模式下)。
![](_v_images/20191130104940959_22807.png)
VNote会遍历所有的本地图片并上传。
- 如果选择了替换原文件则上传完成后会修改文件内容。保存的时候VNote会提示是是否删除不再被引用的图片。
- 否则VNote只会复制新的内容但不会修改原文件。
感谢@fengwenhua提供该功能实现

View File

@ -3,7 +3,9 @@
::: alert-success ::: alert-success
VNote 2.7.2 已发布! 看看都有 [哪些更新](https://github.com/tamlok/vnote/releases) VNote 2.8 已发布! 看看都有 [哪些更新](https://github.com/tamlok/vnote/releases)
观看[展示录屏](https://www.bilibili.com/video/av77455284)
::: :::