紀錄工作經驗、相關知識,解決技術相關問題。

HTML, Javascript, jQuery, React, 工作雜談, 未分類, 網站優化

什麼是 Form POST 和 Form GET?

在 HTML 表單提交中,GETPOST 是兩種常見的方法來將表單數據發送到伺服器。這兩種方法在數據傳輸和使用場景上有不同的特點和適用場合。

Form GET 方法

GET 方法將表單數據附加到 URL 的末尾,以查詢字符串的形式發送。例如:

<form method="GET" action="http://example.com/search">
    <input type="text" name="query" placeholder="Search...">
    <input type="submit" value="Go">
</form>

提交此表單時,URL 會變成 http://example.com/search?query=SearchTerm。這種方法的特點包括:

  • 數據可見性:數據在 URL 中可見,適用於不涉及敏感信息的情況。
  • URL 長度限制:URL 有長度限制(約 2048 字符),因此不適合傳輸大量數據。
  • 可書籤:提交結果可被書籤保存和分享。
  • 快取:GET 請求可以被快取,有助於減少伺服器負載。

Form POST 方法

POST 方法將表單數據作為請求主體發送,數據不會顯示在 URL 中。例如:

<form method="POST" action="http://example.com/submit">
    <input type="text" name="username" placeholder="Username">
    <input type="password" name="password" placeholder="Password">
    <input type="submit" value="Submit">
</form>

提交此表單時,數據會隱藏在請求的主體部分。POST 方法的特點包括:

  • 數據安全性:數據不顯示在 URL 中,適用於傳輸敏感信息。
  • 無長度限制:POST 請求沒有數據長度限制,適合傳輸大量數據。
  • 不可書籤:提交結果不可被書籤保存,因為數據不在 URL 中。
  • 數據不快取:POST 請求不會被快取,更適合需要立即處理的數據提交。

POST 支援的數據格式

在使用 POST 方法提交表單數據時,可以使用不同的數據格式,這些格式由 enctype 屬性指定。常見的格式包括:

  • application/x-www-form-urlencoded:這是最常用的表單數據編碼格式,數據會以鍵值對的形式編碼,並在鍵值對之間使用 & 符號分隔。
  • multipart/form-data:這種編碼格式用於需要上傳文件的表單,數據會分成多個部分,每個部分對應一個表單字段。
  • text/plain:這種編碼格式很少使用,數據會以純文本形式傳輸,字段之間使用 \n 分隔​。

使用場景區別

  • GET:適用於查詢類操作,如搜索和過濾,數據可見且可以被書籤保存。
  • POST:適用於提交需要保密的數據,如登錄表單、註冊表單,數據安全且無長度限制(平台間資料傳遞)。

相關參考資料

MDN 介紹 : Sending Form Data
Form Post enctype: W3C

發表迴響