同じキーを持つ複数のクエリパラメータの処理

URLが重複するクエリパラメータキーをどのように処理するか、異なる言語やフレームワークがそれらをどのように解析するか、配列的なクエリパラメータを扱うベストプラクティスを理解します。

Query Parameters

詳細な説明

重複するクエリパラメータキー

URLには同じクエリパラメータキーを複数回含めることができます。これは有効であり、配列や複数選択値を表現するために一般的に使用されます。

https://shop.example.com/products?color=red&color=blue&color=green&size=L

各環境での処理方法

JavaScript(URLSearchParams):

const params = new URLSearchParams("color=red&color=blue&color=green");
params.get("color");     // "red"(最初の値のみ)
params.getAll("color");  // ["red", "blue", "green"]

Express.js / Node.js(qsライブラリ):

// req.query.color → ["red", "blue", "green"]

PHP:

// $_GET['color'] → "green"(最後の値が優先!)
// 配列を取得するにはcolor[]を使用:
// ?color[]=red&color[]=blue → $_GET['color'] → ["red", "blue"]

主な違い

環境 ?a=1&a=2 の結果
URLSearchParams.get() "1"(最初)
URLSearchParams.getAll() ["1", "2"]
PHP $_GET "2"(最後)
Express/qs ["1", "2"]
Python parse_qs {"a": ["1", "2"]}
Go url.Values ["1", "2"]

ベストプラクティス

  1. 明示的に — 複数の値を期待する場合はgetAll()を使用
  2. 慣例を文書化 — APIが配列に繰り返しキーを使用する場合は文書化
  3. フレームワークの認識 — バックエンドが最初の値、最後の値、配列のどれを取得するか把握
  4. 一貫性 — 1つの慣例(繰り返しキー vs ブラケット記法)を選んで統一

ユースケース

重複クエリパラメータの処理は、フィルターインターフェース、URLと同期するマルチセレクトドロップダウン、ファセットナビゲーション付き検索ページの構築に不可欠です。ECサイトでは複数のカテゴリ、色、サイズによるフィルタリングに繰り返しパラメータを一般的に使用しています。

試してみる — URL Parser & Builder

フルツールを開く