Cách chống XSS cho website
Mọi người có thể cho em hỏi cách để chống XSS
được không ạ?
Ngộ là nếu e chống bằng middleware cũng được ạ, nhưng có điều khi e viết bài, không submit được markdown có dạng code là html
ví dụ như:
<!DOCTYPE html>
<html lang="en">
<head>
<title>Markdown Editor Example</title>
<meta charset="utf-8">
<link rel="stylesheet" href="css/style.css">
<script src="js/simplemde.min.js"></script>
<link rel="stylesheet" href="css/simplemde.min.css">
</head>
<body>
<textarea id="markdown-editor"></textarea>
<script type="text/javascript">
var simplemde = new SimpleMDE({ element: document.getElementById("markdown-editor") });
</script>
</body>
</html>
chẳng hạn ạ... Và e tắt middleware để đăng bài với nội dung trên thì khi chỉnh sửa, bài viết sẽ bị lỗi ở form chỉnh sửa và bị cắt bớt 1 đoạn HTML trên.
E chưa biết cách khắc phục như thế nào cả ạ?
Bài viết của e có thể có chứa HTML ở trong bài viết, nên không dùng được biện pháp Lọc đầu vào
ạ?
E xin cám ơn mọi người.
1 CÂU TRẢ LỜI
Bài viết của em có thể chứa một số tag HTML
, tuy nhiên không nên chứa tag <script></script>
, em có thể lọc bỏ, hoặc escape tag này đi.
Ngoài ra, để chống việc chèn javascript vào attributes của các tag HTML thông thường, em cũng nên duyệt qua các tag HTML khác, để remove các attributes đi, chỉ cho phép class
thôi chẳng hạn
P/S: Việc cho phép người dùng sử dụng các tag HTML sẽ kéo theo nhiều vấn đề không lường trước được. Đặc biệt nếu cho phép người dùng đưa custom style của họ vào các thẻ HTML (chẳng hạn như <div style="color:blue; font-side: 100px">
) có thể sẽ khiến layout bài viết bị phá vỡ, em nên cân nhắc
Dạ, e hiểu vấn đề đó ạ, nhưng Viblo lại làm được ạ, vẫn cho hiển thị nội dung HTML, script nằm trong example
và vẫn ngăn chặn được XSS...
E vẫn chưa có hướng giải quyết cụ thể ở đây ạ...
@minhtuancnttk39 À, Viblo là cho phép hiện nguyên tag HTML của users nhập vào, chứ không phải là cho phép render tag HTML ra. Viblo chỉ cho render một vài tag HTML như là <br>
hay <hr>
thôi
Ví dụ khi em gõ <br>
sẽ được 1 dòng mới, gõ <hr>
sẽ được 1 đường thẳng, chứ nó không hiện ra chữ <br>
và <hr>
như các thẻ
Có vẻ ý em là muốn khi người dùng nhập và đoạn text
<html lang="en">
<head>
<title>Markdown Editor Example</title>
<meta charset="utf-8">
<link rel="stylesheet" href="css/style.css">
<script src="js/simplemde.min.js"></script>
<link rel="stylesheet" href="css/simplemde.min.css">
</head>
<body>
thì nó phải được render ra đúng thế, thay vì trở thành một phần html của trang web, đúng không nhỉ? Vậy thì có lẽ anh hiểu nhầm, anh lại hiểu ngược lại, nên trả lời chưa đúng trọng tâm cho lắm
Nếu em muốn render ra được các tag HTML dưới dạng text, thì em cần escape các ký tự đặc biệt đi là được:
Chẳng hạn như dùng hàm đơn giản như thế này:
function escapeHtml(unsafe) {
return unsafe
.replace(/&/g, "&")
.replace(/</g, "<")
.replace(/>/g, ">")
.replace(/"/g, """)
.replace(/'/g, "'");
}
Tuy nhiên, chú ý chỉ dùng hàm đó với text ở ngoài thẻ <code></code>
thôi nhé, nội dung bên trong thẻ code thì không được dùng hàm escape.
Mà anh tưởng cái này thì thư viện render markdown nó phải hỗ trợ chứ nhỉ Em thử xem lại document của nó xem
Không biết nội dung markdown bài viết bạn đang làm như nào để hiển thị ra nhỉ? Vì thực ra cái XSS này chỉ là vấn đề lúc hiển thị nội dung, người ta nhập gì mình hiển thị đúng như thế dù nhập mã HTML hay Javascript.
@huukimit Việc hiển thị không là vấn đề a ạ, nhưng cái có vấn đề ở đây là:
Và khi em copy nguyên một cái html nào đó, paste vào markdown editor rồi nhấn đăng bài viết thì nguyên bài đăng không hiện nội dung của bài viết mà là Render thành một trang con trong bài viết dựa trên các mã html được viết trong đó ạ..