From 1cca8d26afdd5a415ee757e9977f8b722acbd561 Mon Sep 17 00:00:00 2001
From: KDZhu <carlchu0113@gmail.com>
Date: Sun, 29 Sep 2024 14:22:27 +0800
Subject: [PATCH] =?UTF-8?q?refactor(v-html):=20=E8=BF=87=E6=BB=A4v-html?=
 =?UTF-8?q?=E5=86=85=E5=AE=B9=E9=98=B2=E8=8C=83XSS=E6=94=BB=E5=87=BB=20#?=
 =?UTF-8?q?=20Reviewed,=20transaction=20id:=2019674?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/dashboard-front/package.json                     |  1 +
 .../src/components/version-diff/index.vue            | 10 +++++-----
 src/dashboard-front/src/main.ts                      |  2 ++
 .../views/apiDocs/components/component-searcher.vue  |  4 ++--
 .../apiDocs/components/doc-detail-main-content.vue   |  2 +-
 .../apiDocs/components/sdk-instruction-content.vue   |  2 +-
 src/dashboard-front/src/views/apiDocs/doc-detail.vue |  4 ++--
 .../src/views/apigwDocs/components/detail.vue        |  4 ++--
 .../src/views/apigwDocs/components/doc.vue           |  4 ++--
 src/dashboard-front/src/views/basic-info/index.vue   |  2 +-
 .../src/views/component-doc/components/detail.vue    |  8 ++++----
 .../src/views/component-doc/components/doc.vue       |  4 ++--
 .../component-doc/components/searcher/index.vue      |  4 ++--
 .../manage/components/render-system.vue              |  4 ++--
 .../manage/components/sync-access.vue                |  6 +++---
 .../src/views/components-access/system/index.vue     |  2 +-
 .../views/components/plugin-manage/plugin-info.vue   |  2 +-
 .../views/components/resource-doc-slider/index.vue   |  2 +-
 .../src/views/components/resources-doc/index.vue     |  2 +-
 src/dashboard-front/src/views/home.vue               |  2 +-
 .../src/views/online-debug/components/doc.vue        |  4 ++--
 src/dashboard-front/src/views/online-debug/index.vue |  4 ++--
 .../src/views/operate-data/access-log/detail.vue     |  2 +-
 .../resource/version/components/resourceDetail.vue   |  2 +-
 .../src/views/sdk/components/sdk-detail.vue          |  2 +-
 src/dashboard-front/yarn.lock                        | 12 ++++++++++++
 26 files changed, 56 insertions(+), 41 deletions(-)

diff --git a/src/dashboard-front/package.json b/src/dashboard-front/package.json
index e5916225a..5cb297b95 100644
--- a/src/dashboard-front/package.json
+++ b/src/dashboard-front/package.json
@@ -57,6 +57,7 @@
     "semver": "^7.6.3",
     "transliteration": "^2.3.5",
     "vue": "^3.4.38",
+    "vue-dompurify-html": "^5.1.0",
     "vue-i18n": "^9.14.0",
     "vue-router": "^4.4.3"
   },
diff --git a/src/dashboard-front/src/components/version-diff/index.vue b/src/dashboard-front/src/components/version-diff/index.vue
index 564e0e7ff..1dd5a9a68 100644
--- a/src/dashboard-front/src/components/version-diff/index.vue
+++ b/src/dashboard-front/src/components/version-diff/index.vue
@@ -217,7 +217,7 @@
                   <DownShape class="expand-icon" v-else />
                   <span
                     class="vm resource-title"
-                    v-html="renderTitle(addItem)"
+                    v-dompurify-html="renderTitle(addItem)"
                     :title="`【${addItem?.method}】${addItem?.path}`"
                   ></span>
                 </div>
@@ -249,7 +249,7 @@
                   <DownShape class="expand-icon" v-else />
                   <span
                     class="vm resource-title"
-                    v-html="renderTitle(deleteItem)"
+                    v-dompurify-html="renderTitle(deleteItem)"
                     :title="`【${deleteItem?.method}】${deleteItem?.path}`"
                   ></span>
                 </div>
@@ -275,7 +275,7 @@
                   <DownShape class="expand-icon" v-else />
                   <span
                     class="vm resource-title"
-                    v-html="renderTitle(deleteItem)"
+                    v-dompurify-html="renderTitle(deleteItem)"
                     :title="`【${deleteItem?.method}】${deleteItem?.path}`"
                   ></span>
                 </div>
