जावास्क्रिप्ट में Unescape HTML इकाइयाँ?

Question

मेरे पास कुछ जावास्क्रिप्ट कोड है जो XML-RPC बैकएंड के साथ संचार करता है। XML-RPC फॉर्म के तार लौटाता है:

<img src='myimage.jpg'>

हालाँकि, जब मैं HTML में स्ट्रिंग्स सम्मिलित करने के लिए जावास्क्रिप्ट का उपयोग करता हूं, तो वे शाब्दिक रूप से प्रस्तुत करते हैं। मुझे एक छवि नहीं दिख रही है, मैं सचमुच स्ट्रिंग देख रहा हूँ:

<img src='myimage.jpg'>

मेरा अनुमान है कि XML- RPC चैनल पर HTML बच रहा है।

मैं जावास्क्रिप्ट में स्ट्रिंग को कैसे हटा सकता हूं? मैंने इस पृष्ठ पर तकनीकों की कोशिश की, असफल: http://paulschreiber.com/blog/2008/09/20/javascript-how-to-unescape-html-entities/

समस्या का निदान करने के अन्य तरीके क्या हैं?

Comments

इसे आज़माएँ: stackoverflow.com/questions/4480757/…

— XP1

JQuery का उपयोग करके HTML संस्थाओं को कैसे डीकोड करना

— लुकासकरो

Answer 1

संपादित करें: आपको DOMParser API का उपयोग करना चाहिए क्योंकि Wladimir सुझाव देता है , मैंने अपने पिछले उत्तर को संपादित किया क्योंकि फ़ंक्शन ने सुरक्षा भेद्यता की शुरुआत की।

निम्नलिखित स्निपेट एक छोटे संशोधन के साथ पुराना उत्तर कोड है: XSS भेद्यता को कम textareaकरने के बजाय इसका उपयोग करना div, लेकिन IE9 और फ़ायरफ़ॉक्स में यह अभी भी समस्याग्रस्त है।

function htmlDecode(input){
  var e = document.createElement('textarea');
  e.innerHTML = input;
  // handle case of empty input
  return e.childNodes.length === 0 ? "" : e.childNodes[0].nodeValue;
}

htmlDecode("<img src='myimage.jpg'>"); 
// returns "<img src='myimage.jpg'>"

मूल रूप से मैं एक डोम तत्व को प्रोग्रामेटिक रूप से बनाता हूं, एन्कोडेड एचटीएमएल को इसके आंतरिक HTML में असाइन करता हूं और इनरएचटीएमएल इनसर्शन पर बनाए गए टेक्स्ट नोड से नोडवैल्यू को पुनः प्राप्त करता हूं। चूंकि यह सिर्फ एक तत्व बनाता है, लेकिन इसे कभी नहीं जोड़ता है, कोई भी साइट HTML संशोधित नहीं है।

यह क्रॉस-ब्राउज़र (पुराने ब्राउज़र सहित) काम करेगा और सभी HTML कैरेक्टर एंटिटीज़ को स्वीकार करेगा ।

EDIT: इस कोड का पुराना संस्करण IE पर रिक्त सूचनाओं के साथ काम नहीं करता था, जैसा कि jsFiddle (IE में देखें) पर यहां दिखाया गया है । उपरोक्त संस्करण सभी इनपुट के साथ काम करता है।

अद्यतन: ऐसा प्रतीत होता है कि यह बड़े स्ट्रिंग के साथ काम नहीं करता है, और यह सुरक्षा भेद्यता का भी परिचय देता है , टिप्पणियों को देखें।

Comments

समझ गया, आप बदल गए ', इसलिए मैं अपनी टिप्पणी वापस हटाऊं, thx, इसके कार्य महान, +1

— You

@ S.Mark: 'HTML 4 संस्थाओं से संबंधित नहीं है, इसीलिए! w3.org/TR/html4/sgml/entities.html fishbowl.pastiche.org/2003/07/01/the_curse_of_apos

— CMS

इस दृष्टिकोण की खराब सुरक्षा के बारे में @ kender का नोट भी देखें।

— जोसेफ तुरियन

खराब परीक्षण के बारे में @kender को मेरा नोट देखें;)

