Handle Multiple Query Parameters with the Same Key
Understand how URLs handle duplicate query parameter keys, how different languages and frameworks parse them, and best practices for working with array-like query parameters.
Query Parameters
Detailed Explanation
Duplicate Query Parameter Keys
URLs can contain the same query parameter key multiple times. This is valid and commonly used to represent arrays or multi-select values.
Example
https://shop.example.com/products?color=red&color=blue&color=green&size=L
How Different Environments Handle Duplicates
JavaScript (URLSearchParams):
const params = new URLSearchParams("color=red&color=blue&color=green");
params.get("color"); // "red" (first value only)
params.getAll("color"); // ["red", "blue", "green"]
Express.js / Node.js (qs library):
// req.query.color → ["red", "blue", "green"]
PHP:
// $_GET['color'] → "green" (last value wins!)
// Use color[] to get an array:
// ?color[]=red&color[]=blue → $_GET['color'] → ["red", "blue"]
Python (urllib.parse):
from urllib.parse import parse_qs
parse_qs("color=red&color=blue")
# {'color': ['red', 'blue']}
Key Differences
| Environment | ?a=1&a=2 result |
|---|---|
| URLSearchParams.get() | "1" (first) |
| URLSearchParams.getAll() | ["1", "2"] |
PHP $_GET |
"2" (last) |
| Express/qs | ["1", "2"] |
| Python parse_qs | {"a": ["1", "2"]} |
| Go url.Values | ["1", "2"] |
Best Practices
- Be explicit — use
getAll()when you expect multiple values - Document conventions — if your API uses repeated keys for arrays, document it
- Framework awareness — know whether your backend gets the first value, last value, or an array
- Consistency — pick one convention (repeated keys vs bracket notation) and stick with it
Use Case
Handling duplicate query parameters is essential for building filter interfaces, multi-select dropdowns that sync with the URL, and search pages with faceted navigation. E-commerce sites commonly use repeated parameters for filtering by multiple categories, colors, or sizes simultaneously.