@@ -311,7 +311,7 @@
                   <DownShape class="expand-icon" v-else />
                   <span
                     class="vm resource-title"
-                    v-html="renderTitle(updateItem.source)"
+                    v-dompurify-html="renderTitle(updateItem.source)"
                     :title="`【${updateItem?.source?.method}】${updateItem?.source?.path}`"
                   ></span>
                 </div>
@@ -340,7 +340,7 @@
                   <DownShape class="expand-icon" v-else />
                   <span
                     class="vm resource-title"
-                    v-html="renderTitle(updateItem.target)"
+                    v-dompurify-html="renderTitle(updateItem.target)"
                     :title="`【${updateItem?.target?.method}】${updateItem?.target?.path}`"
                   ></span>
                 </div>
diff --git a/src/dashboard-front/src/main.ts b/src/dashboard-front/src/main.ts
index 8bd8390b7..eb2d239a0 100644
--- a/src/dashboard-front/src/main.ts
+++ b/src/dashboard-front/src/main.ts
@@ -8,6 +8,7 @@ import globalConfig from '@/constant/config';
 import directive from '@/directive/index';
 import mavonEditor from 'mavon-editor';
 import 'mavon-editor/dist/css/index.css';
+import VueDOMPurifyHTML from 'vue-dompurify-html';
 
 // 全量引入 bkui-vue
 import bkui from 'bkui-vue';
@@ -29,4 +30,5 @@ app.use(i18n)
   // .directive('overflowTitle', overflowTitle)
   // .directive('bkTooltips', bkTooltips)
   .use(mavonEditor)
+  .use(VueDOMPurifyHTML)
   .mount('.app');
diff --git a/src/dashboard-front/src/views/apiDocs/components/component-searcher.vue b/src/dashboard-front/src/views/apiDocs/components/component-searcher.vue
index a7fbe6dd5..74b2d8c45 100644
--- a/src/dashboard-front/src/views/apiDocs/components/component-searcher.vue
+++ b/src/dashboard-front/src/views/apiDocs/components/component-searcher.vue
@@ -30,9 +30,9 @@
                 <a href="javascript:;">
                   <p class="name">
                     <!-- eslint-disable-next-line vue/no-v-html -->
-                    <strong class="mr5" v-html="hightlightSystemName(item)"></strong>
+                    <strong class="mr5" v-dompurify-html="hightlightSystemName(item)"></strong>
                     <!-- eslint-disable-next-line vue/no-v-html -->
-                    <span v-html="hightlight(item)"></span>
+                    <span v-dompurify-html="hightlight(item)"></span>
                   </p>
                   <p class="desc">{{ item.description || t('暂无描述') }}</p>
                 </a>
diff --git a/src/dashboard-front/src/views/apiDocs/components/doc-detail-main-content.vue b/src/dashboard-front/src/views/apiDocs/components/doc-detail-main-content.vue
index 87ed56899..c089d78d7 100644
--- a/src/dashboard-front/src/views/apiDocs/components/doc-detail-main-content.vue
+++ b/src/dashboard-front/src/views/apiDocs/components/doc-detail-main-content.vue
@@ -52,7 +52,7 @@
         <!--  API markdown 文档  -->
         <article v-if="markdownHtml" class="res-detail-content">
           <!-- eslint-disable-next-line vue/no-v-html -->
-          <div class="ag-markdown-view" id="resMarkdown" v-html="markdownHtml"></div>
+          <div class="ag-markdown-view" id="resMarkdown" v-dompurify-html="markdownHtml"></div>
         </article>
       </main>
     </main>
diff --git a/src/dashboard-front/src/views/apiDocs/components/sdk-instruction-content.vue b/src/dashboard-front/src/views/apiDocs/components/sdk-instruction-content.vue
index 575ac83d5..a7be9af6f 100644
--- a/src/dashboard-front/src/views/apiDocs/components/sdk-instruction-content.vue
+++ b/src/dashboard-front/src/views/apiDocs/components/sdk-instruction-content.vue
@@ -13,7 +13,7 @@
       <bk-button class="is-selected" style="width: 150px">Python</bk-button>
     </div>
     <!-- eslint-disable-next-line vue/no-v-html -->