— Roatin Marth

यह फ़ंक्शन एक सुरक्षा खतरा है, जावास्क्रिप्ट कोड DOM के लिए तत्व नहीं जोड़े जाने के बावजूद भी चलेगा। तो यह केवल कुछ उपयोग करने के लिए है अगर इनपुट स्ट्रिंग पर भरोसा किया जाता है। मैंने इस मुद्दे को समझाने और एक सुरक्षित समाधान प्रदान करने के लिए अपना जवाब जोड़ा । एक साइड-इफ़ेक्ट के रूप में, यदि कई टेक्स्ट नोड्स मौजूद हैं, तो परिणाम काटा नहीं जा रहा है।

— व्लादिमीर पालंट

Answer 2

यहां दिए गए अधिकांश उत्तरों में एक बड़ा नुकसान है: यदि आप जिस स्ट्रिंग को बदलने की कोशिश कर रहे हैं, उस पर भरोसा नहीं किया जाता है, तो आप क्रॉस-साइट स्क्रिप्टिंग (XSS) भेद्यता के साथ समाप्त हो जाएंगे । स्वीकृत उत्तर में फ़ंक्शन के लिए , निम्नलिखित पर विचार करें:

htmlDecode("<img src='dummy' onerror='alert(/xss/)'>");

यहाँ स्ट्रिंग में एक unescaped HTML टैग है, इसलिए कुछ भी डिकोड करने के बजाय htmlDecodeफ़ंक्शन वास्तव में स्ट्रिंग के अंदर निर्दिष्ट जावास्क्रिप्ट कोड चलाएगा।

DOMParser का उपयोग करके इससे बचा जा सकता है जो सभी आधुनिक ब्राउज़रों में समर्थित है :

function htmlDecode(input) {
  var doc = new DOMParser().parseFromString(input, "text/html");
  return doc.documentElement.textContent;
}

console.log(  htmlDecode("<img src='myimage.jpg'>")  )    
// "<img src='myimage.jpg'>"

console.log(  htmlDecode("<img src='dummy' onerror='alert(/xss/)'>")  )  
// ""

यह फ़ंक्शन किसी भी जावास्क्रिप्ट कोड को साइड-इफ़ेक्ट के रूप में नहीं चलाने की गारंटी है। किसी भी HTML टैग को नजरअंदाज कर दिया जाएगा, केवल पाठ सामग्री वापस कर दी जाएगी।

संगतता नोट : HTML DOMParserको कम से कम क्रोम 30, फ़ायरफ़ॉक्स 12, ओपेरा 17, इंटरनेट एक्सप्लोरर 10, सफारी 7.1 या माइक्रोसॉफ्ट एज की आवश्यकता होती है। तो समर्थन के बिना सभी ब्राउज़र अपने ईओएल के पिछले तरीके से हैं और 2017 तक केवल वही हैं जो अभी भी कभी-कभी जंगली में देखे जा सकते हैं वे पुराने इंटरनेट एक्सप्लोरर और सफारी संस्करण हैं (आमतौर पर ये अभी भी परेशान करने के लिए पर्याप्त नहीं हैं)।

Comments

मुझे लगता है कि यह उत्तर सबसे अच्छा है क्योंकि इसने XSS भेद्यता का उल्लेख किया है।

— Константин Ван

ध्यान दें कि (आपके संदर्भ के अनुसार) फ़ायरफ़ॉक्स 12.0 से पहले DOMParserसमर्थन नहीं करता था "text/html", और अभी भी ब्राउज़रों के कुछ नवीनतम संस्करण हैं जो समर्थन भी नहीं करते हैंDOMParser.prototype.parseFromString() । आपके संदर्भ के अनुसार, DOMParserअभी भी एक प्रयोगात्मक तकनीक है, और स्टैंड-इन innerHTMLसंपत्ति का उपयोग करते हैं, जैसा कि आपने भी मेरे दृष्टिकोण के जवाब में बताया था , इसमें XSS भेद्यता है (जिसे ब्राउज़र विक्रेताओं द्वारा तय किया जाना चाहिए)।

— 8

