From dbce8515e7c8ea094c37f7bc431ef015f6c20079 Mon Sep 17 00:00:00 2001
From: liangxu <liangxu0920@qq.com>
Date: Mon, 27 Apr 2026 11:02:50 +0800
Subject: [PATCH] feat(publish): render jianshu html images as markdown

Jianshu's HTML editor strips uploaded <img> tags during save, so previously
uploaded images vanished from the rendered article. After image upload,
convert each <img> (and surrounding <p> wrappers) to a markdown image block
in both the desktop and extension publish paths so the references survive.

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
---
 .../browser-extension/src/adapters/jianshu.ts |  4 +-
 .../src/main/adapters/jianshu.test.ts         | 25 +++++++++++
 packages/publisher-platforms/src/jianshu.ts   | 42 ++++++++++++++++++-
 3 files changed, 69 insertions(+), 2 deletions(-)
 create mode 100644 apps/desktop-client/src/main/adapters/jianshu.test.ts

diff --git a/apps/browser-extension/src/adapters/jianshu.ts b/apps/browser-extension/src/adapters/jianshu.ts
index 09ecf99..5e91a1a 100644
--- a/apps/browser-extension/src/adapters/jianshu.ts
+++ b/apps/browser-extension/src/adapters/jianshu.ts
@@ -1,4 +1,5 @@
 import type { StoredPlatformState } from "../platforms";
+import { renderJianshuHtmlImagesAsMarkdown } from "../../../../packages/publisher-platforms/src/jianshu";
 
 import {
   articleMarkdown,
@@ -146,6 +147,7 @@ async function publishJianshu(context: AdapterContext): Promise<PlatformPublishR
     const htmlProcessed = useMarkdownMode
       ? null
       : await uploadHtmlImages(normalizeArticleHtml(context.article), async (sourceUrl) => uploadImage(noteId, sourceUrl));
+    const htmlContent = htmlProcessed ? renderJianshuHtmlImagesAsMarkdown(htmlProcessed.html) : "";
 
     await fetchJson(`https://www.jianshu.com/author/notes/${noteId}`, {
       method: "PUT",
@@ -154,7 +156,7 @@ async function publishJianshu(context: AdapterContext): Promise<PlatformPublishR
         id: noteId,
         autosave_control: 1,
         title: context.article.title,
-        content: useMarkdownMode ? (markdownProcessed?.markdown ?? rawMarkdown) : (htmlProcessed?.html ?? ""),
+        content: useMarkdownMode ? (markdownProcessed?.markdown ?? rawMarkdown) : htmlContent,
       }),
     });
 
diff --git a/apps/desktop-client/src/main/adapters/jianshu.test.ts b/apps/desktop-client/src/main/adapters/jianshu.test.ts
new file mode 100644
index 0000000..986c588
--- /dev/null
+++ b/apps/desktop-client/src/main/adapters/jianshu.test.ts
@@ -0,0 +1,25 @@
+import { describe, expect, it } from "vitest";
+
+import { renderJianshuHtmlImagesAsMarkdown } from "../../../../../packages/publisher-platforms/src/jianshu";
+
+describe("jianshu article content", () => {
+  it("converts editor image paragraphs to markdown image syntax", () => {
+    const result = renderJianshuHtmlImagesAsMarkdown(
+      '<p class="article-editor-image article-editor-image--center" align="center"><img src="https://upload-images.jianshu.io/upload_images/2370478-707abbd68000b249.png" alt="" width="365" height="521" data-asset-id="14" /></p>',
+    );
+
+    expect(result).toBe("![](https://upload-images.jianshu.io/upload_images/2370478-707abbd68000b249.png)");
+  });
+
+  it("keeps normal text while replacing raw image tags", () => {
+    const result = renderJianshuHtmlImagesAsMarkdown(
+      '<p>正文段落</p><img src="https://upload-images.jianshu.io/upload_images/2370478-0e05fd986e33dae9.jpg?imageMogr2/auto-orient/strip%7CimageView2/2/w/1240" alt="微信图片_2026-04-18_141100_730.jpg">',
+    );
+
+    expect(result).toContain("<p>正文段落</p>");
+    expect(result).toContain(
+      "![微信图片_2026-04-18_141100_730.jpg](https://upload-images.jianshu.io/upload_images/2370478-0e05fd986e33dae9.jpg?imageMogr2/auto-orient/strip%7CimageView2/2/w/1240)",
+    );
+    expect(result).not.toContain("<img");
+  });
+});
diff --git a/packages/publisher-platforms/src/jianshu.ts b/packages/publisher-platforms/src/jianshu.ts
index 3ed1ad9..c6ab0c9 100644
--- a/packages/publisher-platforms/src/jianshu.ts
+++ b/packages/publisher-platforms/src/jianshu.ts
@@ -127,6 +127,46 @@ function parseJianshuErrorMessage(error: unknown, fallback: string): string {
   return fallback;
 }
 
+function extractHtmlAttribute(sourceTag: string, attributeName: string): string | null {
+  const matcher = new RegExp(`\\s${attributeName}\\s*=\\s*(?:"([^"]*)"|'([^']*)'|([^\\s"'>]+))`, "i");
+  const match = matcher.exec(sourceTag);
+  const value = match?.[1] ?? match?.[2] ?? match?.[3] ?? "";
+  const trimmed = value.trim();
+  return trimmed ? trimmed : null;
+}
+
+function escapeMarkdownAlt(value: string): string {
+  return value.replace(/\\/g, "\\\\").replace(/\]/g, "\\]");
+}
+
+function markdownImageFromHtmlTag(imgTag: string): string {
+  const src = extractHtmlAttribute(imgTag, "src");
+  if (!src) {
+    return imgTag;
+  }
+
+  const alt = extractHtmlAttribute(imgTag, "alt") ?? "";
+  return `![${escapeMarkdownAlt(alt)}](${src})`;
+}
+
+export function renderJianshuHtmlImagesAsMarkdown(content: string): string {
+  if (!/<img\b/i.test(content)) {
+    return content;
+  }
+
+  let next = content.replace(
+    /<p\b[^>]*>\s*(<img\b[^>]*\/?>)\s*<\/p>/gi,
+    (_match, imgTag: string) => `\n\n${markdownImageFromHtmlTag(imgTag)}\n\n`,
+  );
+
+  next = next.replace(
+    /<img\b[^>]*\/?>/gi,
+    (imgTag) => `\n\n${markdownImageFromHtmlTag(imgTag)}\n\n`,
+  );
+
+  return next.replace(/\n{3,}/g, "\n\n").trim();
+}
+
 export async function fetchJianshuMediaSnapshot(
   fetchJson: <T>(input: string, init?: RequestInit) => Promise<T>,
 ): Promise<JianshuMediaSnapshot | null> {
@@ -265,7 +305,7 @@ async function processContentImages(
   for (const [from, to] of replacements.entries()) {
     next = next.split(from).join(to);
   }
-  return next;
+  return renderJianshuHtmlImagesAsMarkdown(next);
 }
 
 async function attachCoverImage(