Closed tnhu closed 1 year ago
@tnhu
skipHtml
(boolean, default: false) Ignore HTML in Markdown completely@tnhu Using rehype-sanitize
is also ignorable.
@jaywcjlove skipHtml
does not work. The html content is still injected.
import ReactMarkdownPreview from '@uiw/react-markdown-preview'
const source = `<div onmouseover="alert('alpha')">
<a href="jAva script:alert('bravo')">delta</a>
<img src="x" onerror="alert('charlie')">
<iframe src="javascript:alert('delta')"></iframe>
<math>
<mi xlink:href="data:x,<script>alert('echo')</script>"></mi>
</math>
</div>
<script>
require('child_process').spawn('echo', ['hack!']);
</script>`
...
<ReactMarkdownPreview source={source} skipHtml />
--> delta
is shown in an alert
You can try it here - https://codesandbox.io/s/floral-leaf-s0t7hm?file=/src/App.js
import MarkdownPreview from "@uiw/react-markdown-preview";
const source = `<div onmouseover="alert('alpha')">
<a href="jAva script:alert('bravo')">delta</a>
<img src="x" onerror1="alert('charlie')">
<iframe src="javascript:alert('delta')"></iframe>
<math>
<mi xlink:href="data:x,<script>alert('echo')</script>"></mi>
</math>
</div>
<script>
require('child_process').spawn('echo', ['hack!']);
</script>`;
export default function App() {
return (
<div className="App">
<MarkdownPreview
source={source}
skipHtml={false}
/>
</div>
);
}
@tnhu Upgrade v4.1.2
@jaywcjlove it works. Thank you very much! skipHtml={false}
removed support for raw HTML, as a result, it prevents security issue like above.
Just to add a little more:
skipHtml={true}
to remove raw HTML instead of skipHtml={false}
? skip
something means ignore
it. In this context, I think skip
equals to false
but actually removing support for it is confusing.skipHtml={false}
), all HTML tags in the markdown source are ignored. It's good for security purposes but it's harsh as we can't have some small nice things like <quote>
, etc... It'd be best if somehow we can filter out the malicious ones, but still keep simple tags that we support. @tnhu Parse html by default This is because I have many projects using this package, Keep the original features.
skipHtml={false}
does not parse HTML by default, which is a feature of the dependent react-markdown package.
react-markdown-preview
does not sanitize HTML content before rendering. Paste below code into https://uiwjs.github.io/react-markdown-preview and you'll see an alert showing up.Maybe https://github.com/rehypejs/rehype-sanitize should be included?