Fix xss attack for comment

package-lock.json

@@ -10716,11 +10716,6 @@
       "integrity": "sha1-vsECT4WxvZbL6kBbI8FK1kQ6b4E=",
       "dev": true
     },
-    "lodash.get": {
-      "version": "4.4.2",
-      "resolved": "https://registry.npmjs.org/lodash.get/-/lodash.get-4.4.2.tgz",
-      "integrity": "sha1-LRd/ZS+jHpObRDjVNBSZ36OCXpk="
-    },
     "lodash.kebabcase": {
       "version": "4.1.1",
       "resolved": "http://registry.npm.taobao.org/lodash.kebabcase/download/lodash.kebabcase-4.1.1.tgz",
@@ -10843,6 +10838,11 @@
         "object-visit": "^1.0.0"
       }
     },
+    "marked": {
+      "version": "0.6.2",
+      "resolved": "https://registry.npm.taobao.org/marked/download/marked-0.6.2.tgz",
+      "integrity": "sha1-xXS+i1Rai0hkFFbKHb4ON7bczBo="
+    },
     "math-random": {
       "version": "1.0.4",
       "resolved": "https://registry.npmjs.org/math-random/-/math-random-1.0.4.tgz",
@@ -13555,7 +13555,8 @@
       "version": "4.0.8",
       "resolved": "http://registry.npm.taobao.org/rx-lite/download/rx-lite-4.0.8.tgz",
       "integrity": "sha1-Cx4Rr4vESDbwSmQH6S2kJGe3lEQ=",
-      "dev": true
+      "dev": true,
+      "optional": true
     },
     "rx-lite-aggregates": {
       "version": "4.0.8",
@@ -15485,11 +15486,6 @@
         }
       }
     },
-    "vue-fragment": {
-      "version": "1.5.0",
-      "resolved": "https://registry.npmjs.org/vue-fragment/-/vue-fragment-1.5.0.tgz",
-      "integrity": "sha512-nobmbbOSOx59fm7U00BDz14Yvqitwx7NPQGYDTKg3+dNDGTDCRNy/q2kfr5hV4S0l4fQG0kvC+rbCmENLmHUSA=="
-    },
     "vue-hot-reload-api": {
       "version": "2.3.3",
       "resolved": "https://registry.npmjs.org/vue-hot-reload-api/-/vue-hot-reload-api-2.3.3.tgz",
@@ -15558,11 +15554,6 @@
       "integrity": "sha512-We9ZLSYPQx9y3v5+HNWyjkGFaxZMlWPTqYBU08y4YT46f453BQ4JxIoS8rV0a8PIxnKap7m/YIzrdIfoHxrpaA==",
       "dev": true
     },
-    "vue-svg-component-runtime": {
-      "version": "1.0.1",
-      "resolved": "https://registry.npmjs.org/vue-svg-component-runtime/-/vue-svg-component-runtime-1.0.1.tgz",
-      "integrity": "sha512-TkmZ1qwFeFJSRH6b6KVqDU2f8DCSdoNoo/veKqog7FsyF0UETTI66ALKX1rrLXy/KT6LSaJB5IfZkuuSfaQsEA=="
-    },
     "vue-svg-icon-loader": {
       "version": "2.1.1",
       "resolved": "https://registry.npmjs.org/vue-svg-icon-loader/-/vue-svg-icon-loader-2.1.1.tgz",

package.json

@@ -13,6 +13,7 @@
     "ant-design-vue": "~1.3.7",
     "axios": "^0.18.0",
     "enquire.js": "^2.1.6",
+    "marked": "^0.6.2",
     "mavon-editor": "^2.7.2",
     "moment": "^2.24.0",
     "nprogress": "^0.2.0",

src/components/Tools/HeaderComment.vue

@@ -11,7 +11,7 @@
   >
     <template slot="content">
       <a-spin :spinning="loadding">
-        <a-list :dataSource="comments">
+        <a-list :dataSource="converttedComments">
           <a-list-item
             slot="renderItem"
             slot-scope="item"
@@ -56,6 +56,8 @@
 
 <script>
 import commentApi from '@/api/comment'
+import marked from 'marked'
+
 export default {
   name: 'HeaderComment',
   data() {
@@ -68,6 +70,14 @@ export default {
   created() {
     this.getComment()
   },
+  computed: {
+    converttedComments() {
+      return this.comments.map(comment => {
+        comment.content = marked(comment.content, { sanitize: true })
+        return comment
+      })
+    }
+  },
   methods: {
     fetchComment() {
       if (!this.visible) {

src/views/comment/CommentList.vue

@@ -240,6 +240,8 @@
 <script>
 import { PageView } from '@/layouts'
 import commentApi from '@/api/comment'
+import marked from 'marked'
+
 const columns = [
   {
     title: '昵称',
@@ -307,6 +309,7 @@ export default {
     formattedComments() {
       return this.comments.map(comment => {
         comment.statusProperty = this.commentStatus[comment.status]
+        comment.content = marked(comment.content, { sanitize: true })
         return comment
       })
     }

src/views/dashboard/Dashboard.vue

@@ -138,7 +138,7 @@
                 </span>
                 <a-list
                   itemLayout="horizontal"
-                  :dataSource="commentData"
+                  :dataSource="formmatedCommentData"
                 >
                   <a-list-item
                     slot="renderItem"
@@ -332,6 +332,7 @@
 import { PageView } from '@/layouts'
 import AnalysisCard from './components/AnalysisCard'
 import { mixin, mixinDevice } from '@/utils/mixin.js'
+import marked from 'marked'
 
 import postApi from '@/api/post'
 import commentApi from '@/api/comment'
@@ -393,6 +394,12 @@ export default {
         log.type = this.logType[log.type].text
         return log
       })
+    },
+    formmatedCommentData() {
+      return this.commentData.map(comment => {
+        comment.content = marked(comment.content, { sanitize: true })
+        return comment
+      })
     }
   },
   methods: {