Security: Missing XSS Sanitization for Dynamic HTML Injection

[AlexJSully]

Issue Description

User-controlled data (article titles, authors, summaries) are embedded directly in HTML strings without proper escaping. This allows for HTML/JavaScript injection attacks.

Risk Level

HIGH/CRITICAL

Affected Files

• src/scripts/index.js (Lines 412-450 for carousel, 510-537 for archives)

Details

Problem Locations

1. Carousel Display (Lines 412-450)

   let appendStr = `...${value.title}...${value.summary}...`;

2. Archive Display (Lines 510-537)

   <p class="archive-title">${value.title}</p>
   <img src=${imgURL} alt="${value.title}'s thumbnail" ...>

Example Risk

If an article title is "Test" onclick="alert('hacked')", the HTML attribute injection could trigger unintended actions.

Expected Behavior

All dynamic values should be properly HTML-escaped before being used in template strings.

Solution Approach

1. Create a utility function to escape HTML special characters:

   function escapeHtml(unsafe) {
     return unsafe
       .replace(/&/g, "&")
       .replace(/</g, "&lt;")
       .replace(/>/g, "&gt;")
       .replace(/"/g, "&quot;")
       .replace(/'/g, "&#039;");
   }

2. Apply escaping to all dynamic content in template strings
3. Add tests verifying special characters are properly escaped

Related Issues

• Issue Welcome to Small-Dev-Talk Discussions! #1: XSS Vulnerability - Unescaped innerHTML Usage

Labels

security, bug, critical