Làm cách nào để bỏ thoát các ký tự trong JavaScript?

Các hàm escape() và unescape() dùng để Mã hóa và giải mã một chuỗi trong JavaScript. Hàm escape() trong JavaScript để tạo một chuỗi khả chuyển để truyền nó qua mạng và chúng ta có thể sử dụng hàm unscape() để lấy lại chuỗi ban đầu

Tự mình thử

Nguồn

Thoát và thoát rất hữu ích để ngăn chặn cuộc tấn công Cross Site Scripting (XSS). Đây là một trong những kiểu tấn công web phổ biến, vì sẽ dễ dàng tạo ra một vectơ tấn công nếu trang web không được thiết kế cẩn thận

theo https. // nhà phát triển. mozilla. org/en-US/docs/Web/JavaScript/Reference/Global_Objects/unescape bạn nên cập nhật tập lệnh cũ của mình

Làm thế nào để khắc phục?

Việc sửa nó có thể đơn giản như thả một dòng vào JS của bạn để thêm vào phương thức unescape() nếu phương thức này không tồn tại

JavaScript cung cấp hai chức năng để xử lý các chuỗi được mã hóa. thoát () và thoát (). Hàm escape() được sử dụng để mã hóa một chuỗi, đảm bảo an toàn khi sử dụng trong URL. Hàm unescape() được sử dụng để giải mã một chuỗi được mã hóa

Sự khác biệt

Sự khác biệt chính giữa hai chức năng là escape() mã hóa các ký tự không phải là ASCII, trong khi unescape() chỉ giải mã các ký tự đó. Điều này có nghĩa là nếu bạn sử dụng escape() trên một chuỗi chỉ chứa các ký tự ASCII, thì kết quả sẽ giống với chuỗi đầu vào. Tuy nhiên, nếu bạn sử dụng unescape() trên một chuỗi chứa các ký tự không phải ASCII, kết quả có thể khác với chuỗi đầu vào

Trường hợp sử dụng

Hàm escape() thường được sử dụng khi mã hóa tham số URL hoặc đoạn đường dẫn. Ví dụ: nếu bạn muốn mã hóa chuỗi "Xin chào thế giới. " để sử dụng trong một URL, bạn sẽ sử dụng hàm escape(), như thế này -

var encodedString = escape("Hello world!");

Hàm unescape() thường được sử dụng khi giải mã tham số URL hoặc đoạn đường dẫn. Ví dụ, nếu bạn muốn giải mã chuỗi "Hello%20world. " (là phiên bản được mã hóa của "Xin chào thế giới. "), bạn sẽ sử dụng hàm unescape(), như thế này -

var decodedString = unescape("Hello%20world!");

Ví dụ

Dưới đây là ví dụ mã làm việc đầy đủ -

Những lợi ích

Dưới đây là những lợi ích của việc sử dụng hàm escape() và unescape() −

• Hàm escape() có thể được sử dụng để mã hóa một chuỗi để sử dụng trong URL

• Hàm unescape() có thể được sử dụng để giải mã một chuỗi được mã hóa

• Các chức năng này có thể được sử dụng để đảm bảo rằng một chuỗi an toàn để sử dụng trong một URL

• Các chức năng này có thể được sử dụng để giải mã một chuỗi đã được mã hóa để sử dụng trong một URL

Nhược điểm

Dưới đây là một số nhược điểm của việc sử dụng hàm escape() và unescape() −

• Chức năng thoát () không được hỗ trợ trong tất cả các trình duyệt (bao gồm cả Internet Explorer 7 trở về trước)

• Hàm unescape() có thể được sử dụng để giải mã các chuỗi độc hại, có thể dẫn đến các lỗ hổng bảo mật

• Các hàm escape() và unescape() chỉ hoạt động với các ký tự ASCII. Nếu bạn cần mã hóa/giải mã một chuỗi chứa các ký tự không phải ASCII, bạn nên sử dụng lược đồ mã hóa/giải mã khác, chẳng hạn như UTF-8

Phần kết luận

Tóm lại, các hàm escape() và unescape() lần lượt được sử dụng để mã hóa và giải mã các chuỗi. Sự khác biệt chính giữa hai chức năng là escape() mã hóa các ký tự không phải là ASCII, trong khi unescape() chỉ giải mã các ký tự đó. Các chức năng này có thể được sử dụng để đảm bảo rằng một chuỗi an toàn để sử dụng trong một URL. Tuy nhiên, không nên sử dụng các chức năng này để giải mã các chuỗi đã được mã hóa bằng sơ đồ mã hóa khác, chẳng hạn như UTF-8