@PointedEars: 2016 में फ़ायरफ़ॉक्स 12 के बारे में कौन परवाह करता है? समस्याग्रस्त हैं 9.0 तक का इंटरनेट एक्सप्लोरर और 7.0 तक सफारी। अगर कोई उनका समर्थन नहीं कर सकता है (जो जल्द ही सभी को उम्मीद होगी) तो DOMParser सबसे अच्छा विकल्प है। यदि नहीं - हाँ, प्रोसेसिंग इकाइयाँ केवल एक विकल्प होगी।

— व्लादिमीर पलंत

@PointedEars: <script>निष्पादित नहीं होने वाले टैग एक सुरक्षा तंत्र नहीं है, यह नियम केवल मुश्किल समय के मुद्दों से बचता है यदि सेटिंग innerHTMLएक साइड-इफ़ेक्ट के रूप में सिंक्रोनस स्क्रिप्ट चला सकती है। HTML कोड Sanitizing एक मुश्किल मामला है और innerHTMLयह भी कोशिश नहीं करता है - पहले से ही क्योंकि वेब पेज वास्तव में इनलाइन इवेंट हैंडलर सेट करने का इरादा कर सकता है। यह केवल असुरक्षित डेटा, पूर्ण विराम के लिए अभिप्रेत तंत्र नहीं है।

— व्लादिमीर पालंट

@ Илья planеленько: क्या आप एक तंग लूप में इस कोड का उपयोग करने की योजना बनाते हैं या प्रदर्शन क्यों मायने रखता है? आपका जवाब फिर से XSS के लिए असुरक्षित है, क्या यह वास्तव में इसके लायक था?

— व्लादिमीर पलंत

Answer 3

यदि आप jQuery का उपयोग कर रहे हैं:

function htmlDecode(value){ 
  return $('<div/>').html(value).text(); 
}

अन्यथा, कड़ाई से सॉफ़्टवेयर के एनकोडर ऑब्जेक्ट का उपयोग करें , जिसमें एक उत्कृष्ट htmlDecode()कार्य है।

Comments

इस उपयोगकर्ता द्वारा उत्पन्न की गई सामग्री के अलावा अन्य उपयोगकर्ता-जनित सामग्री के लिए इसका उपयोग न करें (दोहराएं नहीं) । यदि मूल्य में एक <script> टैग है, तो स्क्रिप्ट की सामग्री निष्पादित की जाएगी!

— मालवियो 19

मुझे साइट पर कहीं भी इसके लिए लाइसेंस नहीं मिल सकता है। क्या आप जानते हैं कि लाइसेंस क्या है?

— टीआरजी

स्रोत हेडर में लाइसेंस है, यह जीपीएल है।

— बजे क्रिस फुलस्टो

हाँ, कि समारोह XSS के लिए रास्ता खोलने: कोशिश htmlDecode ( "<script> चेतावनी (12) </ script> 123 & gt;")

— Dinis क्रूज़

$ ('<div />') का क्या अर्थ है ?

— इको यांग

Answer 4

चाल विशेष HTML वर्णों को डीकोड करने के लिए ब्राउज़र की शक्ति का उपयोग करने के लिए है, लेकिन ब्राउज़र को परिणामों को निष्पादित करने की अनुमति नहीं देता है जैसे कि यह वास्तविक HTML था ... यह फ़ंक्शन एन्कोडेड HTML वर्णों को पहचानने और बदलने के लिए एक regex का उपयोग करता है, एक वर्ण समय पर।

function unescapeHtml(html) {
    var el = document.createElement('div');
    return html.replace(/\&[#0-9a-z]+;/gi, function (enc) {
        el.innerHTML = enc;
        return el.innerText
    });
}

Comments

रेगेक्स को थोड़ा सा तंग किया जा सकता है /\&#?[0-9a-z]+;/giक्योंकि # को केवल 2 के चरित्र के रूप में दिखाई देना चाहिए यदि बिल्कुल भी।

— TheAtomicOption

यह सबसे अच्छा जवाब है। XSS भेद्यता से बचा जाता है, और HTML टैग्स को नहीं छीनता है।

— इमैनुएल

Answer 5

