molefrog / molefrog/wouter

Improper location decoding

Open
#493 3 comments 4 reactions 0 assignees View on GitHub

Nobody has claimed this yet.

Dominant language
TypeScript
Stars
7.9k
Forks
190
Avg merge
12h 50m
Merged PRs (30d)
3

Description

As of wouter 3.x, the library now calls decodeURI on locations during route matching, meaning route parameters have had this called on them as well. I'm not quite sure why this was added, as it doesn't match how routing would work in a typical HTTP server. That is, if I hit:

GET /path/escaped%2Fslashes

the intent is that this %2F is not treated like a slash, so if we were serving e.g. directories of files, this would look for a file named escaped%2Fslashes in the directory path, not a directory named escaped containing a file named slashes.

This presents a problem that is not solvable for clients of this library if any of their route components can contain a certain collection of characters. You can end up with a parameter value that can no longer be decoded unambiguously.

For instance, if you allow parameters that contain a % and #, you must use encodeURIComponent on this parameter or the resulting location will not work properly, but decodeURI will partially decode this string and you can no longer determine what the original string was without parsing (and effectively doing the routing) yourself:

const url = '/' + encodeURIComponent(`foo/bar#baz%`) // 'foo%2Fbar%23baz%25'
const afterWouter = decodeURI(url) // '/foo/bar%23baz%'
const laterDecode = decodeURIComponent(afterWouter) // throws "URIError: URI malformed"

Since the original string could also contain e.g. %25 at the end, the string at afterWouter is now ambiguous as well: we cannot tell whether the original string contained % or %25 unless we go back and look at the location value, and decoding multiple times may actually "work" without throwing an error but give you a value that is not the same as the original.

Calling decodeURI on the entire URL string multiple times makes issues like this impossible to fix, and wouter at this point seems to do it quite often.

Contributor guide

No contributing guide indexed for this repository

First steps

  1. Read the whole issue, then the project's contributing guide.
  2. Comment on the issue to say you are picking it up — it saves two people doing the same work.
  3. Fork the repository and make your change on a branch.
  4. Open a pull request that references the issue number.

Research direction

No file or test is named. Start by tracing route matching and every location call to decodeURI, then reproduce the encoded-slash and percent examples from the issue. Done means route parameters preserve encoded delimiters and later decoding remains unambiguous without URI errors; add focused regression coverage for these cases.

Written by the indexing model from the issue text.

Assessment

Tech stack
typescript
Domain
frontend, web-dev
Issue type
Bug
Difficulty
4/5
Estimated time
3-5 days
Activity status
Stale
Clarity
Mostly clear
Newbie friendliness
32/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.