Query String Parser

Query String（查詢字串）是 URL 中 ? 之後的部分，用於向伺服器傳遞參數。它由一或多個 key=value 組成，多個參數之間用 & 分隔。

範例：
https://example.com/search?q=hello&page=2&sort=desc

其中 Query String 為 q=hello&page=2&sort=desc，包含三個參數：q（搜尋關鍵字）、page（頁碼）、sort（排序方式）。

Query String 是 HTTP GET 請求中最常見的參數傳遞方式，廣泛應用於搜尋、篩選、分頁、追蹤等場景。

GET 請求將參數放在 URL 的 Query String 中（?key=value），優點是：
• 可加入書籤、可直接分享網址
• 瀏覽器可快取
• 適合搜尋、導航等無副作用操作

POST 請求將參數放在 HTTP Request Body 中，優點是：
• 參數不會顯示在 URL 中，安全性較高
• 可傳送大量資料（無長度限制）
• 支援多種 Content-Type（JSON、Form、Multipart）
• 適合登入、表單提交等有副作用的操作

實務建議：查詢、讀取類操作用 GET；新增、修改、刪除類操作用 POST（或 PUT/DELETE）。對於敏感資料，一律使用 POST 或 HTTPS。

URL Encode（又稱 Percent-Encoding）是將 URL 中的特殊字元轉換為 % 加上兩位十六進位碼的機制。

為什麼需要編碼？因為 URL 中某些字元具有特殊含義：
• ? → 開始 Query String
• & → 分隔參數
• = → 分隔 Key 和 Value
• # → 開始 Fragment
• 空格 → URL 中不允許

如果參數值中包含這些字元，就必須進行編碼：
• "hello world" → hello%20world
• "100% done" → 100%25%20done
• "a&b=1" → a%26b%3D1

JavaScript 中可以使用 encodeURIComponent() 和 decodeURIComponent() 進行編解碼。

以下是設計 Query Parameters 的建議：

1. 使用一致的名稱慣例
推薦 camelCase（sortBy）或 snake_case（sort_by），選擇一種並保持一致。

2. 參數名稱要具描述性
✅ sortOrder=desc ❌ s=d

3. 避免 URL 過長
瀏覽器對 URL 長度有限制（約 2000~8000 字元），過多的 Query Parameters 可能導致請求失敗。

4. 不要傳送敏感資訊
Query String 會出現在瀏覽器歷史、伺服器日誌、Referer 標頭中。密碼、Token 等敏感資料不應放在 Query String 中。

5. 對特殊字元進行 URL Encode
確保參數值中的特殊字元已被正確編碼，避免解析錯誤。

6. 考慮使用陣列格式
對於多值參數，使用 key[]=val1&key[]=val2 或 key=val1,val2 等明確格式。

是的，URL 有長度限制。但這個限制並非來自 HTTP 協定本身（RFC 並未規定 URL 最大長度），而是來自瀏覽器和伺服器的實作限制：

• Internet Explorer：約 2,048 字元（最嚴格）
• Chrome：約 64,000 字元
• Firefox：約 64,000 字元
• Safari：約 64,000 字元
• Apache/Nginx 伺服器：預設約 8,000 字元

實務建議：為了確保最大的相容性，建議將 URL 長度控制在 2,000 字元以內。如果需要傳送大量資料，應改用 POST 請求並將資料放在 Request Body 中。

Query String 本質上是 flat（扁平）的鍵值對結構，但可以透過命名慣例來模擬陣列和巢狀物件：

陣列格式（多種常見做法）：
• tag=tech&tag=dev — 重複 Key（最常見）
• tag[]=tech&tag[]=dev — PHP 風格
• tag=tech,dev — 逗號分隔

巢狀物件（多種常見做法）：
• filter[category]=books&filter[price]=10-20 — PHP/Rails 風格
• filter.category=books&filter.price=10-20 — 點分隔

不同的後端框架對巢狀 Query String 的解析方式不同。本工具以最通用的扁平鍵值對 Key/Value 進行解析。如需處理巢狀結構，建議使用 JSON 格式傳遞。

完全不會。本工具是純前端應用，所有的 Query String 解析、編輯、編解碼和格式轉換都在您的瀏覽器中本地完成，沒有任何資料被傳送到伺服器。即使離線狀態下也能正常運作。