सीएमएस का जवाब ठीक काम करता है, जब तक कि जिस HTML को आप अनसेक करना चाहते हैं, वह 65536 वर्णों से अधिक लंबा, लंबा होता है। क्योंकि तब क्रोम में आंतरिक HTML कई चाइल्ड नोड्स में विभाजित हो जाता है, हर एक को अधिकतम 65536 लंबा, और आपको उन्हें समेटना होगा। यह फ़ंक्शन बहुत लंबे तार के लिए भी काम करता है:

function unencodeHtmlContent(escapedHtml) {
  var elem = document.createElement('div');
  elem.innerHTML = escapedHtml;
  var result = '';
  // Chrome splits innerHTML into many child nodes, each one at most 65536.
  // Whereas FF creates just one single huge child node.
  for (var i = 0; i < elem.childNodes.length; ++i) {
    result = result + elem.childNodes[i].nodeValue;
  }
  return result;
}

innerHTMLअधिक जानकारी के लिए अधिकतम लंबाई के बारे में यह उत्तर देखें : https://stackoverflow.com/a/27545633/694469

Answer 6

आपके प्रश्न का सीधा जवाब नहीं है, लेकिन क्या आपके RPC के लिए उस संरचना के अंदर उन छवि डेटा (आपके उदाहरण में यूआरएल) के साथ कुछ संरचना (यह XML या JSON या जो भी हो) वापस करना बेहतर नहीं होगा?

तब आप इसे केवल अपनी जावास्क्रिप्ट में पार्स कर सकते थे और <img>स्वयं जावास्क्रिप्ट का निर्माण कर सकते थे।

RPC से आप जो संरचना प्राप्त करते हैं, वह इस तरह दिख सकती है:

{"img" : ["myimage.jpg", "myimage2.jpg"]}

मुझे लगता है कि यह इस तरह से बेहतर है, क्योंकि आपके पेज में बाहरी स्रोत से आने वाले कोड को इंजेक्ट करना बहुत सुरक्षित नहीं है। किसी को आपके XML-RPC स्क्रिप्ट को अपहृत करना और ऐसा कुछ डालना जो आप नहीं चाहते हैं (यहाँ तक कि कुछ जावास्क्रिप्ट भी ...)

Comments

क्या @CMS के ऊपर इस सुरक्षा दोष है?

— जोसेफ तुरियन

मैंने अभी निम्न तर्क की जाँच की, जो कि HTMLDecode fuction को पारित किया गया था: htmlDecode ("& lt; img src = 'myimage.jpg' & gt; & lt; स्क्रिप्ट & gt; document.write ('xxxxx'); & lt; / script & gt;") और यह बनाता है। <script> </ script> तत्व जो खराब हो सकता है, imho। और मुझे लगता है कि सम्मिलित किए जाने वाले पाठ के बजाय एक संरचना को वापस करना बेहतर है, आप उदाहरण के लिए त्रुटियों को अच्छी तरह से संभाल सकते हैं।

— kender

मैंने सिर्फ कोशिश की htmlDecode("<img src='myimage.jpg'><script>alert('xxxxx');</script>")और कुछ नहीं हुआ। मुझे उम्मीद के मुताबिक डिकोडेड html स्ट्रिंग वापस मिल गई।

— रोतीन मारथ

Answer 7

क्रिस का जवाब अच्छा और सुरुचिपूर्ण है लेकिन अगर मूल्य अपरिभाषित है तो यह विफल रहता है । बस साधारण सुधार इसे ठोस बनाता है:

function htmlDecode(value) {
   return (typeof value === 'undefined') ? '' : $('<div/>').html(value).text();
}

Comments

यदि सुधार हो, तो करें:return (typeof value !== 'string') ? '' : $('<div/>').html(value).text();

— सिनकैप

Answer 8

आपका स्वागत है ... बस एक संदेशवाहक ... पूरा श्रेय ourcodeworld.com, नीचे लिंक पर जाता है।