-    <div v-if="sdkDoc" class="ag-markdown-view" id="markdown" :key="renderHtmlIndex" v-html="markdownHtml"></div>
+    <div v-if="sdkDoc" class="ag-markdown-view" id="markdown" :key="renderHtmlIndex" v-dompurify-html="markdownHtml"></div>
     <bk-exception
       v-else
       class="exception-wrap-item exception-part"
diff --git a/src/dashboard-front/src/views/apiDocs/doc-detail.vue b/src/dashboard-front/src/views/apiDocs/doc-detail.vue
index 727f74bbb..ee9eb1309 100644
--- a/src/dashboard-front/src/views/apiDocs/doc-detail.vue
+++ b/src/dashboard-front/src/views/apiDocs/doc-detail.vue
@@ -113,10 +113,10 @@
                         @click="handleApiClick(api.id)"
                       >
                         <!-- eslint-disable-next-line vue/no-v-html -->
-                        <header class="res-item-name" v-html="getHighlightedHtml(api.name)" v-bk-overflow-tips
+                        <header class="res-item-name" v-dompurify-html="getHighlightedHtml(api.name)" v-bk-overflow-tips
                         ></header>
                         <!-- eslint-disable-next-line vue/no-v-html -->
-                        <main class="res-item-desc" v-html="getHighlightedHtml(api.description)"></main>
+                        <main class="res-item-desc" v-dompurify-html="getHighlightedHtml(api.description)"></main>
                       </article>
                     </template>
                     <template v-else-if="keyword">
diff --git a/src/dashboard-front/src/views/apigwDocs/components/detail.vue b/src/dashboard-front/src/views/apigwDocs/components/detail.vue
index 83d376e78..912e8a5af 100644
--- a/src/dashboard-front/src/views/apigwDocs/components/detail.vue
+++ b/src/dashboard-front/src/views/apigwDocs/components/detail.vue
@@ -78,9 +78,9 @@
                         :class="{ 'active': curComponentName === component.name }"
                         @click="handleShowDoc(component)">
                         <!-- eslint-disable-next-line vue/no-v-html -->
-                        <p class="name" v-html="hightlight(component.name)" v-bk-overflow-tips></p>
+                        <p class="name" v-dompurify-html="hightlight(component.name)" v-bk-overflow-tips></p>
                         <!-- eslint-disable-next-line vue/no-v-html -->
-                        <p class="label" v-html="hightlight(component.description) || $t('暂无描述')" v-bk-overflow-tips>
+                        <p class="label" v-dompurify-html="hightlight(component.description) || $t('暂无描述')" v-bk-overflow-tips>
                         </p>
                       </li>
                     </ul>
diff --git a/src/dashboard-front/src/views/apigwDocs/components/doc.vue b/src/dashboard-front/src/views/apigwDocs/components/doc.vue
index ce461a933..553264d38 100644
--- a/src/dashboard-front/src/views/apigwDocs/components/doc.vue
+++ b/src/dashboard-front/src/views/apigwDocs/components/doc.vue
@@ -67,7 +67,7 @@
             </div>
           </div>
           <!-- eslint-disable-next-line vue/no-v-html -->
-          <div class="ag-markdown-view" id="markdown" :key="renderHtmlIndex" v-html="curComponent.markdownHtml"></div>
+          <div class="ag-markdown-view" id="markdown" :key="renderHtmlIndex" v-dompurify-html="curComponent.markdownHtml"></div>
         </bk-tab-panel>
         <bk-tab-panel
           :name="'sdk'"
@@ -92,7 +92,7 @@
 
             <h3 class="f16 mt20"> {{ $t('SDK使用样例') }} </h3>
             <!-- eslint-disable-next-line vue/no-v-html -->
-            <div class="ag-markdown-view mt20" :key="renderHtmlIndex" v-html="sdkMarkdownHtml"></div>
+            <div class="ag-markdown-view mt20" :key="renderHtmlIndex" v-dompurify-html="sdkMarkdownHtml"></div>
           </div>
         </bk-tab-panel>
       </bk-tab>
diff --git a/src/dashboard-front/src/views/basic-info/index.vue b/src/dashboard-front/src/views/basic-info/index.vue
index 0b023c316..44e3d4898 100644
--- a/src/dashboard-front/src/views/basic-info/index.vue
+++ b/src/dashboard-front/src/views/basic-info/index.vue
@@ -188,7 +188,7 @@
       @closed="delApigwDialog.isShow = false">
       <div class="ps-form">
         <!-- eslint-disable-next-line vue/no-v-html -->
