0
0
mirror of https://github.com/naturalcrit/homebrewery.git synced 2025-12-26 11:42:39 +00:00

Functional vue-html-secure version

This commit is contained in:
G.Ambatte
2024-07-02 08:21:42 +12:00
parent acb10d7695
commit 9f3a4dc6bb
3 changed files with 15 additions and 23 deletions

View File

@@ -15,13 +15,6 @@ const Frame = require('react-frame-component').default;
const dedent = require('dedent-tabs').default;
const { printCurrentBrew } = require('../../../shared/helpers.js');
import DOMPurify from 'dompurify';
const purifyConfig = {
ADD_ATTR : ['id', 'target'],
FORBID_TAGS : ['script']
};
const Themes = require('themes/themes.json');
const PAGE_HEIGHT = 1056;
@@ -34,6 +27,8 @@ const INITIAL_CONTENT = dedent`
<base target=_blank>
</head><body style='overflow: hidden'><div></div></body></html>`;
let safeHTML = ()=>{};
//v=====----------------------< Brew Page Component >---------------------=====v//
const BrewPage = (props)=>{
props = {
@@ -41,7 +36,7 @@ const BrewPage = (props)=>{
index : 0,
...props
};
const cleanText = DOMPurify.sanitize(props.contents, purifyConfig);
const cleanText = safeHTML(props.contents);
return <div className={props.className} id={`p${props.index + 1}`} >
<div className='columnWrapper' dangerouslySetInnerHTML={{ __html: cleanText }} />
</div>;
@@ -130,9 +125,9 @@ const BrewRenderer = (props)=>{
const renderStyle = ()=>{
if(!props.style) return;
const cleanStyle = DOMPurify.sanitize(props.style, purifyConfig);
const cleanStyle = safeHTML(`<style>${props.style}</style>`);
//return <div style={{ display: 'none' }} dangerouslySetInnerHTML={{ __html: `<style>@layer styleTab {\n${sanitizeScriptTags(props.style)}\n} </style>` }} />;
return <div style={{ display: 'none' }} dangerouslySetInnerHTML={{ __html: `<style> ${cleanStyle} </style>` }} />;
return <div style={{ display: 'none' }} dangerouslySetInnerHTML={{ __html: cleanStyle }} />;
};
const renderPage = (pageText, index)=>{
@@ -175,10 +170,7 @@ const BrewRenderer = (props)=>{
};
const frameDidMount = ()=>{ //This triggers when iFrame finishes internal "componentDidMount"
DOMPurify.addHook('uponSanitizeElement', (node, data, config)=>{
const tagName = node.tagName?.toLowerCase();
if(!config.FORBID_TAGS?.includes(tagName)){ data.allowedTags[tagName] = true; }
});
safeHTML = require('vue-html-secure').safeHTML;
setTimeout(()=>{ //We still see a flicker where the style isn't applied yet, so wait 100ms before showing iFrame
updateSize();

14
package-lock.json generated
View File

@@ -21,7 +21,6 @@
"cookie-parser": "^1.4.6",
"create-react-class": "^15.7.0",
"dedent-tabs": "^0.10.3",
"dompurify": "^3.1.5",
"expr-eval": "^2.0.2",
"express": "^4.19.2",
"express-async-handler": "^1.2.0",
@@ -47,7 +46,8 @@
"react-router-dom": "6.23.1",
"sanitize-filename": "1.6.3",
"superagent": "^9.0.2",
"vitreum": "git+https://git@github.com/calculuschild/vitreum.git"
"vitreum": "git+https://git@github.com/calculuschild/vitreum.git",
"vue-html-secure": "^1.0.10"
},
"devDependencies": {
"eslint": "^8.57.0",
@@ -5467,11 +5467,6 @@
"npm": ">=1.2"
}
},
"node_modules/dompurify": {
"version": "3.1.5",
"resolved": "https://registry.npmjs.org/dompurify/-/dompurify-3.1.5.tgz",
"integrity": "sha512-lwG+n5h8QNpxtyrJW/gJWckL+1/DQiYMX8f7t8Z2AZTPw1esVrqjI63i7Zc2Gz0aKzLVMYC1V1PL/ky+aY/NgA=="
},
"node_modules/duplexer2": {
"version": "0.1.4",
"resolved": "https://registry.npmjs.org/duplexer2/-/duplexer2-0.1.4.tgz",
@@ -14628,6 +14623,11 @@
"resolved": "https://registry.npmjs.org/vm-browserify/-/vm-browserify-1.1.2.tgz",
"integrity": "sha512-2ham8XPWTONajOR0ohOKOHXkm3+gaBmGut3SRuu75xLd/RRaY6vqgh8NBYYk7+RW3u5AtzPQZG8F10LHkl0lAQ=="
},
"node_modules/vue-html-secure": {
"version": "1.0.10",
"resolved": "https://registry.npmjs.org/vue-html-secure/-/vue-html-secure-1.0.10.tgz",
"integrity": "sha512-Cvlg0vYQiRxouXMFHQ87n5AIadl8SnrTNKbNENhJMlQIyrFkbXZ8yjn4c03BB0BeoPOf8vHKSx8f4yR3BIqYjQ=="
},
"node_modules/walker": {
"version": "1.0.8",
"resolved": "https://registry.npmjs.org/walker/-/walker-1.0.8.tgz",

View File

@@ -93,7 +93,6 @@
"cookie-parser": "^1.4.6",
"create-react-class": "^15.7.0",
"dedent-tabs": "^0.10.3",
"dompurify": "^3.1.5",
"expr-eval": "^2.0.2",
"express": "^4.19.2",
"express-async-handler": "^1.2.0",
@@ -119,7 +118,8 @@
"react-router-dom": "6.23.1",
"sanitize-filename": "1.6.3",
"superagent": "^9.0.2",
"vitreum": "git+https://git@github.com/calculuschild/vitreum.git"
"vitreum": "git+https://git@github.com/calculuschild/vitreum.git",
"vue-html-secure": "^1.0.10"
},
"devDependencies": {
"eslint": "^8.57.0",