Bagaimanakah Saya Boleh Menyahlepaskan Entiti HTML dengan Selamat dalam JavaScript?

Menyingkirkan Entiti HTML dalam JavaScript

Masalah:

Apabila menerima rentetan HTML daripada XML Bahagian belakang -RPC, mereka membuat secara literal dan bukannya dipaparkan sebagai elemen HTML. Ini menunjukkan bahawa HTML sedang dilarikan melalui saluran XML-RPC.

Penyelesaian Menggunakan DOMParser:

Untuk melepaskan entiti HTML dalam JavaScript dengan betul tanpa memperkenalkan kelemahan keselamatan, ia disyorkan untuk menggunakan antara muka DOMParser. DOMParser mencipta pepohon DOM daripada rentetan HTML yang disediakan, yang kemudiannya boleh digunakan untuk mendapatkan semula kandungan teks yang tidak dilepaskan.

Berikut ialah versi terkini fungsi htmlDecode yang menggunakan DOMParser:

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

Contoh berikut menunjukkan cara menggunakan fungsi yang dikemas kini:

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

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

Dalam contoh kedua, rentetan HTML yang berpotensi berniat jahat tidak dapat dielakkan dengan betul, mengakibatkan rentetan kosong untuk menghalang kelemahan skrip merentas tapak (XSS).

Atas ialah kandungan terperinci Bagaimanakah Saya Boleh Menyahlepaskan Entiti HTML dengan Selamat dalam JavaScript?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!