Code ReviewAdvanced~18 min

Review: XSS Vulnerability

typescriptsecurityxssreact

Code Review Task

Please review the following TypeScript code.

Background

This is a React component that displays user comments. Review from a security perspective.

Review Criteria

XSS (Cross-Site Scripting) vulnerabilities
User input sanitization
Use of dangerouslySetInnerHTML
Security best practices

Your Answer

CommentList.tsxtypescript

import React from 'react';
 
interface Comment {
  id: number;
  author: string;
  content: string;
  createdAt: string;
}
 
interface CommentListProps {
  comments: Comment[];
}
 
function CommentList({ comments }: CommentListProps) {
  return (
    <div>
      {comments.map(comment => (
        <div key={comment.id} className="comment">
          <h4>{comment.author}</h4>
          <div dangerouslySetInnerHTML={{ __html: comment.content }} />
          <span>{comment.createdAt}</span>
        </div>
      ))}
    </div>
  );
}
 
export default CommentList;

行番号をクリックしてコメントを追加（Shift+クリックで範囲選択）

Review Summary

Minimum 100 characters required

Approval Decision

Overall Severity

Add comments and enter at least 100 characters in the summary

Model Answer

Submit your answer or click "Show" to view the model answer.