简书文章导出

在简书的设置下面，就有一键导出的按钮，可以将 markdown 全部下载到本地。

虽然下载了 markdown，但是在简书导出内容的时候，图片并没有一并导出，还是简书内部的图片 URL。所以需要一些手段来进行爬取。

创建一个 node 项目

我们将下载下来的文件放到 docs 目录下，再创建一个 imgs 目录来存放图片。

|- jianshu
  |- docs
    |- 开发日志
      |- 01.md
      |- 02.md
  |- imgs
    |- 1.webp
    |- 2.webp
    |- 3.webp
    |- 5.webp
  |- index.js
  |- package.json

由于用到了 request 来发起请求，所以需要进行安装。

> cd jianshu
> npm init
> yarn add request

使用 node.js 来进行图片的爬取

下面是完整的爬取代码。

let request = require("request");
const fs = require("fs");

// 拿到所有 md 文件路径
const paths = recursiveQueryFile("./docs");

const allFilePaths = [];
function getFilePaths(arr) {
  arr.forEach((item) => {
    if (item.children) {
      getFilePaths(item.children);
    }
    if (item.isFile) {
      allFilePaths.push(item.path);
    }
  });
}
getFilePaths(paths.children);

// 拿到所有图片 URL 路径
const imgList = [];
allFilePaths.forEach((path) => {
  const data = fs.readFileSync(path, "utf-8");
  const matchResults = data.match(/!\[\S+\]\(\S+\)/g);
  if (matchResults) {
    matchResults.forEach((str) => {
      let url = str.replace(/!\[\S+\]\(/, "");
      url = url.replace(")", "");

      imgList.push(url);
    });
  }
});
console.log("imgList", imgList);

// 逐个请求 URL，并将图片下载到本地
const map = {};
async function queryAll() {
  let i = 1;

  for (const url of imgList) {
    const imgName = `/imgs/${i}.webp`;
    map[url] = imgName;
    await request({ url }).pipe(
      fs.createWriteStream("." + imgName).on("close", (err) => {
        if (err) {
          console.log("写入失败", err);
        } else {
          console.log(imgName + " 写入成功");
        }
      })
    );
    i++;
    await waitForTimeout(100);
  }
  console.log("map", map);
  await waitForTimeout(100);
  replaceUrl();
}
queryAll();

// 遍历所有 markdown 文件，替换图片 URL
function replaceUrl() {
  allFilePaths.forEach((path) => {
    let data = fs.readFileSync(path, "utf-8");
    if (data.match(/!\[\S+\]\(\S+\)/g)) {
      Object.keys(map).forEach((key) => {
        data = data.replace(key, map[key]);
      });
      fs.writeFileSync(path, data);
      console.log(path + " 保存完毕!");
    }
  });
}

function waitForTimeout(time) {
  return new Promise((resolve, reject) => setTimeout(resolve, time));
}

function recursiveQueryFile(path) {
  const children = fs.readdirSync(path);
  return {
    path,
    children: children.map((child) => {
      const childPath = path + "/" + child;
      const stat = fs.statSync(childPath);
      if (stat.isDirectory()) {
        return recursiveQueryFile(path + "/" + child);
      } else {
        return {
          path: childPath,
          isFile: true,
        };
      }
    }),
  };
}

实现步骤

• 递归读取 docs 目录下所有的文件名称（非目录）
• 读取所有文件内容，通过正则收集 markdown 的图片链接写法 [name](url) 来奶到图片 URL
• 使用 request 请求图片，并保存到 imgs 目录下。并且为这些图片另外去一个名称。
• 记录下图片 URL 和图片名称的对应关系 map。
• 通过对应关系 map 将所有 markdown 文件中的图片 URL。

最后

一开始选择简书是因为它简洁清爽的界面、好用的 markdown 编辑器、快速上传图片这三个功能。后来又用上了日更的功能，坚持日更的确让我收获颇丰。 但是，现在的简书无论是网页端还是 APP 都充斥着广告，让人很不爽。而且再简书上传的图片无法直接在其他网站使用，导致我往往需要上传两遍图片，也是很恶心人的一点。 最近突然有了自己搞个类似简书的网站的想法，来避开简书的这些恶心人的事情。所以选择导出文章搬家~