-        <div class="form-tips" v-html="delTips" />
+        <div class="form-tips" v-dompurify-html="delTips" />
         <div class="mt15">
           <bk-input v-model="formRemoveConfirmApigw"></bk-input>
         </div>
diff --git a/src/dashboard-front/src/views/component-doc/components/detail.vue b/src/dashboard-front/src/views/component-doc/components/detail.vue
index 8d7b3349a..fefe796e9 100644
--- a/src/dashboard-front/src/views/component-doc/components/detail.vue
+++ b/src/dashboard-front/src/views/component-doc/components/detail.vue
@@ -33,9 +33,9 @@
               :class="{ 'active': curComponentName === component.name }" v-for="component of curComponentList"
               :key="component.id" @click="handleShowDoc(component)">
               <!-- eslint-disable-next-line vue/no-v-html -->
-              <p class="name" v-html="hightlight(component.name, 'api')"></p>
+              <p class="name" v-dompurify-html="hightlight(component.name, 'api')"></p>
               <!-- eslint-disable-next-line vue/no-v-html -->
-              <p class="label" v-html="hightlight(component.description, 'api')"></p>
+              <p class="label" v-dompurify-html="hightlight(component.description, 'api')"></p>
             </li>
           </ul>
           <template v-else-if="keyword">
@@ -85,11 +85,11 @@
                           params: { version: curVersionData.board, id: item.name }
                         }">
                         <!-- eslint-disable-next-line vue/no-v-html -->
-                        <span v-html="hightlight(item.description, 'panel')" @click="isNavPanelShow = false"></span>
+                        <span v-dompurify-html="hightlight(item.description, 'panel')" @click="isNavPanelShow = false"></span>
                       </router-link>
                       <p class="desc">
                         <!-- eslint-disable-next-line vue/no-v-html -->
-                        <span v-html="hightlight(item.name, 'panel')"></span>
+                        <span v-dompurify-html="hightlight(item.name, 'panel')"></span>
                       </p>
                     </li>
                   </ul>
diff --git a/src/dashboard-front/src/views/component-doc/components/doc.vue b/src/dashboard-front/src/views/component-doc/components/doc.vue
index 56449aa4b..4fc46a19e 100644
--- a/src/dashboard-front/src/views/component-doc/components/doc.vue
+++ b/src/dashboard-front/src/views/component-doc/components/doc.vue
@@ -54,7 +54,7 @@
             </div>
           </div>
           <!-- eslint-disable-next-line vue/no-v-html -->
-          <div class="ag-markdown-view" id="markdown" :key="renderHtmlIndex" v-html="curComponent.markdownHtml"></div>
+          <div class="ag-markdown-view" id="markdown" :key="renderHtmlIndex" v-dompurify-html="curComponent.markdownHtml"></div>
         </bk-tab-panel>
         <bk-tab-panel
           :name="'sdk '"
@@ -77,7 +77,7 @@
             </div>
             <h3 class="f16 mt30 fw700 mt15 mb15 balck">{{ t('SDK使用样例') }}</h3>
             <!-- eslint-disable-next-line vue/no-v-html -->
-            <div class="ag-markdown-view mt20" :key="renderHtmlIndex" v-html="sdkMarkdownHtml"></div>
+            <div class="ag-markdown-view mt20" :key="renderHtmlIndex" v-dompurify-html="sdkMarkdownHtml"></div>
           </div>
         </bk-tab-panel>
       </bk-tab>
diff --git a/src/dashboard-front/src/views/component-doc/components/searcher/index.vue b/src/dashboard-front/src/views/component-doc/components/searcher/index.vue
index 9e0536916..fc9c725dc 100644
--- a/src/dashboard-front/src/views/component-doc/components/searcher/index.vue
+++ b/src/dashboard-front/src/views/component-doc/components/searcher/index.vue
@@ -29,9 +29,9 @@
                 <a href="javascript:;">
                   <p class="name">
                     <!-- eslint-disable-next-line vue/no-v-html -->
-                    <strong class="mr5" v-html="hightlightSystemName(item)"></strong>
+                    <strong class="mr5" v-dompurify-html="hightlightSystemName(item)"></strong>
                     <!-- eslint-disable-next-line vue/no-v-html -->
-                    <span v-html="hightlight(item)"></span>
+                    <span v-dompurify-html="hightlight(item)"></span>
                   </p>
                   <p class="desc">{{ item.description || t('暂无描述') }}</p>
                 </a>
