介绍

在使用Typora粘贴本地图片默认是储存在本地文件夹的，在分享文档时常常会导致markdown中的图片丢失，本文将介绍使用图床解决分享后图片丢失的问题。

准备工作

• 部署Minio
• 安装node环境
• 安装typora编辑器

生成Minio密钥

登录Minio管理界面创建密钥

注意：创建后记得复制保存好secretKey ；或创建好后可以下载一个credentials.json文件

创建存储桶

创建存储桶后需要修改访问策略；将private设置为public

编写js脚本

新建upload.js文件，文件名可以自定义，脚本内容如下

/* 
 * Typora插入图片调用此脚本,上传图片到 MinIO
 */

const path = require('path')
// minio for node.js
const Minio = require('minio')
const { promises } = require('fs')

const endPoint = "127.0.0.1" //访问Minio的IP或域名

const domain = "https://oss.okay123.top" //自定义域名；没有域名可以与endPoint 相同
const port = 9000 //Minio端口号
const accessKey = "你的accessKey "
const secretKey = "你的secretKey "
const bucketName = "typora"
const filePath = new Date().getFullYear() + "" + (new Date().getMonth() + 1) + "/" + new Date().getDate()


// 解析参数, 获取图片的路径,有可能是多张图片
const parseArgv = () => {
    const imageList = process.argv.slice(2).map(u => path.resolve(u))
    console.info("选择的文件列表:", imageList)
    return imageList
}
// 永久地址的策略
const policy = () => {
    return {
        "Version": "2012-10-17",
        "Statement": [
            {
                "Effect": "Allow",
                "Principal": {
                    "AWS": [
                        "*"
                    ]
                },
                "Action": [
                    "s3:GetBucketLocation",
                    "s3:ListBucket",
                    "s3:ListBucketMultipartUploads"
                ],
                "Resource": [
                    "arn:aws:s3:::" + bucketName
                ]
            },
            {
                "Effect": "Allow",
                "Principal": {
                    "AWS": [
                        "*"
                    ]
                },
                "Action": [
                    "s3:ListMultipartUploadParts",
                    "s3:PutObject",
                    "s3:AbortMultipartUpload",
                    "s3:DeleteObject",
                    "s3:GetObject"
                ],
                "Resource": [
                    "arn:aws:s3:::" + bucketName + "/*"
                ]
            }
        ]
    }
}

// 入口
const uploadImageFile = async (imageList = []) => {
    // 创建连接
    const minioClient = new Minio.Client({
        endPoint: endPoint,
        port: port,
        useSSL: false,
        accessKey: accessKey,
        secretKey: secretKey
    })
    // 判断桶是否存在
    minioClient.bucketExists(bucketName, function (err, exists) {
        if (!exists) {
            // 创建桶
            minioClient.makeBucket(bucketName, '', function (err) {
                if (err) throw err
                // 设置桶策略
                minioClient.setBucketPolicy(bucketName, JSON.stringify(policy()), function (err) {
                    if (err) throw err
                })
            })
        }
        // 开始上传图片
        imageList.map(image => {
            // 图片重命名
            const name = `${Date.now()}${path.extname(image)}`
            // 将图片上传到 bucket 上
            minioClient.fPutObject(bucketName, filePath + "/" + name, image, {}, function(info) {
                const url = `${domain}/${bucketName}/${filePath}/${name}`
                // Typora会提取脚本的输出作为地址,将markdown上图片链接替换掉
                console.log(url)
            })
        })
    })
}

// 执行脚本
uploadImageFile(parseArgv())
js

将当前js文件放在目录中，如：D:\Typora\plugs；使用npm安装依赖

 npm install minio
cmd

使用命令前请先安装node环境

配置Typora图床

打开typora编辑器后，依次点击：文件 > 偏好设置 > 图像

路径根据自己存放位置调整

node D:\Typora\plugs\upload.js
cmd

成功后的结果如图所示：