Typora导出html文件时图片自动转换成base64

在使用markdown工具typora编写文档时，由于里面会插入一些本地的图片，当我们把文档导出html时发给其他人时，由于找不到图片对应的文件，会导致图片无法显示。此文将介绍使用扩展命令的方式在导出html时将图片转换成base64内嵌到html文件中，具体参考如下：

注：参考了文章，由于使用时中文发生了乱码，做了一些修改：

1. 修复中文乱码；
2. 导出完成后删除源文件，并重命名为源文件名称。

1. 编写Java代码生成扩展jar包

需要借助Java代码进行操作，重新读取已导出的文件，并转换文件中的图片为base64。已编写好的jar包下载地址（如果直接下载可以直接跳到第2章节）：点击下载TyporaToBase64.jar

1. 代码实现

package com.ttxz.imagetobase64;

import java.io.*;
import java.nio.charset.StandardCharsets;
import java.util.Base64;

public class Main {
    /**
     * @param src img src 内容
     * @param end 下次查找字符串起始位置
     * @return java.lang.String
     * @throws
     * @description 递归执行查找同一行字符串多个 img 标签
     * @date 2021/10/1 11:07
     * @Author Mr.Fang
     */
    public static String execute(String src, int end) {
        String result = matchImg(src, end);
        if (result.isEmpty()) {
            return src;
        } else {
            String[] split = result.split(",");
            String s1 = fileToBase64(split[0]);
            if (s1.isEmpty()) {
                return src;
            } else {
                String replace = src.replace(split[0], s1);
                return execute(replace, Integer.valueOf(split[1]) + 20);
            }
        }
    }

    /**
     * @param str 原始字符串
     * @return java.lang.String
     * @Description 匹配 img src 内容
     * @date 2021/9/30 0030 16:32
     * @auther Mr.Fang
     **/
    public static String matchImg(String str, int start) {
        int img = str.indexOf("

2. 打包jar

   
   
   1. 进入项目配置
   
   
   2. 打开Artifacts选项卡
   
   
   3. 点击新增
   
   
   4. 选择JAR配置
   
   
   5. Create JAR from Modules
   
   
   6. 选择模块
   
   
   7. 点击确定
   
   
   8. 点击确定
   
   
   9. 选择Build Artifacts
   
   
   10. 选择Build
   
   
   11. 查看输出Jar包
3. Typora配置

• Typora提供了导出后可以执行自定义命令
• 首先将生成的Jar或是下载的，复制到Typora的安装目录下（默认安装路径是：C:\Program Files\Typora）
• 打开Typora，依次点击文件-偏好设置-导出-HTML
• 勾选运行自定义命令和显示命令行输出
• 在自定义命令处输入自定义的指令（依赖java环境）：

java -jar C:\Program" "Files\Typora\TyporaToBase64.jar "${outputPath}"

• 配置完成后如图示：

  
  
  Typora配置自定义命令

• 最终导出的输出示例：

  
  
  Typora导出成功示例

• 注：更多参数信息查看官网 https://support.typora.io/Export/