diff --git a/src/dashboard-front/src/views/components-access/manage/components/render-system.vue b/src/dashboard-front/src/views/components-access/manage/components/render-system.vue
index 2f1df9d1c..ca28d793a 100644
--- a/src/dashboard-front/src/views/components-access/manage/components/render-system.vue
+++ b/src/dashboard-front/src/views/components-access/manage/components/render-system.vue
@@ -33,7 +33,7 @@
             <p class="name">
               <span class="title-wrapper">
                 <!-- eslint-disable-next-line vue/no-v-html -->
-                <span v-html="highlight(item)"></span>
+                <span v-dompurify-html="highlight(item)"></span>
               </span>
               <span v-if="item.is_official" class="tag">
                 {{ t('官方') }}
@@ -41,7 +41,7 @@
               <span class="count fr">{{ item.component_count }}</span>
             </p>
             <!-- eslint-disable-next-line vue/no-v-html -->
-            <p class="desc" v-html="highlightDesc(item)"></p>
+            <p class="desc" v-dompurify-html="highlightDesc(item)"></p>
           </div>
         </template>
         <template v-else>
diff --git a/src/dashboard-front/src/views/components-access/manage/components/sync-access.vue b/src/dashboard-front/src/views/components-access/manage/components/sync-access.vue
index b8e2b32d6..0d262b007 100644
--- a/src/dashboard-front/src/views/components-access/manage/components/sync-access.vue
+++ b/src/dashboard-front/src/views/components-access/manage/components/sync-access.vue
@@ -5,11 +5,11 @@
         <p class="ag-table-change">
           {{ t('请确认以下组件对应网关资源的变更：') }}
           <!-- eslint-disable-next-line vue/no-v-html -->
-          <span v-html="addInfo"></span>
+          <span v-dompurify-html="addInfo"></span>
           <!-- eslint-disable-next-line vue/no-v-html -->
-          <span v-html="updateInfo"></span>
+          <span v-dompurify-html="updateInfo"></span>
           <!-- eslint-disable-next-line vue/no-v-html -->
-          <span v-html="deleteInfo"></span>
+          <span v-dompurify-html="deleteInfo"></span>
         </p>
         <bk-input
           :clearable="true"
diff --git a/src/dashboard-front/src/views/components-access/system/index.vue b/src/dashboard-front/src/views/components-access/system/index.vue
index e6415bde4..9f304b78c 100644
--- a/src/dashboard-front/src/views/components-access/system/index.vue
+++ b/src/dashboard-front/src/views/components-access/system/index.vue
@@ -128,7 +128,7 @@
         <div
           class="ft13"
           style="margin: 8px 0"
-          v-html="systemDelTips"
+          v-dompurify-html="systemDelTips"
         ></div>
         <bk-input v-model="formRemoveConfirmCode" />
         <div class="mt10 ft13">
diff --git a/src/dashboard-front/src/views/components/plugin-manage/plugin-info.vue b/src/dashboard-front/src/views/components/plugin-manage/plugin-info.vue
index 4bd6707f7..b36d0db41 100644
--- a/src/dashboard-front/src/views/components/plugin-manage/plugin-info.vue
+++ b/src/dashboard-front/src/views/components/plugin-manage/plugin-info.vue
@@ -124,7 +124,7 @@
       </header>
       <main class="example-main">
         <!-- eslint-disable-next-line vue/no-v-html -->
-        <pre class="example-pre" v-html="exampleHtml"></pre>
+        <pre class="example-pre" v-dompurify-html="exampleHtml"></pre>
       </main>
     </aside>
   </div>
diff --git a/src/dashboard-front/src/views/components/resource-doc-slider/index.vue b/src/dashboard-front/src/views/components/resource-doc-slider/index.vue
index e46a38d46..672ad2c83 100644
--- a/src/dashboard-front/src/views/components/resource-doc-slider/index.vue
+++ b/src/dashboard-front/src/views/components/resource-doc-slider/index.vue
@@ -58,7 +58,7 @@
                 </p>
               </div>
               <!-- eslint-disable vue/no-v-html -->
-              <div class="ag-markdown-view" v-html="markdownHtml" v-show="!isEdited"></div>
+              <div class="ag-markdown-view" v-dompurify-html="markdownHtml" v-show="!isEdited"></div>
               <div class="ag-markdown-editor" v-show="isEdited">
                 <mavon-editor
                   ref="markdownRef"
