From 54f555df07b67fd917b36a0a25b7430493bab39b Mon Sep 17 00:00:00 2001
From: "keni.yyb" <keni.yyb@antgroup.com>
Date: Thu, 28 Mar 2024 20:32:20 +0800
Subject: [PATCH] :bug: fix: sanitize innerHTML with dompurify

---
 package.json                     | 1 +
 src/Highlight/hooks/useShiki.tsx | 6 ++++--
 2 files changed, 5 insertions(+), 2 deletions(-)

diff --git a/package.json b/package.json
index 7d2cee74..ab63f4eb 100644
--- a/package.json
+++ b/package.json
@@ -72,6 +72,7 @@
     "color": "^4.2.3",
     "copy-to-clipboard": "^3.3.3",
     "diff": "^5.1.0",
+    "dompurify": "^3.0.11",
     "fast-deep-equal": "^3.1.3",
     "immer": "^9.0.21",
     "lodash.flatten": "^4.4.0",
diff --git a/src/Highlight/hooks/useShiki.tsx b/src/Highlight/hooks/useShiki.tsx
index 87a96ca3..d020fbe9 100644
--- a/src/Highlight/hooks/useShiki.tsx
+++ b/src/Highlight/hooks/useShiki.tsx
@@ -1,3 +1,4 @@
+import * as DOMPurify from 'dompurify';
 import { useEffect, useState } from 'react';
 import { getHighlighter, type Highlighter } from 'shiki/bundle/web';
 import { themeConfig } from '../theme';
@@ -42,9 +43,10 @@ export const useShiki = (language, theme) => {
         lang: language,
         theme,
       });
-      return result;
+      return DOMPurify.sanitize(result);
     } else {
-      return `<pre><code>${content}</code></pre>`;
+      // 在shiki加载完成之前，直接返回原始代码，同样需要进行xss过滤
+      return DOMPurify.sanitize(`<pre><code>${content}</code></pre>`);
     }
   };