kkomelin/isomorphic-dompurify

dompurify.sanitize clears everything except for whats inside of <body>

yeti0904 opened this issue · 2 comments

image
the code:

	if (userfound) {
		var toSend;
		toSend = fs.readFileSync("./pages/profile.html", "utf-8")
		.replaceAll("${username}", userdata["username"])
		.replaceAll("${bio}", userdata["bio"])
		.replaceAll("${pfpurl}", userdata["profile-picture-url"])

		res.send(dompurify.sanitize(toSend));
	}

the webpage html:

<html>
	<head>
		<title>Antisocial</title>
		<style>
			body {
				margin:0px;
				text-align: left;
				font-family:'Trebuchet MS', 'Lucida Sans Unicode', 'Lucida Grande', 'Lucida Sans', Arial, sans-serif;
			}
			.leftbar {
				position:absolute;
				top: 0px;
				left: 0px;
				background-color: #007e45;
				width: 250px;
				height: 100vh;
				font-weight: bold;
				font-size: 115%;
				margin: 0px auto;
				padding-left: 10px;
			}
			/*.leftbar a {
				color: white;
				text-decoration: none;
			}*/
			.leftbar button {
				background-color: #005500;
				color: white;
				border-radius: 12%;
				font-size: 25px;
				border: none;
				transition-duration: 250ms;
				cursor: pointer;
				margin-bottom: 5px;
			}
			.leftbar button:hover {
				background-color: #009900;
			}
			.leftbar_settings {
				bottom: 10px;
			}
			.mainbody {
				position: absolute;
				top: 5px;
				left: 275px;
				font-family:'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
				color: black;
				width: 100% - 275px;
			}
			button {
				background-color: #008800;
				font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
				color: white;
				border: none;
				font-size: large;
				cursor: pointer;
			}
			button:hover {
				background-color: #00bb00;
			}
			img {
				border-style: solid;
			}
		</style>
		<meta name="og:title" content="$USERNAME$'s profile on Antisocial"/>
		<meta name="og:description" content="$USERBIO$"/>
		<meta name="og:color" content="#00aa00"/>
		<meta name="og:image" content="$PFPURL$"/>
	</head>
	<body>
		<div class="leftbar">
			<h1>Antisocial</h1>
			<a href="/"><button>Home</button><br></a>
			<a href="/explore"><button>Explore</button><br></a>
			<a href="/profile"><button>Profile</button><br></a>
			<a href="/settings"><button class="leftbar_settings">Settings</button><br></a>
		</div>
		<div class="mainbody">
			<img src="${pfpurl}" width="80px" height="80px">
			<h1>${username}'s profile</h1>
			<p>${bio}</p>
			<hr>
			<h1>Posts</h1>
		</div>
	</body>
</html>

I hope you have found a solution for your problem. In case not, please configure DOMPurify according to your needs https://github.com/cure53/DOMPurify/blob/main/README.md#can-i-configure-dompurify

i have found a solution: dont purify the entire html