window.htmlentities = {
        /**
         * Converts a string to its html characters completely.
         *
         * @param {String} str String with unescaped HTML characters
         **/
        encode : function(str) {
            var buf = [];

            for (var i=str.length-1;i>=0;i--) {
                buf.unshift(['&#', str[i].charCodeAt(), ';'].join(''));
            }

            return buf.join('');
        },
        /**
         * Converts an html characterSet into its original character.
         *
         * @param {String} str htmlSet entities
         **/
        decode : function(str) {
            return str.replace(/&#(\d+);/g, function(match, dec) {
                return String.fromCharCode(dec);
            });
        }
    };

पूर्ण क्रेडिट: https://ourcodeworld.com/articles/read/188/encode-and-decode-html-entities-using-pure-javascript

Answer 9

यह अब तक का सबसे व्यापक समाधान है:

const STANDARD_HTML_ENTITIES = {
    nbsp: String.fromCharCode(160),
    amp: "&",
    quot: '"',
    lt: "<",
    gt: ">"
};

const replaceHtmlEntities = plainTextString => {
    return plainTextString
        .replace(/&#(\d+);/g, (match, dec) => String.fromCharCode(dec))
        .replace(
            /&(nbsp|amp|quot|lt|gt);/g,
            (a, b) => STANDARD_HTML_ENTITIES[b]
        );
};

Comments

"सबसे व्यापक"? क्या आपने वास्तव में व्यापक परीक्षण सूट के खिलाफ इसे चलाने की कोशिश की है ?

— डैन डस्केल्सस्कु जूल

Answer 10

मैं पागल हो गया था जिससे गुजरने और इस समारोह को बनाने के लिए, जो सुंदर होना चाहिए, अगर पूरी तरह से नहीं, तो:

function removeEncoding(string) {
    return string.replace(/&Agrave;/g, "À").replace(/&Aacute;/g, "Á").replace(/&Acirc;/g, "Â").replace(/&Atilde;/g, "Ã").replace(/&Auml;/g, "Ä").replace(/&Aring;/g, "Å").replace(/&agrave;/g, "à").replace(/&acirc;/g, "â").replace(/&atilde;/g, "ã").replace(/&auml;/g, "ä").replace(/&aring;/g, "å").replace(/&AElig;/g, "Æ").replace(/&aelig;/g, "æ").replace(/&szlig;/g, "ß").replace(/&Ccedil;/g, "Ç").replace(/&ccedil;/g, "ç").replace(/&Egrave;/g, "È").replace(/&Eacute;/g, "É").replace(/&Ecirc;/g, "Ê").replace(/&Euml;/g, "Ë").replace(/&egrave;/g, "è").replace(/&eacute;/g, "é").replace(/&ecirc;/g, "ê").replace(/&euml;/g, "ë").replace(/&#131;/g, "ƒ").replace(/&Igrave;/g, "Ì").replace(/&Iacute;/g, "Í").replace(/&Icirc;/g, "Î").replace(/&Iuml;/g, "Ï").replace(/&igrave;/g, "ì").replace(/&iacute;/g, "í").replace(/&icirc;/g, "î").replace(/&iuml;/g, "ï").replace(/&Ntilde;/g, "Ñ").replace(/&ntilde;/g, "ñ").replace(/&Ograve;/g, "Ò").replace(/&Oacute;/g, "Ó").replace(/&Ocirc;/g, "Ô").replace(/&Otilde;/g, "Õ").replace(/&Ouml;/g, "Ö").replace(/&ograve;/g, "ò").replace(/&oacute;/g, "ó").replace(/&ocirc;/g, "ô").replace(/&otilde;/g, "õ").replace(/&ouml;/g, "ö").replace(/&Oslash;/g, "Ø").replace(/&oslash;/g, "ø").replace(/&#140;/g, "Œ").replace(/&#156;/g, "œ").replace(/&#138;/g, "Š").replace(/&#154;/g, "š").replace(/&Ugrave;/g, "Ù").replace(/&Uacute;/g, "Ú").replace(/&Ucirc;/g, "Û").replace(/&Uuml;/g, "Ü").replace(/&ugrave;/g, "ù").replace(/&uacute;/g, "ú").replace(/&ucirc;/g, "û").replace(/&uuml;/g, "ü").replace(/&#181;/g, "µ").replace(/&#215;/g, "×").replace(/&Yacute;/g, "Ý").replace(/&#159;/g, "Ÿ").replace(/&yacute;/g, "ý").replace(/&yuml;/g, "ÿ").replace(/&#176;/g, "°").replace(/&#134;/g, "†").replace(/&#135;/g, "‡").replace(/&lt;/g, "<").replace(/&gt;/g, ">").replace(/&#177;/g, "±").replace(/&#171;/g, "«").replace(/&#187;/g, "»").replace(/&#191;/g, "¿").replace(/&#161;/g, "¡").replace(/&#183;/g, "·").replace(/&#149;/g, "•").replace(/&#153;/g, "™").replace(/&copy;/g, "©").replace(/&reg;/g, "®").replace(/&#167;/g, "§").replace(/&#182;/g, "¶").replace(/&Alpha;/g, "Α").replace(/&Beta;/g, "Β").replace(/&Gamma;/g, "Γ").replace(/&Delta;/g, "Δ").replace(/&Epsilon;/g, "Ε").replace(/&Zeta;/g, "Ζ").replace(/&Eta;/g, "Η").replace(/&Theta;/g, "Θ").replace(/&Iota;/g, "Ι").replace(/&Kappa;/g, "Κ").replace(/&Lambda;/g, "Λ").replace(/&Mu;/g, "Μ").replace(/&Nu;/g, "Ν").replace(/&Xi;/g, "Ξ").replace(/&Omicron;/g, "Ο").replace(/&Pi;/g, "Π").replace(/&Rho;/g, "Ρ").replace(/&Sigma;/g, "Σ").replace(/&Tau;/g, "Τ").replace(/&Upsilon;/g, "Υ").replace(/&Phi;/g, "Φ").replace(/&Chi;/g, "Χ").replace(/&Psi;/g, "Ψ").replace(/&Omega;/g, "Ω").replace(/&alpha;/g, "α").replace(/&beta;/g, "β").replace(/&gamma;/g, "γ").replace(/&delta;/g, "δ").replace(/&epsilon;/g, "ε").replace(/&zeta;/g, "ζ").replace(/&eta;/g, "η").replace(/&theta;/g, "θ").replace(/&iota;/g, "ι").replace(/&kappa;/g, "κ").replace(/&lambda;/g, "λ").replace(/&mu;/g, "μ").replace(/&nu;/g, "ν").replace(/&xi;/g, "ξ").replace(/&omicron;/g, "ο").replace(/&piρ;/g, "ρ").replace(/&rho;/g, "ς").replace(/&sigmaf;/g, "ς").replace(/&sigma;/g, "σ").replace(/&tau;/g, "τ").replace(/&phi;/g, "φ").replace(/&chi;/g, "χ").replace(/&psi;/g, "ψ").replace(/&omega;/g, "ω").replace(/&bull;/g, "•").replace(/&hellip;/g, "…").replace(/&prime;/g, "′").replace(/&Prime;/g, "″").replace(/&oline;/g, "‾").replace(/&frasl;/g, "⁄").replace(/&weierp;/g, "℘").replace(/&image;/g, "ℑ").replace(/&real;/g, "ℜ").replace(/&trade;/g, "™").replace(/&alefsym;/g, "ℵ").replace(/&larr;/g, "←").replace(/&uarr;/g, "↑").replace(/&rarr;/g, "→").replace(/&darr;/g, "↓").replace(/&barr;/g, "↔").replace(/&crarr;/g, "↵").replace(/&lArr;/g, "⇐").replace(/&uArr;/g, "⇑").replace(/&rArr;/g, "⇒").replace(/&dArr;/g, "⇓").replace(/&hArr;/g, "⇔").replace(/&forall;/g, "∀").replace(/&part;/g, "∂").replace(/&exist;/g, "∃").replace(/&empty;/g, "∅").replace(/&nabla;/g, "∇").replace(/&isin;/g, "∈").replace(/&notin;/g, "∉").replace(/&ni;/g, "∋").replace(/&prod;/g, "∏").replace(/&sum;/g, "∑").replace(/&minus;/g, "−").replace(/&lowast;/g, "∗").replace(/&radic;/g, "√").replace(/&prop;/g, "∝").replace(/&infin;/g, "∞").replace(/&OEig;/g, "Œ").replace(/&oelig;/g, "œ").replace(/&Yuml;/g, "Ÿ").replace(/&spades;/g, "♠").replace(/&clubs;/g, "♣").replace(/&hearts;/g, "♥").replace(/&diams;/g, "♦").replace(/&thetasym;/g, "ϑ").replace(/&upsih;/g, "ϒ").replace(/&piv;/g, "ϖ").replace(/&Scaron;/g, "Š").replace(/&scaron;/g, "š").replace(/&ang;/g, "∠").replace(/&and;/g, "∧").replace(/&or;/g, "∨").replace(/&cap;/g, "∩").replace(/&cup;/g, "∪").replace(/&int;/g, "∫").replace(/&there4;/g, "∴").replace(/&sim;/g, "∼").replace(/&cong;/g, "≅").replace(/&asymp;/g, "≈").replace(/&ne;/g, "≠").replace(/&equiv;/g, "≡").replace(/&le;/g, "≤").replace(/&ge;/g, "≥").replace(/&sub;/g, "⊂").replace(/&sup;/g, "⊃").replace(/&nsub;/g, "⊄").replace(/&sube;/g, "⊆").replace(/&supe;/g, "⊇").replace(/&oplus;/g, "⊕").replace(/&otimes;/g, "⊗").replace(/&perp;/g, "⊥").replace(/&sdot;/g, "⋅").replace(/&lcell;/g, "⌈").replace(/&rcell;/g, "⌉").replace(/&lfloor;/g, "⌊").replace(/&rfloor;/g, "⌋").replace(/&lang;/g, "⟨").replace(/&rang;/g, "⟩").replace(/&loz;/g, "◊").replace(/&#039;/g, "'").replace(/&amp;/g, "&").replace(/&quot;/g, "\"");
}

ऐसे इस्तेमाल किया:

let decodedText = removeEncoding("Ich heiße David");
console.log(decodedText);

प्रिंटों: Ich Heiße David

PS इसे बनाने में एक घंटा और डेढ़ घंटा लगा।

Answer 11

जावास्क्रिप्ट में HTML संस्थाओं को हटाने के लिए * आप छोटे पुस्तकालय HTML-एस्कैपर्स का उपयोग कर सकते हैं :npm install html-escaper

import {unescape} from 'html-escaper';

unescape('escaped string');

या लोदश या अंडरस्कोरunescape से कार्य करें , यदि आप इसका उपयोग कर रहे हैं।

---

*) कृपया ध्यान दें कि इन कार्यों सभी HTML संस्थाओं को कवर नहीं है, लेकिन केवल सबसे आम लोगों, यानी &, <, >, ', "। सभी HTML संस्थाओं unescape करने के लिए आप उपयोग कर सकते हैं वह पुस्तकालय।

Answer 12

मैं अपने प्रोजेक्ट में इसका उपयोग करता हूं: अन्य उत्तरों से प्रेरित लेकिन एक अतिरिक्त सुरक्षित पैरामीटर के साथ, जब आप सजाए गए पात्रों से निपटते हैं तो यह उपयोगी हो सकता है

var decodeEntities=(function(){

    var el=document.createElement('div');
    return function(str, safeEscape){

        if(str && typeof str === 'string'){

            str=str.replace(/\</g, '&lt;');

            el.innerHTML=str;
            if(el.innerText){

                str=el.innerText;
                el.innerText='';
            }
            else if(el.textContent){

                str=el.textContent;
                el.textContent='';
            }

            if(safeEscape)
                str=str.replace(/\</g, '&lt;');
        }
        return str;
    }
})();

और यह प्रयोग करने योग्य है:

var label='safe <b> character &eacute;ntity</b>';
var safehtml='<div title="'+decodeEntities(label)+'">'+decodeEntities(label, true)+'</div>';

Answer 13

यहां अन्य सभी उत्तरों में समस्याएं हैं।

Document.createElement ('div') मेथड (jQuery का इस्तेमाल करने वालों सहित) किसी भी जावास्क्रिप्ट को निष्पादित करते हैं जो उसमें (एक सुरक्षा मुद्दा) और DOMParser.parseFromString () विधि ट्रिम्स व्हाट्सएप से गुजरता है। यहाँ एक शुद्ध जावास्क्रिप्ट समाधान है जिसकी न तो समस्या है:

function htmlDecode(html) {
    var textarea = document.createElement("textarea");
    html= html.replace(/\r/g, String.fromCharCode(0xe000)); // Replace "\r" with reserved unicode character.
    textarea.innerHTML = html;
    var result = textarea.value;
    return result.replace(new RegExp(String.fromCharCode(0xe000), 'g'), '\r');
}

TextArea का उपयोग विशेष रूप से निष्पादक js कोड से बचने के लिए किया जाता है। यह इनसे गुजरता है:

htmlDecode('&lt;&amp;&nbsp;&gt;'); // returns "<& >" with non-breaking space.
htmlDecode('  '); // returns "  "
htmlDecode('<img src="dummy" onerror="alert(\'xss\')">'); // Does not execute alert()
htmlDecode('\r\n') // returns "\r\n", doesn't lose the \r like other solutions.

Comments

नहीं, भिन्न टैग का उपयोग करने से समस्या हल नहीं होती है । यह अभी भी एक XSS भेद्यता है, प्रयास करें htmlDecode("</textarea><img src=x onerror=alert(1)>")। सर्जियो बेलेवस्कीज के जवाब पर मैंने पहले ही इस मुद्दे को इंगित करने के बाद आप इसे पोस्ट कर दिया।

— व्लादिमीर पालेंट

मैं आपके द्वारा बताए गए मुद्दे को पुन: पेश करने में असमर्थ हूं। इस JsFiddle में मेरा कोड आपके पास है, और दौड़ते समय कोई अलर्ट प्रदर्शित नहीं करता है। jsfiddle.net/edsjt15g/1 क्या आप एक बार देख सकते हैं? आप कौन सा ब्राउज़र उपयोग कर रहे हैं?

— एरिकपी

मैं फ़ायरफ़ॉक्स का उपयोग कर रहा हूँ। क्रोम वास्तव में इस परिदृश्य को अलग तरीके से संभालता है, इसलिए कोड निष्पादित नहीं करता है - ऐसा कुछ नहीं जिसे आपको हालांकि भरोसा करना चाहिए।

— व्लादिमीर पलंत

Answer 14

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);