Lưu ý - Các hàm escape() và unescape() không được dùng nữa. Thay vào đó, hãy sử dụng encodeURI hoặc encodeURIComponent() và sử dụng decodeURI() hoặc decodeURIComponent()

Trong bài viết này, chúng ta sẽ tìm hiểu cách bỏ thoát các ký tự đặc biệt html chỉ bằng cách sử dụng một dòng mã trong JavaScript. Đây là đoạn mã JavaScript một dòng sử dụng một trong những tính năng phổ biến nhất của ES6 =>

var decodedString = unescape("Hello%20world!");

1

Hãy xác định chức năng ngắn này

const unescape = str => str.replace(/&/g , '&').replace(//g  , '>').replace(/�*39;/g , "'").replace(/"/g, '"');

Thao tác này sẽ bỏ thoát văn bản, vì vậy chúng ta có thể trả lại văn bản chưa thoát sau đó bằng cách lấy văn bản từ vùng văn bản

Chẳng hạn, chúng ta có thể viết

const htmlDecode = (input) => {
  const e = document.createElement('textarea');
  e.innerHTML = input;
  return e.childNodes.length === 0 ? "" : e.childNodes[0].nodeValue;
}const result = htmlDecode("<img src='myimage.jpg'>");
console.log(result)

Chúng ta có một hàm

var decodedString = unescape("Hello%20world!");

2 lấy chuỗi

var decodedString = unescape("Hello%20world!");

3 làm tham số

Trong hàm, chúng ta tạo phần tử

var decodedString = unescape("Hello%20world!");

4 với phần tử

var decodedString = unescape("Hello%20world!");

5

Sau đó, chúng tôi đặt

var decodedString = unescape("Hello%20world!");

6 của nó thành

var decodedString = unescape("Hello%20world!");

3

Sau đó, chúng tôi nhận được văn bản chưa thoát bằng cách lấy thuộc tính

var decodedString = unescape("Hello%20world!");

8 và trả lại

Bây giờ khi chúng tôi chuyển vào một chuỗi đã thoát, chúng tôi sẽ lấy lại phiên bản chưa thoát

Vì vậy,

const htmlDecode = (input) => {
  const doc = new DOMParser().parseFromString(input, "text/html");
  return doc.documentElement.textContent;
}const result = htmlDecode("<img src='myimage.jpg'>");
console.log(result)

0 trở thành

const htmlDecode = (input) => {
  const doc = new DOMParser().parseFromString(input, "text/html");
  return doc.documentElement.textContent;
}const result = htmlDecode("<img src='myimage.jpg'>");
console.log(result)

1

Sử dụng DOMParser. nguyên mẫu. Phương thức parseFromString

Một cách khác để bỏ thoát một chuỗi là sử dụng phương thức

const htmlDecode = (input) => {
  const doc = new DOMParser().parseFromString(input, "text/html");
  return doc.documentElement.textContent;
}const result = htmlDecode("<img src='myimage.jpg'>");
console.log(result)

2

Để sử dụng nó, chúng tôi chuyển vào chuỗi đã thoát và loại MIME của chuỗi để trả về

Chẳng hạn, chúng ta có thể sử dụng nó bằng cách viết

const htmlDecode = (input) => {
  const doc = new DOMParser().parseFromString(input, "text/html");
  return doc.documentElement.textContent;
}const result = htmlDecode("<img src='myimage.jpg'>");
console.log(result)

Chúng tôi tạo một phiên bản

const htmlDecode = (input) => {
  const doc = new DOMParser().parseFromString(input, "text/html");
  return doc.documentElement.textContent;
}const result = htmlDecode("<img src='myimage.jpg'>");
console.log(result)

3 mới

Sau đó, chúng tôi gọi

const htmlDecode = (input) => {
  const doc = new DOMParser().parseFromString(input, "text/html");
  return doc.documentElement.textContent;
}const result = htmlDecode("<img src='myimage.jpg'>");
console.log(result)

4 với chuỗi

var decodedString = unescape("Hello%20world!");

3 và chuỗi kiểu MIME của chuỗi để chuyển đổi thành

Làm cách nào để thoát các thực thể ký tự HTML trong JavaScript?

Hàm Unescape() và escape() là gì?

Tôi có thể sử dụng cái gì thay cho Unescape?

Làm cách nào để thoát các ký tự đặc biệt trong chuỗi JavaScript?