Photo Wall – Improper URL Encoding of Static Resources

Abstract

This assessment was conducted in a controlled laboratory environment using the OWASP Juice Shop application.
The objective was to analyze an issue observed in the Photo Wall feature, where an uploaded image was not rendered correctly in the browser.

Upon closer inspection, the root cause was identified as improper URL encoding of special characters within the image source path.
Although this issue does not represent a direct security exploit, it highlights deficiencies in input normalization and encoding that may indicate the presence of further vulnerabilities.

Preparation Documentation

Identified Issue and Risk Assessment

• Identified Issue: Improper URL encoding of static resource paths
• Category: Input Handling / Encoding Error
• Risk Assessment: Low
• Potential Impact:
  • Broken or inaccessible content
  • Inconsistent client-side behavior
  • Indicators of insufficient input validation
  • Increased likelihood of downstream vulnerabilities (e.g. XSS, path manipulation)

Context and Observations

Within the Photo Wall, an image failed to render correctly.
Inspection of the HTML source revealed the following src attribute:

src="assets/public/images/uploads/ᓚᘏᗢ-#zatschi-#whoneedsfourlegs-1572600969477.jpg"

Key observations:

• Presence of non-ASCII Unicode characters
• Use of the # character (fragment identifier)
• Missing percent-encoding for reserved URL characters

The # character is interpreted by browsers as a fragment delimiter, meaning everything following it is not sent to the server. This resulted in an invalid resource request and prevented the image from loading.

Tools Used

• Web browser (Developer Tools)
• CyberChef (encoding and transformation utility)

Results Documentation

Discovery Process

• Manual inspection of the Photo Wall page
• Identification of a broken image element
• Analysis of the image source path in browser developer tools
• Hypothesis that incorrect URL encoding caused the issue

Exploitation / Resolution Process

1. Copied the image URL from the src attribute.
2. Analyzed the URL structure and identified the # characters as the root cause.
3. Used CyberChef to apply proper URL encoding.
4. Replaced the # character with its percent-encoded representation %23.
5. Tested the corrected URL in the browser.
6. The image rendered successfully after encoding was applied.

Example Fix:

#  →  %23

Outcome

• The image was displayed correctly after replacing # with %23.
• The challenge was successfully completed.
• No direct security exploit was demonstrated.
• The issue confirmed improper handling of special characters in URLs.

Security Relevance Assessment

While not a vulnerability by itself, this finding is security-relevant because:

• Improper encoding often correlates with insecure input handling
• Similar weaknesses frequently coexist with exploitable flaws such as:
  • DOM-based XSS
  • Path traversal
  • Injection vulnerabilities
• It represents a security weakness indicator during application assessments

Mitigation Measures

• Enforce strict URL-safe encoding for all user-controlled filenames.
• Normalize filenames during upload (e.g. whitelist allowed characters).
• Replace or encode reserved characters such as #, ?, &, ', and spaces.
• Avoid storing raw user input directly in resource paths.
• Implement centralized encoding and validation logic.

Recommendations and Prioritization

• Priority: Low (but relevant as an indicator)
• Review all file upload and asset-handling mechanisms.
• Treat encoding issues as early warning signs during pentests.
• Include encoding validation in QA and security testing processes.