Comments

@Wladimir Palant (AdBlock Plus के लेखक) ने 4 साल पहले ही DOMParser जवाब दे दिया था। क्या आपने अपने पोस्ट करने से पहले पिछले उत्तरों को पढ़ा है?

— डैन डस्केल्सस्कु जूल

Answer 15

एक ऐसा संस्करण है जो 80% उत्पादक के रूप में बहुत शीर्ष पर उत्तर है।

बेंचमार्क देखें: https://jsperf.com/decode-html1234545678/1

console.log(decodeEntities('test: &gt'));

function decodeEntities(str) {
  // this prevents any overhead from creating the object each time
  const el = decodeEntities.element || document.createElement('textarea')

  // strip script/html tags
  el.innerHTML = str
    .replace(/<script[^>]*>([\S\s]*?)<\/script>/gmi, '')
    .replace(/<\/?\w(?:[^"'>]|"[^"]*"|'[^']*')*>/gmi, '');

  return el.value;
}

यदि आपको टैग छोड़ने की आवश्यकता है, तो दो .replace(...)कॉल हटा दें (यदि आपको स्क्रिप्ट की आवश्यकता नहीं है तो आप पहले वाले को छोड़ सकते हैं)।

Comments

बधाई हो, आप एक प्रदर्शन जीत के लिए संगीन तर्क के साथ भेद्यता को अस्पष्ट करने में कामयाब रहे, जो अभ्यास में मायने नहीं रखेगा। decodeEntities("</textarea '><img src=x onerror=alert(1) \">")फ़ायरफ़ॉक्स में कॉल करने का प्रयास करें । कृपया नियमित भावों के साथ HTML कोड को पवित्र करने का प्रयास बंद करें।

— व्लादिमीर पलंत