JavaScript에서 HTML 엔티티의 이스케이프를 해제하시겠습니까?
XML-RPC 백엔드와 통신하는 JavaScript 코드가 있습니다.XML-RPC는 다음 형식의 문자열을 반환합니다.
<img src='myimage.jpg'>
그러나 JavaScript를 사용하여 HTML에 문자열을 삽입하면 문자 그대로 렌더링됩니다.이미지가 보이지 않고 문자 그대로 문자열이 보입니다.
<img src='myimage.jpg'>
HTML이 XML-RPC 채널을 통해 이스케이프되고 있는 것 같습니다.
JavaScript에서 문자열을 이스케이프 해제하려면 어떻게 해야 합니까?이 페이지에서 기술을 시도했지만 실패했습니다.http://paulschreiber.com/blog/2008/09/20/javascript-how-to-unescape-html-entities/
이 문제를 진단하는 다른 방법은 무엇입니까?
여기서 설명하는 대부분의 답변에는 큰 단점이 있습니다.변환하려는 문자열을 신뢰할 수 없는 경우 사이트 간 스크립팅(XSS) 취약성이 발생합니다.승인된 답변의 함수에 대해서는 다음 사항을 고려하십시오.
htmlDecode("<img src='dummy' onerror='alert(/xss/)'>");
가 포함되어 에, 「HTML」을 하는 에, 「HTML」을 디코딩 합니다.htmlDecodeJavaScript를 사용합니다.
이는 최신 브라우저 모두에서 지원되는 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/)'>") )
// ""이 함수는 부작용으로 JavaScript 코드를 실행하지 않음을 보증합니다.HTML 태그는 무시되고 텍스트 내용만 반환됩니다.
호환성 주의: HTML 구문 분석DOMParserChrome 30, Firefox 12, Opera 17, Internet Explorer 10, Safari 7.1, Microsoft Edge.따라서 지원되지 않는 모든 브라우저는 EOL이 훨씬 지났으며 2017년 현재 야생에서 여전히 볼 수 있는 유일한 브라우저는 오래된 Internet Explorer와 Safari 버전뿐입니다(보통 이러한 브라우저는 아직 충분히 많은 수를 가지고 있지 않습니다).
된 모든 , HTML만 디코딩해야 합니까?& 자체 그 자체?
「 」만 경우는,&을 사용하다
var decoded = encoded.replace(/&/g, '&');
모든 HTML 엔티티를 디코딩해야 하는 경우 jQuery 없이 수행할 수 있습니다.
var elem = document.createElement('textarea');
elem.innerHTML = encoded;
var decoded = elem.value;
하여 "Mark"를 사용할 것을 합니다.textareadivXSS를 사용하다이러한 취약성은 jQuery를 사용하든 일반 JavaScript를 사용하든 상관 없이 존재합니다.
편집: Wladimir가 제안하는 바와 같이 DOMParser API를 사용해야 합니다. 게시된 함수에 보안 취약성이 도입되었기 때문에 이전 답변을 편집했습니다.
수정하면 .textareadiv는, XSS 의 만, 와 Firefox.
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'>"
기본적으로 프로그래밍 방식으로 DOM 요소를 만들고 인코딩된 HTML을 내부에 할당합니다.HTML을 사용하여 내부 노드에 작성된 텍스트 노드에서 nodeValue를 가져옵니다.HTML 삽입요소를 만들 뿐이지 추가하지 않기 때문에 사이트 HTML은 변경되지 않습니다.
크로스 브라우저(구 브라우저 포함)를 사용하여 모든 HTML 문자 엔티티를 허용합니다.
편집: 이 코드의 이전 버전은 입력이 공백인 IE에서는 작동하지 않았습니다.여기서 jsFiddle(IE에서의 표시)에서 확인할 수 있습니다.위의 버전은 모든 입력에서 작동합니다.
UPDATE: 이 기능은 큰 문자열에서는 작동하지 않으며 보안 취약성도 발생합니다. 설명을 참조하십시오.
기타)을 해석하기 위한 은 JavaScript (HTML)의 HTML 지원입니다.DOMParserAPI(MDN의 여기를 참조).이렇게 하면 브라우저의 기본 HTML 파서를 사용하여 문자열을 HTML 문서로 변환할 수 있습니다.2014년 말부터 모든 주요 브라우저의 새로운 버전에서 지원되고 있습니다.
본문에 할 수 ..body.textContent.
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);해석된 문서에 대해 JavaScript가 활성화되지 않았음을 초안 사양에서 알 수 있으므로 보안상의 우려 없이 이 텍스트 변환을 수행할 수 있습니다.
parseFromString(str, type)메서드는 유형에 따라 다음 단계를 수행해야 합니다.
"text/html"str을 해석합니다.
HTML parser반환을Document.스크립트 플래그는 "disabled"로 설정해야 합니다.
메모
script할 수 없는 마크가 있습니다.또, 그 은 「해당 불능」입니다.noscript크크으로로해해해해
이 질문의 범위는 아니지만, 구문 분석된 DOM 노드 자체를 (텍스트 내용뿐만 아니라) 라이브 문서 DOM으로 이동하는 경우 스크립트가 다시 활성화될 수 있으며 보안 문제가 발생할 수 있습니다.아직 조사하지 않았으니 주의하세요.
Matthias Bynens는 이를 위한 라이브러리를 보유하고 있습니다.
예:
console.log(
he.decode("Jörg & Jürgen rocked to & fro ")
);
// Logs "Jörg & Jürgen rocked to & fro"
요소의 HTML 콘텐츠를 설정하고 텍스트 콘텐츠를 다시 읽는 것과 관련된 해킹보다 그것을 선호할 것을 제안합니다.이러한 접근방식은 동작할 수 있지만 신뢰할 수 없는 사용자 입력에 사용할 경우 매우 위험하며 XSS 기회를 제공합니다.
수 없다면, 당신은 "이것"을 할 수 .textarea거의 중복되는 질문에 대한 이 답변에서 설명한 해킹은 지금까지 제안된 다양한 유사한 접근 방식과 달리 보안 취약점이 없습니다.
function decodeEntities(encodedString) {
var textArea = document.createElement('textarea');
textArea.innerHTML = encodedString;
return textArea.value;
}
console.log(decodeEntities('1 & 2')); // '1 & 2'
그러나 이와 유사한 접근 방식에 영향을 미치는 보안 문제에 유의하십시오. 링크된 답변에 나와 있습니다.이며, 에는 이접, of this of of of of of of of of of of of to this의 허용 내용은 다음과 같습니다.textarea(또는 특정 브라우저의 버그로 인해) 어느 날 갑자기 XSS 홀이 발생하는 코드가 발생할 수 있습니다.
jQuery를 사용하는 경우:
function htmlDecode(value){
return $('<div/>').html(value).text();
}
그렇지 않으면 Strictly Software의 Encoder Object를 사용합니다.이 오브젝트는htmlDecode()★★★★★★ 。
Lodash unescape / escape 기능을 이용하실 수 있습니다.https://lodash.com/docs/4.17.5#unescape
import unescape from 'lodash/unescape';
const str = unescape('fred, barney, & pebbles');
이 str가 되다'fred, barney, & pebbles'
var htmlEnDeCode = (function() {
var charToEntityRegex,
entityToCharRegex,
charToEntity,
entityToChar;
function resetCharacterEntities() {
charToEntity = {};
entityToChar = {};
// add the default set
addCharacterEntities({
'&' : '&',
'>' : '>',
'<' : '<',
'"' : '"',
''' : "'"
});
}
function addCharacterEntities(newEntities) {
var charKeys = [],
entityKeys = [],
key, echar;
for (key in newEntities) {
echar = newEntities[key];
entityToChar[key] = echar;
charToEntity[echar] = key;
charKeys.push(echar);
entityKeys.push(key);
}
charToEntityRegex = new RegExp('(' + charKeys.join('|') + ')', 'g');
entityToCharRegex = new RegExp('(' + entityKeys.join('|') + '|&#[0-9]{1,5};' + ')', 'g');
}
function htmlEncode(value){
var htmlEncodeReplaceFn = function(match, capture) {
return charToEntity[capture];
};
return (!value) ? value : String(value).replace(charToEntityRegex, htmlEncodeReplaceFn);
}
function htmlDecode(value) {
var htmlDecodeReplaceFn = function(match, capture) {
return (capture in entityToChar) ? entityToChar[capture] : String.fromCharCode(parseInt(capture.substr(2), 10));
};
return (!value) ? value : String(value).replace(entityToCharRegex, htmlDecodeReplaceFn);
}
resetCharacterEntities();
return {
htmlEncode: htmlEncode,
htmlDecode: htmlDecode
};
})();
이것은 ExtJS 소스 코드입니다.
요령은 브라우저의 파워를 사용하여 특수 HTML 문자를 디코딩하지만 브라우저가 실제 html인 것처럼 결과를 실행하도록 허용하지 않는 것입니다.이 함수는 정규식을 사용하여 인코딩된HTML 문자를 한 번에 하나씩 식별하고 바꿉니다.
function unescapeHtml(html) {
var el = document.createElement('div');
return html.replace(/\&[#0-9a-z]+;/gi, function (enc) {
el.innerHTML = enc;
return el.innerText
});
}
element.innerText과도있있 있있있다다
만약 당신이 그것을 찾고 있다면, 나처럼 - 한편으로 멋지고 안전한 JQuery 방법이 있다.
https://api.jquery.com/jquery.parsehtml/
콘솔에 다음과 같이 입력할 수 있습니다.
var x = "test &";
> undefined
$.parseHTML(x)[0].textContent
> "test &"
따라서 $.parseHTML(x)은 배열을 반환합니다.텍스트 내에 HTML 마크업이 있는 경우 array.length는 1보다 커집니다.
jQuery가 인코딩 및 디코딩합니다.단, div가 아닌 텍스트 영역 태그를 사용해야 합니다.
var str1 = 'One & two & three';
var str2 = "One & two & three";
$(document).ready(function() {
$("#encoded").text(htmlEncode(str1));
$("#decoded").text(htmlDecode(str2));
});
function htmlDecode(value) {
return $("<textarea/>").html(value).text();
}
function htmlEncode(value) {
return $('<textarea/>').text(value).html();
}<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<div id="encoded"></div>
<div id="decoded"></div>CMS 의 응답은, 이스케이프 해제하는 HTML 가 65536 문자보다 길지 않는 한, 정상적으로 동작합니다.Chrome에서는 내부 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 를 참조해 주세요.
JavaScript에서 HTML 엔티티*의 이스케이프를 해제하려면 작은 라이브러리 html-escaper를 사용합니다.npm install html-escaper
import {unescape} from 'html-escaper';
unescape('escaped string');
★★★unescapeLodash 또는 Underscore(사용하는 경우)에서 기능을 수행합니다.
는 모든 엔티티를 으로 하는 것이 가장 HTML 엔티티만 .&,<,>,',"모든 HTML 엔티티를 이스케이프 해제하려면 라이브러리를 사용할 수 있습니다.
" " " 를 .<span id="decodeIt" style="display:none;"></span>
다음으로 디코딩할 문자열을 내부로 할당합니다.여기에 HTML:
document.getElementById("decodeIt").innerHTML=stringtodecode
마침내.
stringtodecode=document.getElementById("decodeIt").innerText
전체적인 코드는 다음과 같습니다.
var stringtodecode="<B>Hello</B> world<br>";
document.getElementById("decodeIt").innerHTML=stringtodecode;
stringtodecode=document.getElementById("decodeIt").innerText
질문에 대한 직접적인 답변은 아니지만, RPC가 그 구조 안에 이미지 데이터(예시에서는 urls)를 포함한 구조(XML, JSON 등)를 반환하는 것이 더 낫지 않을까요?
하여 javascript를 수 .<img>자체를 해서.
RPC 로부터 수신하는 구조는, 다음과 같습니다.
{"img" : ["myimage.jpg", "myimage2.jpg"]}
외부 소스로부터의 코드를 페이지에 삽입하는 것은 그다지 안전하지 않은 것 같기 때문에, 이 방법이 좋다고 생각합니다.누군가가 XML-RPC 스크립트를 가로채고 싶지 않은 것을 거기에 넣는 것을 상상하는 것(일부 Javascript...)
한 줄짜리 남성용:
const htmlDecode = innerHTML => Object.assign(document.createElement('textarea'), {innerHTML}).value;
console.log(htmlDecode('Complicated - Dimitri Vegas & Like Mike'));
천만에요...그냥 배달원...모든 크레딧은 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
않습니다.x다만, 가능한 한, 자사 애플리케이션으로부터의 악의적(또는 예기치 않은) 입력으로부터 보호하는 것은 타당합니다.를 들어, 「」라고 합니다.x은 의 has has has has has 。& <script>alert('hello');</script>. 은 다음과 같습니다 jQuery는 다음과 같습니다.
var x = "& <script>alert('hello');</script>";
var safe = $('<div />').html(x).text();
// => "& alert('hello');"
https://gist.github.com/jmblog/3222899에서 찾을 수 있습니다.이 솔루션이 일부 대안보다 짧지는 않더라도 최소한 짧으며 XSS에 대한 방어 기능을 제공하기 때문에 이 솔루션을 사용하는 것을 피할 이유는 많지 않습니다.
(원래는 코멘트로서 투고하고 있었습니다만, 같은 스레드의 후속 코멘트가 코멘트를 요구했기 때문에, 코멘트로 투고하고 있습니다.
여기에 좋은 답변이 많이 있다는 것을 알지만, 저는 조금 다른 접근방식을 구현했기 때문에 공유하려고 합니다.
이 코드는 함수가 아닌 브라우저에 의존하는 이스케이프 핸들러로서 완벽하게 안전한 보안 접근법입니다.따라서 향후 새로운 취약성이 발견될 경우 이 솔루션에 대해 설명합니다.
const decodeHTMLEntities = text => {
// Create a new element or use one from cache, to save some element creation overhead
const el = decodeHTMLEntities.__cache_data_element
= decodeHTMLEntities.__cache_data_element
|| document.createElement('div');
const enc = text
// Prevent any mixup of existing pattern in text
.replace(/⪪/g, '⪪#')
// Encode entities in special format. This will prevent native element encoder to replace any amp characters
.replace(/&([a-z1-8]{2,31}|#x[0-9a-f]+|#\d+);/gi, '⪪$1⪫');
// Encode any HTML tags in the text to prevent script injection
el.textContent = enc;
// Decode entities from special format, back to their original HTML entities format
el.innerHTML = el.innerHTML
.replace(/⪪([a-z1-8]{2,31}|#x[0-9a-f]+|#\d+)⪫/gi, '&$1;')
.replace(/#⪫/g, '⪫');
// Get the decoded HTML entities
const dec = el.textContent;
// Clear the element content, in order to preserve a bit of memory (it is just the text may be pretty big)
el.textContent = '';
return dec;
}
// Example
console.log(decodeHTMLEntities("<script>alert('∳∳∳∳⪪#x02233⪫');</script>"));
// Prints: <script>alert('∳∳∳∳⪪##x02233⪫');</script>
그나저나, 나는 그 캐릭터를 사용하기로 결정했다.⪪ ★★★★★★★★★★★★★★★★★」⪫이는 거의 사용되지 않기 때문에 일치시킴으로써 퍼포먼스에 영향을 줄 가능성이 크게 낮아집니다.
Chris의 답변은 훌륭하고 우아하지만 값이 정의되지 않으면 실패합니다.간단한 개선만으로도 견고합니다.
function htmlDecode(value) {
return (typeof value === 'undefined') ? '' : $('<div/>').html(value).text();
}
javascript 솔루션에서 공통점을 찾을 수 있습니다.
var map = {amp: '&', lt: '<', gt: '>', quot: '"', '#039': "'"}
str = str.replace(/&([^;]+);/g, (m, c) => map[c])
이것은 https://stackoverflow.com/a/4835406/2738039의 반대입니다.
JSON 어레이에서 &를 삭제하려고 모든 방법을 시도했습니다.위의 예시는 없었지만, https://stackoverflow.com/users/2030321/chris는 문제를 해결할 수 있는 훌륭한 솔루션을 제공해 주었습니다.
var stringtodecode="<B>Hello</B> world<br>";
document.getElementById("decodeIt").innerHTML=stringtodecode;
stringtodecode=document.getElementById("decodeIt").innerText
JSON 데이터를 어레이로 가져오는 모달창에 삽입하는 방법을 몰랐기 때문에 사용하지 않았습니다만, 이 예에 근거해 시험해 보니 다음과 같이 동작했습니다.
var modal = document.getElementById('demodal');
$('#ampersandcontent').text(replaceAll(data[0],"&", "&"));
심플하고 효과적이기 때문에 마음에 드는데, 왜 널리 사용되지 않는지 잘 모르겠습니다.심플한 솔루션을 찾기 위해 하이&로우 검색.저는 계속해서 구문에 대한 이해를 구하고 있으며, 이 구문을 사용하는 데 위험이 있는지 확인합니다.아직 아무것도 못 찾았어요.
저는 완전히는 아니더라도 이 기능을 완벽하게 구현해야 할 정도로 미쳤습니다.
function removeEncoding(string) {
return string.replace(/À/g, "À").replace(/Á/g, "Á").replace(/Â/g, "Â").replace(/Ã/g, "Ã").replace(/Ä/g, "Ä").replace(/Å/g, "Å").replace(/à/g, "à").replace(/â/g, "â").replace(/ã/g, "ã").replace(/ä/g, "ä").replace(/å/g, "å").replace(/Æ/g, "Æ").replace(/æ/g, "æ").replace(/ß/g, "ß").replace(/Ç/g, "Ç").replace(/ç/g, "ç").replace(/È/g, "È").replace(/É/g, "É").replace(/Ê/g, "Ê").replace(/Ë/g, "Ë").replace(/è/g, "è").replace(/é/g, "é").replace(/ê/g, "ê").replace(/ë/g, "ë").replace(/ƒ/g, "ƒ").replace(/Ì/g, "Ì").replace(/Í/g, "Í").replace(/Î/g, "Î").replace(/Ï/g, "Ï").replace(/ì/g, "ì").replace(/í/g, "í").replace(/î/g, "î").replace(/ï/g, "ï").replace(/Ñ/g, "Ñ").replace(/ñ/g, "ñ").replace(/Ò/g, "Ò").replace(/Ó/g, "Ó").replace(/Ô/g, "Ô").replace(/Õ/g, "Õ").replace(/Ö/g, "Ö").replace(/ò/g, "ò").replace(/ó/g, "ó").replace(/ô/g, "ô").replace(/õ/g, "õ").replace(/ö/g, "ö").replace(/Ø/g, "Ø").replace(/ø/g, "ø").replace(/Œ/g, "Œ").replace(/œ/g, "œ").replace(/Š/g, "Š").replace(/š/g, "š").replace(/Ù/g, "Ù").replace(/Ú/g, "Ú").replace(/Û/g, "Û").replace(/Ü/g, "Ü").replace(/ù/g, "ù").replace(/ú/g, "ú").replace(/û/g, "û").replace(/ü/g, "ü").replace(/µ/g, "µ").replace(/×/g, "×").replace(/Ý/g, "Ý").replace(/Ÿ/g, "Ÿ").replace(/ý/g, "ý").replace(/ÿ/g, "ÿ").replace(/°/g, "°").replace(/†/g, "†").replace(/‡/g, "‡").replace(/</g, "<").replace(/>/g, ">").replace(/±/g, "±").replace(/«/g, "«").replace(/»/g, "»").replace(/¿/g, "¿").replace(/¡/g, "¡").replace(/·/g, "·").replace(/•/g, "•").replace(/™/g, "™").replace(/©/g, "©").replace(/®/g, "®").replace(/§/g, "§").replace(/¶/g, "¶").replace(/Α/g, "Α").replace(/Β/g, "Β").replace(/Γ/g, "Γ").replace(/Δ/g, "Δ").replace(/Ε/g, "Ε").replace(/Ζ/g, "Ζ").replace(/Η/g, "Η").replace(/Θ/g, "Θ").replace(/Ι/g, "Ι").replace(/Κ/g, "Κ").replace(/Λ/g, "Λ").replace(/Μ/g, "Μ").replace(/Ν/g, "Ν").replace(/Ξ/g, "Ξ").replace(/Ο/g, "Ο").replace(/Π/g, "Π").replace(/Ρ/g, "Ρ").replace(/Σ/g, "Σ").replace(/Τ/g, "Τ").replace(/Υ/g, "Υ").replace(/Φ/g, "Φ").replace(/Χ/g, "Χ").replace(/Ψ/g, "Ψ").replace(/Ω/g, "Ω").replace(/α/g, "α").replace(/β/g, "β").replace(/γ/g, "γ").replace(/δ/g, "δ").replace(/ε/g, "ε").replace(/ζ/g, "ζ").replace(/η/g, "η").replace(/θ/g, "θ").replace(/ι/g, "ι").replace(/κ/g, "κ").replace(/λ/g, "λ").replace(/μ/g, "μ").replace(/ν/g, "ν").replace(/ξ/g, "ξ").replace(/ο/g, "ο").replace(/&piρ;/g, "ρ").replace(/ρ/g, "ς").replace(/ς/g, "ς").replace(/σ/g, "σ").replace(/τ/g, "τ").replace(/φ/g, "φ").replace(/χ/g, "χ").replace(/ψ/g, "ψ").replace(/ω/g, "ω").replace(/•/g, "•").replace(/…/g, "…").replace(/′/g, "′").replace(/″/g, "″").replace(/‾/g, "‾").replace(/⁄/g, "⁄").replace(/℘/g, "℘").replace(/ℑ/g, "ℑ").replace(/ℜ/g, "ℜ").replace(/™/g, "™").replace(/ℵ/g, "ℵ").replace(/←/g, "←").replace(/↑/g, "↑").replace(/→/g, "→").replace(/↓/g, "↓").replace(/&barr;/g, "↔").replace(/↵/g, "↵").replace(/⇐/g, "⇐").replace(/⇑/g, "⇑").replace(/⇒/g, "⇒").replace(/⇓/g, "⇓").replace(/⇔/g, "⇔").replace(/∀/g, "∀").replace(/∂/g, "∂").replace(/∃/g, "∃").replace(/∅/g, "∅").replace(/∇/g, "∇").replace(/∈/g, "∈").replace(/∉/g, "∉").replace(/∋/g, "∋").replace(/∏/g, "∏").replace(/∑/g, "∑").replace(/−/g, "−").replace(/∗/g, "∗").replace(/√/g, "√").replace(/∝/g, "∝").replace(/∞/g, "∞").replace(/&OEig;/g, "Œ").replace(/œ/g, "œ").replace(/Ÿ/g, "Ÿ").replace(/♠/g, "♠").replace(/♣/g, "♣").replace(/♥/g, "♥").replace(/♦/g, "♦").replace(/ϑ/g, "ϑ").replace(/ϒ/g, "ϒ").replace(/ϖ/g, "ϖ").replace(/Š/g, "Š").replace(/š/g, "š").replace(/∠/g, "∠").replace(/∧/g, "∧").replace(/∨/g, "∨").replace(/∩/g, "∩").replace(/∪/g, "∪").replace(/∫/g, "∫").replace(/∴/g, "∴").replace(/∼/g, "∼").replace(/≅/g, "≅").replace(/≈/g, "≈").replace(/≠/g, "≠").replace(/≡/g, "≡").replace(/≤/g, "≤").replace(/≥/g, "≥").replace(/⊂/g, "⊂").replace(/⊃/g, "⊃").replace(/⊄/g, "⊄").replace(/⊆/g, "⊆").replace(/⊇/g, "⊇").replace(/⊕/g, "⊕").replace(/⊗/g, "⊗").replace(/⊥/g, "⊥").replace(/⋅/g, "⋅").replace(/&lcell;/g, "⌈").replace(/&rcell;/g, "⌉").replace(/⌊/g, "⌊").replace(/⌋/g, "⌋").replace(/⟨/g, "⟨").replace(/⟩/g, "⟩").replace(/◊/g, "◊").replace(/'/g, "'").replace(/&/g, "&").replace(/"/g, "\"");
}
다음과 같이 사용:
let decodedText = removeEncoding("Ich heiße David");
console.log(decodedText);
★★★★★★Ich Heiße David
추신, 이걸 만드는 데 한 시간 반 정도 걸렸어요.
지금까지 시도한 솔루션 중 가장 포괄적인 것은 다음과 같습니다.
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]
);
};
닫힘으로 불필요한 객체가 생성되는 것을 방지할 수 있습니다.
const decodingHandler = (() => {
const element = document.createElement('div');
return text => {
element.innerHTML = text;
return element.textContent;
};
})();
보다 간결한 방법
const decodingHandler = (() => {
const element = document.createElement('div');
return text => ((element.innerHTML = text), element.textContent);
})();
저는 이것을 제 프로젝트에서 사용하고 있습니다.다른 답변에서 영감을 얻었지만 매우 안전한 파라미터로 장식된 캐릭터를 다룰 때 유용합니다.
var decodeEntities=(function(){
var el=document.createElement('div');
return function(str, safeEscape){
if(str && typeof str === 'string'){
str=str.replace(/\</g, '<');
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, '<');
}
return str;
}
})();
다음과 같이 사용할 수 있습니다.
var label='safe <b> character éntity</b>';
var safehtml='<div title="'+decodeEntities(label)+'">'+decodeEntities(label, true)+'</div>';
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);
여기 있는 다른 모든 답변에는 문제가 있습니다.
document.createElement('div') 메서드(jQuery를 사용하는 메서드 포함)는 전달된 Javascript(보안 문제)를 실행하고 DOMParser.parseFromString() 메서드는 공백을 제거합니다.다음은 문제가 없는 순수 Javascript 솔루션입니다.
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('<& >'); // 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.
function decodeHTMLContent(htmlText) {
var txt = document.createElement("span");
txt.innerHTML = htmlText;
return txt.innerText;
}
var result = decodeHTMLContent('One & two & three');
console.log(result);언급URL : https://stackoverflow.com/questions/3700326/decode-amp-back-to-in-javascript
'itsource' 카테고리의 다른 글
| json 필드를 여러 행으로 분할하는 방법 (0) | 2022.09.30 |
|---|---|
| MySQL Workbench를 사용하여 MySQL 데이터베이스 백업을 수행하는 방법 (0) | 2022.09.30 |
| REST 웹 서비스를 위한 Spring 4 vs Jersey (0) | 2022.09.30 |
| 라우터 파라미터에 기반한 Vue http를 사용한 데이터 가져오기 (0) | 2022.09.30 |
| JSTL과 함께 EL을 사용하여 Enum 값에 액세스합니다. (0) | 2022.09.30 |