CODEWITHSUNDEEP
reactjshtml-sanitizingnext.js13
Viktor
Viktor

Reputation: 21

How to sanitize html with next.js 13 server side?

How to sanitize html on next.js 13 server side?

` import getData from '../../../firebase/firestore/getData'; import sanitizeHtml from 'sanitize-html';

export default async function Jbpregled() { const data = await getData();

return (
    <div className="mt-4">
        <div className="px-4 sm:px-8 max-w-5xl m-auto">
            <h1 className="text-center font-semibold text-sm">Javne nabavke:</h1>
            <ul className="border border-gray-200 rounded overflow-hidden shadow-md">

                {data.map(item => <li key={item.id} className="px-4 py-2 bg-white hover:bg-sky-100 hover:text-sky-900 border-b last:border-none border-gray-200 transition-all duration-300 ease-in-out">
                    {sanitizeHtml(item.tekst)}
                </li>)}
            </ul>

        </div>
    </div>

)

}` Tryed this but still geting html tags...

Upvotes: 2

Views: 5528

Answers (1)

Basant Mandal
Basant Mandal

Reputation: 106

To Sanitize Html - Try Isomorphic DOMPurify.

This library makes it possible to seamlessly use DOMPurify (DOMPurify sanitizes HTML and prevents XSS attacks) on server and client in the same way.

Sample Code for removing HTML

const DOMPurify = require('isomorphic-dompurify');
const dirty_string = '<b>Hello There</b>';
let clean_string = DOMPurify.sanitize(dirty_string, { USE_PROFILES: { html: false } });
console.log("Sanitized String = " + clean_string);

How to configure DOMPurify ? - https://github.com/cure53/DOMPurify/blob/main/README.md#can-i-configure-dompurify

Upvotes: 0

Related Questions