Bộ công cụ Dojo: cách thoát chuỗi HTML?

Question

Người dùng ứng dụng HTML 5 của tôi có thể nhập tên của anh ấy vào một biểu mẫu và tên này sẽ được hiển thị ở nơi khác. Cụ thể hơn, nó sẽ trở thành innerHTML của một số phần tử HTML.

Vấn đề là điều này có thể được khai thác nếu người dùng nhập đánh dấu HTML hợp lệ trong biểu mẫu, nghĩa là một số loại tiêm HTML, nếu bạn muốn.

Tên của người dùng chỉ được lưu trữ và hiển thị ở phía máy khách để cuối cùng người dùng là người duy nhất bị ảnh hưởng, nhưng nó vẫn còn cẩu thả.

Có cách nào để thoát chuỗi trước khi tôi đặt nó trong một thành phần innerHTML trong Dojo không? Tôi đoán rằng Dojo tại một điểm trên thực tế có chức năng như vậy (dojo.string.escape()) nhưng nó không tồn tại trong phiên bản 1.7.

Cảm ơn.

Answer 1

dojox.html.entities.encode(myString); 

Answer 2

Kiểm tra ví dụ này của dojo.replace:

require(["dojo/_base/lang"], function(lang){ 
    function safeReplace(tmpl, dict){ 
    // convert dict to a function, if needed 
    var fn = lang.isFunction(dict) ? dict : function(_, name){ 
     return lang.getObject(name, false, dict); 
    }; 
    // perform the substitution 
    return lang.replace(tmpl, function(_, name){ 
     if(name.charAt(0) == '!'){ 
     // no escaping 
     return fn(_, name.slice(1)); 
     } 
     // escape 
     return fn(_, name). 
     replace(/&/g, "&"). 
     replace(/</g, "&lt;"). 
     replace(/>/g, "&gt;"). 
     replace(/"/g, "&quot;"); 
    }); 
    } 
    // that is how we use it: 
    var output = safeReplace("<div>{0}</div", 
    ["<script>alert('Let\' break stuff!');</script>"] 
); 
}); 

Nguồn: http://dojotoolkit.org/reference-guide/1.7/dojo/replace.html#escaping-substitutions

Answer 3

Tôi cố gắng để tìm hiểu cách thức các thư viện khác thực hiện chức năng này và tôi đã ăn cắp ý tưởng từ MooTools sau:

var property = (document.createElement('div').textContent == null) ? 'innerText': 'textContent'; 
elem[property] = "<" + "script" + ">" + "alert('a');" + "</" + "script" + ">"; 

Vì vậy, theo MooTools, có cả thuộc tính innerText hoặc textContent có thể thoát HTML.

Answer 4

Dojo có mô-đun dojox/html/entities để thoát HTML. Thật không may, the official documentation vẫn chỉ cung cấp ví dụ trước 1,7, không phải AMD.

Dưới đây là một ví dụ làm thế nào để sử dụng mô-đun với AMD:

var str = "<strong>some text</strong>" 
require(['dojox/html/entities'], function(entities) { 
var escaped = entities.encode(str) 
console.log(escaped) 
}) 

Output:

<strong>some text</strong>

Answer 5

Tính đến Dojo 1.10, chức năng thoát vẫn là một phần của mô-đun chuỗi.

http://dojotoolkit.org/api/?qs=1.10/dojo/string

Đây là cách bạn có thể sử dụng làm hệ thống mẫu đơn giản.

require([ 
    'dojo/string' 
], function(
    string 
){ 
    var template = '<h1>${title}</h1>'; 
    var message = {title: 'Hello World!<script>alert("Doing something naughty here...")</script>'} 
    var html = string.substitute(
     template 
     , message 
     , string.escape 
    ); 
});