How Can I Easily Decode HTML Special Entities While Preventing XSS?

Decoding HTML Special Entities with Ease

Decoding HTML special entities can be a confusing task. Consider the following JSON response:

{
    "message": "We're unable to complete your request at this time."
}

Notice the encoded apostrophe ('). While the reason behind this encoding may be unclear, your primary concern is decoding it.

jQuery's Invasive Approach

One possible method using jQuery is to convert the HTML string into a div and extract its text content:

function decodeHtml(html) {
    return $('<div>').html(html).text();
}

However, this approach is somewhat unconventional.

A Preferred Solution: Preserving Tags

A more elegant solution exists that also preserves tags:

function decodeHtml(html) {
    var txt = document.createElement("textarea");
    txt.innerHTML = html;
    return txt.value;
}

This approach involves creating a textarea element, setting its innerHTML to the HTML string, and then retrieving its value, which will be the decoded content.

Practical Example with XSS Prevention

Consider the following example:

Input:
Entity:&amp;nbsp;Bad attempt at XSS:<script>alert('new\nline?')</script><br>

Output:
Entity: Bad attempt at XSS:<script>alert('new\nline?')</script><br>

As you can see, the special entity ( ) is decoded, while the script tag is preserved, ensuring the safety of your application.

The above is the detailed content of How Can I Easily Decode HTML Special Entities While Preventing XSS?. For more information, please follow other related articles on the PHP Chinese website!