diff --git a/src/dashboard-front/src/views/components/resources-doc/index.vue b/src/dashboard-front/src/views/components/resources-doc/index.vue
index 5f0d22c7c..aece820ae 100644
--- a/src/dashboard-front/src/views/components/resources-doc/index.vue
+++ b/src/dashboard-front/src/views/components/resources-doc/index.vue
@@ -46,7 +46,7 @@
           </p>
         </div>
         <!-- eslint-disable vue/no-v-html -->
-        <div class="ag-markdown-view" v-html="markdownHtml" v-show="!isEdited" style="padding-bottom: 54px;"></div>
+        <div class="ag-markdown-view" v-dompurify-html="markdownHtml" v-show="!isEdited" style="padding-bottom: 54px;"></div>
         <div class="ag-markdown-editor" v-show="isEdited">
           <mavon-editor
             ref="markdownRef"
diff --git a/src/dashboard-front/src/views/home.vue b/src/dashboard-front/src/views/home.vue
index 54ce0d06a..bf971ae9b 100644
--- a/src/dashboard-front/src/views/home.vue
+++ b/src/dashboard-front/src/views/home.vue
@@ -140,7 +140,7 @@
       </div>
       Copyright © 2012-{{curYear}} Tencent BlueKing. All Rights Reserved. V{{GLOBAL_CONFIG.FOOT_INFO.VERSION}} -->
       <!-- eslint-disable-next-line vue/no-v-html -->
-      <p class="contact" v-html="contact"></p>
+      <p class="contact" v-dompurify-html="contact"></p>
       <p class="copyright">{{copyright}}</p>
     </div>
 
diff --git a/src/dashboard-front/src/views/online-debug/components/doc.vue b/src/dashboard-front/src/views/online-debug/components/doc.vue
index c4b9576f9..993b5969a 100644
--- a/src/dashboard-front/src/views/online-debug/components/doc.vue
+++ b/src/dashboard-front/src/views/online-debug/components/doc.vue
@@ -56,7 +56,7 @@
             </div>
           </div>
           <!-- eslint-disable-next-line vue/no-v-html -->
-          <div class="ag-markdown-view" id="markdown" :key="renderHtmlIndex" v-html="curComponent.markdownHtml"></div>
+          <div class="ag-markdown-view" id="markdown" :key="renderHtmlIndex" v-dompurify-html="curComponent.markdownHtml"></div>
         </bk-tab-panel>
         <!-- <bk-tab-panel
           :name="'sdk'"
@@ -80,7 +80,7 @@
             </div>
 
             <h3 class="f16 mt20"> {{ t('SDK使用样例') }} </h3>
-            <div class="ag-markdown-view mt20" :key="renderHtmlIndex" v-html="sdkMarkdownHtml"></div>
+            <div class="ag-markdown-view mt20" :key="renderHtmlIndex" v-dompurify-html="sdkMarkdownHtml"></div>
           </div>
         </bk-tab-panel> -->
       </bk-tab>
diff --git a/src/dashboard-front/src/views/online-debug/index.vue b/src/dashboard-front/src/views/online-debug/index.vue
index e1af70d10..4d10a59b7 100644
--- a/src/dashboard-front/src/views/online-debug/index.vue
+++ b/src/dashboard-front/src/views/online-debug/index.vue
@@ -55,9 +55,9 @@
                       :class="{ 'active': curComponentName === component.name }"
                       @click="handleShowDoc(component)">
                       <!-- eslint-disable-next-line vue/no-v-html -->
-                      <p class="name" v-html="hightlight(component.name)" v-bk-overflow-tips></p>
+                      <p class="name" v-dompurify-html="hightlight(component.name)" v-bk-overflow-tips></p>
                       <!-- eslint-disable-next-line vue/no-v-html -->
-                      <p class="label" v-html="hightlight(component.description) || t('暂无描述')" v-bk-overflow-tips>
+                      <p class="label" v-dompurify-html="hightlight(component.description) || t('暂无描述')" v-bk-overflow-tips>
                       </p>
                     </li>
                   </ul>
diff --git a/src/dashboard-front/src/views/operate-data/access-log/detail.vue b/src/dashboard-front/src/views/operate-data/access-log/detail.vue
index 6297069dc..93e4a12e3 100644
--- a/src/dashboard-front/src/views/operate-data/access-log/detail.vue
+++ b/src/dashboard-front/src/views/operate-data/access-log/detail.vue
@@ -6,7 +6,7 @@
     <div class="access-log-container">
       <div class="detail-panel" v-show="!hasError">
         <div class="panel-hd">
