I have some Javascript code that communicates with an XML-RPC backend. The XML-RPC returns strings of the form:
Do you need to decode all encoded HTML entities or just &
itself?
If you only need to handle &
then you can do this:
var decoded = encoded.replace(/&/g, '&');
If you need to decode all HTML entities then you can do it without jQuery:
var elem = document.createElement('textarea');
elem.innerHTML = encoded;
var decoded = elem.value;
Please take note of Mark's comments below which highlight security holes in an earlier version of this answer and recommend using textarea
rather than div
to mitigate against potential XSS vulnerabilities. These vulnerabilities exist whether you use jQuery or plain JavaScript.
In case you're looking for it, like me - meanwhile there's a nice and safe JQuery method.
https://api.jquery.com/jquery.parsehtml/
You can f.ex. type this in your console:
var x = "test &";
> undefined
$.parseHTML(x)[0].textContent
> "test &"
So $.parseHTML(x) returns an array, and if you have HTML markup within your text, the array.length will be greater than 1.
var encodedStr = 'hello & world';
var parser = new DOMParser;
var dom = parser.parseFromString(
'<!doctype html><body>' + encodedStr,
'text/html');
var decodedString = dom.body.textContent;
console.log(decodedString);
You can use Lodash unescape / escape function https://lodash.com/docs/4.17.5#unescape
import unescape from 'lodash/unescape';
const str = unescape('fred, barney, & pebbles');
str will become 'fred, barney, & pebbles'
Not a direct response to your question, but wouldn't it be better for your RPC to return some structure (be it XML or JSON or whatever) with those image data (urls in your example) inside that structure?
Then you could just parse it in your javascript and build the <img>
using javascript itself.
The structure you recieve from RPC could look like:
{"img" : ["myimage.jpg", "myimage2.jpg"]}
I think it's better this way, as injecting a code that comes from external source into your page doesn't look very secure. Imaging someone hijacking your XML-RPC script and putting something you wouldn't want in there (even some javascript...)
To unescape HTML entities* in JavaScript you can use small library html-escaper: npm install html-escaper
import {unescape} from 'html-escaper';
unescape('escaped string');
Or unescape
function from Lodash or Underscore, if you are using it.
*) please note that these functions don't cover all HTML entities, but only the most common ones, i.e. &
, <
, >
, '
, "
. To unescape all HTML entities you can use he library.