i wanna store html type string into database, but safely

Question

i have my react quill component, which returns something like this
EXAMPLE:
<p><br></p><p>fsdafsd</p><p>fsdfsda</p><p>fsdafsad</p

and that is content, and i wanna save it into database, but i'm not sure, i don't think that i have to save it as string because someone can imbed script into itt and it's not safe, can you help me how can i do this,

also when i'm saving it into dataabse i wanna somehow get same html string from database, to display it into website

i just tried to use library, to remove this html characters, but it saves only plane text, and i wanna retreat it from database as it was saved like html

Answer 1

You should save HTML content in database by encoding it to prevent security vulnerabilities or data corruption. If HTML saved as row it will make your application vulnerable to XSS attack.

In plain javascript you can use inbuilt escape function to encode and unescape to decode

const encodedHtmlContent = escape(<your html content here>);
// save encodedHtmlContent in DB

// To display encoded html
const decodedHtmlContent = unescape(<your encoded html content here>);
//render this decodedHtmlContent. through your component or available Mrkdown libraries

you can also create own encode / decode logic and use based on your requirement.