-          <h2 class="title" v-html="titleInfo"></h2>
+          <h2 class="title" v-dompurify-html="titleInfo"></h2>
           <small class="time">{{transformTime(+routeQuery.bk_timestamp)}}</small>
         </div>
         <div class="panel-bd">
diff --git a/src/dashboard-front/src/views/resource/version/components/resourceDetail.vue b/src/dashboard-front/src/views/resource/version/components/resourceDetail.vue
index 00203a50f..b6cd041e7 100644
--- a/src/dashboard-front/src/views/resource/version/components/resourceDetail.vue
+++ b/src/dashboard-front/src/views/resource/version/components/resourceDetail.vue
@@ -28,7 +28,7 @@
                     @click="changeCurrentSource(item)"
                   >
                     <bk-overflow-title type="tips">
-                      <span v-html="renderTitle(item.name)"></span>
+                      <span v-dompurify-html="renderTitle(item.name)"></span>
                     </bk-overflow-title>
                   </div>
                 </template>
diff --git a/src/dashboard-front/src/views/sdk/components/sdk-detail.vue b/src/dashboard-front/src/views/sdk/components/sdk-detail.vue
index 9bb929bd9..61c0e5d26 100644
--- a/src/dashboard-front/src/views/sdk/components/sdk-detail.vue
+++ b/src/dashboard-front/src/views/sdk/components/sdk-detail.vue
@@ -96,7 +96,7 @@
           <!-- <bk-button disabled>GO</bk-button> -->
         </div>
         <!-- eslint-disable-next-line vue/no-v-html -->
-        <div class="ag-markdown-view" id="markdown" :key="renderHtmlIndex" v-html="markdownHtml"></div>
+        <div class="ag-markdown-view" id="markdown" :key="renderHtmlIndex" v-dompurify-html="markdownHtml"></div>
       </bk-tab-panel>
     </bk-tab>
 
diff --git a/src/dashboard-front/yarn.lock b/src/dashboard-front/yarn.lock
index 22a01b9a9..098e41098 100644
--- a/src/dashboard-front/yarn.lock
+++ b/src/dashboard-front/yarn.lock
@@ -3764,6 +3764,11 @@ domhandler@^5.0.2, domhandler@^5.0.3:
   dependencies:
     domelementtype "^2.3.0"
 
+dompurify@^3.0.0:
+  version "3.1.7"
+  resolved "https://registry.yarnpkg.com/dompurify/-/dompurify-3.1.7.tgz#711a8c96479fb6ced93453732c160c3c72418a6a"
+  integrity sha512-VaTstWtsneJY8xzy7DekmYWEOZcmzIe3Qb3zPd4STve1OBTa+e+WmS1ITQec1fZYXI3HCsOZZiSMpG6oxoWMWQ==
+
 domutils@^2.5.2, domutils@^2.8.0:
   version "2.8.0"
   resolved "https://registry.npmjs.org/domutils/-/domutils-2.8.0.tgz"
@@ -8567,6 +8572,13 @@ vue-demi@>=0.14.10, vue-demi@^0.14.10:
   resolved "https://registry.yarnpkg.com/vue-demi/-/vue-demi-0.14.10.tgz#afc78de3d6f9e11bf78c55e8510ee12814522f04"
   integrity sha512-nMZBOwuzabUO0nLgIcc6rycZEebF6eeUfaiQx9+WSk8e29IbLvPU9feI6tqW4kTo3hvoYAJkMh8n8D0fuISphg==
 
+vue-dompurify-html@^5.1.0:
+  version "5.1.0"
+  resolved "https://registry.yarnpkg.com/vue-dompurify-html/-/vue-dompurify-html-5.1.0.tgz#7f720ad0043804642af7d65d4e002c574ce3c951"
+  integrity sha512-616o2/PBdOLM2bwlRWLdzeEC9NerLkwiudqNgaIJ5vBQWXec+u7Kuzh+45DtQQrids67s4pHnTnJZLVfyPMxbA==
+  dependencies:
+    dompurify "^3.0.0"
+
 vue-eslint-parser@^9.3.1, vue-eslint-parser@^9.4.2:
   version "9.4.2"
   resolved "https://registry.npmjs.org/vue-eslint-parser/-/vue-eslint-parser-9.4.2.tgz"