diff --git a/README-EN.md b/README-EN.md index 68ef5c473..5515e8fe0 100644 --- a/README-EN.md +++ b/README-EN.md @@ -122,7 +122,7 @@ export default { | imageFilter | Function | null | Image file filter Function, params is a `File Object`, you should return `Boolean` about the test result | | imageClick | function | null | Image Click Function | | tabSize | Number | null | How many spaces equals one tab, default \t | -| xssOptions | Object | null | xss options: [https://github.com/leizongmin/js-xss](https://github.com/leizongmin/js-xss) | +| xssOptions | Object | {} | xss rule configuration, enabled by default, set to false to turn off, custom rule reference [https://jsxss.com/zh/options.html](https://jsxss.com/zh/options.html) | | toolbars | Object | As in the following example | toolbars | ```javascript diff --git a/README.md b/README.md index 66f30b982..b9547955c 100644 --- a/README.md +++ b/README.md @@ -126,7 +126,7 @@ export default { | imageFilter | function | null | 图片过滤函数,参数为一个`File Object`,要求返回一个`Boolean`, `true`表示文件合法,`false`表示文件不合法 | | imageClick | function | null | 图片点击事件,默认为预览,可覆盖 | | tabSize | Number | \t | tab转化为几个空格,默认为\t | -| xssOptions | Object | null | xss规则配置,参考 [https://github.com/leizongmin/js-xss](https://github.com/leizongmin/js-xss) | +| xssOptions | Object | {} | xss规则配置, 默认开启,设置false可以关闭,自定义规则参考 [https://jsxss.com/zh/options.html](https://jsxss.com/zh/options.html) | | toolbars | Object | 如下例 | 工具栏 | ```javascript diff --git a/src/lib/core/rules.js b/src/lib/core/rules.js new file mode 100644 index 000000000..064756e16 --- /dev/null +++ b/src/lib/core/rules.js @@ -0,0 +1,19 @@ +export const HEADER_FLAG = ' _MD-HEADER_ '; + +export function headRule(tocHeadRule) { + return function (tokens, index) { + let code = tocHeadRule(tokens, index); + var label = tokens[index + 1]; + if (label.type === 'inline') { + return code.replace('). @@ -89,6 +91,9 @@ markdown.use(mihe, hljs_opts) .use(taskLists) .use(toc) +const tocHeadRule = markdown.renderer.rules.heading_open; +markdown.renderer.rules.heading_open = headRule(tocHeadRule); + export default { data() { return { diff --git a/src/mavon-editor.vue b/src/mavon-editor.vue index 4428a2e85..703b6e358 100644 --- a/src/mavon-editor.vue +++ b/src/mavon-editor.vue @@ -119,7 +119,9 @@ import md_toolbar_left from './components/md-toolbar-left.vue' import md_toolbar_right from './components/md-toolbar-right.vue' import "./lib/font/css/fontello.css" import './lib/css/md.css' -const xss = require('xss'); +import { recoverHead } from './lib/core/rules.js' +import { FilterXSS } from 'xss'; + export default { mixins: [markdown], props: { @@ -198,9 +200,9 @@ export default { } }, xssOptions: { // XSS 选项 - type: Object, + type: [Object, Boolean], default() { - return null + return {} } }, codeStyle: { // 样式 @@ -305,7 +307,8 @@ export default { }, p_external_link: {}, textarea_selectionEnd: 0, - textarea_selectionEnds: [0] + textarea_selectionEnds: [0], + _xssHandler: null }; }, created() { @@ -640,13 +643,34 @@ export default { console.warn('hljs color scheme', val, 'do not exist, hljs color scheme will not change'); } }, + xssHandler(htmlCode) { + if (this._xssHandler) { + return this._xssHandler.process(htmlCode); + } + + let originalTagFun; + if (typeof this.xssOptions['onTag'] === 'function') { + originalTagFun = this.xssOptions['onTag']; + } + this.xssOptions['onTag'] = function(tag, html, info) { + let code = recoverHead(tag, html); + if (originalTagFun) { + code = originalTagFun(tag,code); + } + if (html !== code) { + return code; + } + } + this._xssHandler = new FilterXSS(this.xssOptions); + return this._xssHandler.process(htmlCode); + }, iRender(toggleChange) { var $vm = this; this.$render($vm.d_value, function(res) { - // render - // HTML 渲染前先进行过滤,避免 xss 问题,默认情况下开始此功能 - res = xss(res, $vm.$props.xssOptions || {}) + if (typeof $vm.xssOptions === 'object') { + res = $vm.xssHandler(res); + } $vm.d_render = res; // change回调 toggleChange == false 时候触发change回调 diff --git a/webpack/webpack.dev.js b/webpack/webpack.dev.js index 448cb3e50..286ebddae 100644 --- a/webpack/webpack.dev.js +++ b/webpack/webpack.dev.js @@ -41,7 +41,7 @@ var config = { // hot: true, // noInfo: true }, - devtool: '#eval-source-map' + devtool: 'source-map' } var res = merge([base, config]);