♻️ Foreground vditor render implement with ReactivePostContentHandler

Author: justice2001

build.gradle

@@ -16,7 +16,7 @@ repositories {
 }
 
 dependencies {
-    implementation platform('run.halo.tools.platform:plugin:2.6.0-SNAPSHOT')
+    implementation platform('run.halo.tools.platform:plugin:2.7.0-SNAPSHOT')
     compileOnly 'run.halo.app:api'
 
     testImplementation 'run.halo.app:api'
@@ -38,4 +38,4 @@ task buildFrontend(type: PnpmTask) {
 build {
     // build frontend before build
     tasks.getByName('compileJava').dependsOn('buildFrontend')
-}
+}

console/src/views/Vditor.vue

@@ -30,7 +30,7 @@ const debounceOnUpdate = () => {
 }
 
 onMounted(() => {
-  vditor.value = new Vditor(vditor.value, {
+  vditor.value = new Vditor(vditorRef.value, {
     height: "calc(100vh - 56px)",
     toolbarConfig: {
       pin: true,

src/main/java/top/mczhengyi/vditor/VditorHeadProcessor.java

@@ -0,0 +1,46 @@
+package top.mczhengyi.vditor;
+
+import com.google.common.base.Throwables;
+import lombok.AllArgsConstructor;
+import lombok.Data;
+import lombok.extern.slf4j.Slf4j;
+import org.springframework.stereotype.Component;
+import reactor.core.publisher.Mono;
+import run.halo.app.plugin.ReactiveSettingFetcher;
+import run.halo.app.theme.ReactivePostContentHandler;
+
+@Component
+@AllArgsConstructor
+@Slf4j
+public class VditorPostContentHandler implements ReactivePostContentHandler {
+
+    private final ReactiveSettingFetcher reactiveSettingFetcher;
+
+    @Override
+    public Mono<PostContentContext> handle(PostContentContext contentContext) {
+        return reactiveSettingFetcher.fetch("basic", BasicConfig.class)
+                .map(basicConfig -> {
+                    if (basicConfig.enable_render) {
+                        contentContext.setContent(renderScript() + "\n" + contentContext.getContent());
+                    }
+                    return contentContext;
+                })
+                .onErrorResume(e -> {
+                    log.error("VditorHeadProcessor process failed", Throwables.getRootCause(e));
+                    return Mono.empty();
+                });
+    }
+
+    private String renderScript() {
+        return """
+                <link rel="stylesheet" href="/plugins/vditor-mde/assets/static/index.css" />
+                <script src="/plugins/vditor-mde/assets/static/method.min.js"></script>
+                <script src="/plugins/vditor-mde/assets/static/render.js"></script>
+                """;
+    }
+
+    @Data
+    public static class BasicConfig {
+        Boolean enable_render;
+    }
+}

src/main/java/top/mczhengyi/vditor/VditorPostContentHandler.java

@@ -0,0 +1,10 @@
+apiVersion: plugin.halo.run/v1alpha1
+kind: ExtensionDefinition
+metadata:
+  name: ext-def-vditor-post-content
+spec:
+  className: top.mczhengyi.vditor.VditorPostContentHandler
+  # 文章内容扩展点的名称，固定值
+  extensionPointName: reactive-post-content-handler
+  displayName: "VditorPostContentHandler"
+  description: "Vditor render support for post content"