首頁 » » 如何修正刷新時顯示的「確認表單重新提交」訊息

如何修正刷新時顯示的「確認表單重新提交」訊息

「確認表單重新提交」通常不是瀏覽器故障。當您嘗試重新載入透過 HTTP POST 要求提交資料後到達的頁面時，就會出現此提示。重複該請求可能會導致重複操作，因此瀏覽器會在再次發送表單之前進行詢問。這對於聯絡表單、評論、購買、付款、帳戶更改以及任何其他不應意外執行兩次的操作都至關重要。

提交聯絡表單後刷新瀏覽器，顯示「確認表單重新提交」警告。

如果您是訪客，通常最安全的解決方法是避免刷新結果頁面，確認提交是否成功，然後透過網站返回原始表單，而不是強制重新載入頁面。如果您是網站所有者，長久的解決方法是將成功的 POST 請求重新導向到普通的 GET 頁面。

什麼原因會導致確認表單重新提交？

傳統的 HTML 表單可以使用 GET 或 POST 方法傳送資料。 POST 方法會將提交的資料放在請求體中，通常用於建立或變更某些內容的請求。如果伺服器直接回應該 POST 請求並傳回您正在瀏覽的頁面，那麼刷新頁面就意味著重複發送相同的 POST 請求。因此，瀏覽器會在重新發送請求之前發出警告。

這與簡單的連接錯誤不同。即使第一次提交完全成功，也可能出現此警告。在重新提交訂單、付款、預訂、評論或支援請求之前，請檢查確認頁面、電子郵件收據、帳戶歷史記錄或其他表明第一次要求已完成的跡象。

作為網站訪客，如何解決這個問題？

1. 取消重新載入並再次開啟表單

如果在點擊「刷新」後立即出現警告，請選擇「取消」而不是自動繼續。從網站的選單、首頁、書籤或新分頁開啟網站，然後返回表單。這樣可以避免重複發送先前的 POST 請求。

對於較長的消息或申請，請在離開網站前複製所有剩餘文字。網站可能不會在會話變更後恢復您輸入的內容。

聯絡表格會提醒您在重新提交之前複製重要文字。

2. 檢查原始提交是否已成功

請先執行此操作，然後再輸入相同的資訊。如果網站沒有防止重複提交的機制，第二次提交可能會建立重複的評論、工單、預訂或費用。如果您無法確定高額交易是否成功，請使用網站的訂單歷史記錄或聯絡其客服團隊，而不是重複點擊「提交」。

3. 僅當表單確實卡住時才清除站點數據

損壞或過期的 cookie 和快取檔案會導致某些網站出現循環載入、會話遺失或載入舊頁面等問題。清除資料可以解決這些問題，但並非僅僅因為刷新了 POST 請求結果就必須清除資料。

在電腦上的 Chrome 瀏覽器中，開啟三點選單並選擇「刪除瀏覽資料」。谷歌在其Chrome 瀏覽資料指南中記錄了當前的選項，包括 Cookie/網站資料和快取的圖片/檔案。清除 Cookie 可能會導致您退出某些網站，因此請選擇能夠解決問題的最窄範圍進行清除。

Chrome 刪除瀏覽資料對話框（已選擇 Cookie 和快取檔案）

在 Firefox 中，您可以點擊網址列左側的圖示清除目前網站的數據，然後選擇「清除 Cookie 和網站數據」。 Mozilla 的Firefox 網站資料說明也解釋如何刪除特定網站或所有網站的資料。

4. 如果問題意外發生，請暫時停用擴充功能。

如果表單反覆出現問題，且未刷新頁面，請檢查是否存在會修改頁面或網路流量的擴充程序，例如內容攔截器、隱私工具、腳本管理器、VPN/代理擴充功能或表單助理。在 Chrome 瀏覽器中，依序點擊「更多」>「擴充功能」>「管理擴充功能」，暫時關閉可疑的擴充功能；Google 的擴充功能管理指南詳細介紹了目前的控制選項。

Chrome 擴充功能頁面，其中幾個擴充功能暫時關閉

在 Firefox 中，開啟「選單」>「附加元件和主題」>「擴充功能」，然後逐一關閉擴充功能。 Mozilla 也提供了停用 Firefox 附加元件的官方步驟。重新啟用與問題無關的附加元件。

如果警告只出現在一個網站上

如果其他網站運作正常，而此警告在提交特定表單後持續出現，則該網站的表單流程很可能有問題。更換瀏覽器有時可能會暫時掩蓋問題，但並不能修復根本的 POST 請求歷史記錄。請避免重複提交，如有必要，請向網站所有者報告此問題。

網站所有者：使用 POST/重定向/GET

防止表單成功提交後瀏覽器頁面變成目前 POST 請求頁面的標準方法是使用POST/重定向/GET模式。先在伺服器端處理 POST 請求，然後再重新導向到一個單獨的確認 URL。 303 See Other回應會明確指示瀏覽器使用 GET 請求取得重定向後的資源。 MDN 指出，這種模式允許用戶端在提交 POST 請求後查看確認頁面，而無需刷新頁面重複執行原始操作。

POST /contact

HTTP/1.1 303 See Other
Location: /contact/thanks

GET /contact/thanks

請參閱MDN 的 303 See Other 參考文件及其HTTP 重定向指南，以了解方法變更行為。如果您希望後續請求變為 GET 請求，請勿使用 307 重定向，因為 307 重定向會保留原始方法和請求體。

不要僅僅為了消除警告而將所有 POST 表單改為 GET。 GET 用於檢索數據，並且在 HTML 表單中使用時會將表單值放在 URL 中；它不適用於密碼或更改伺服器狀態的操作。 MDN 的表單提交文件解釋了 GET 和 POST 之間的實際差異。

JavaScriptfetch()可以在不進行全頁面導航的情況下提交表單，但伺服器仍然應該保護重要操作免受意外重複請求的影響。對於傳統的多頁面表單，POST/重定向/GET 仍然是解決刷新警告的最直接方法。

(29) 評論

  1. 靜莉 -

    這個主題還蠻需要探討的，特別是在用戶體驗方面

  2. 小姊姊 -

    你們有沒有考慮過加一個 loading 的動畫？這樣使用者會知道正在處理中

  3. 旺仔 -

    我推薦使用AJAX來提交表單，這樣就不會造成重新提交的問題

  4. 貓咪喵喵 -

    我找了很多文章，這篇是最清楚詳細的了，開心！

  5. 牛牛 -

    想請教一下，還有其他方法可以防止表單重新提交嗎？這問題一直困擾著我。

  6. 小貓咪 -

    一開始我不懂為什麼會出現重新提交的問題，現在終於搞清楚了！

  7. Rin Chen -

    有沒有簡單的方式可以知道表單是否已經提交過呢？希望能有好方法分享

  8. 小月亮 -

    表單提交一直是我工作的痛點，太感謝你們的分享了

  9. 阿明 -

    文章中提到的解決方案我之前也用過，但效果還是不太理想，有沒有進一步的幫助

  10. 阿凡達 -

    用戶體驗好不好，表單重新提交真的是一大影響因素，希望能改善！

  11. 阿蘇 -

    太意外了，根本沒有想到這個解決辦法！這樣我就不會再遇到這個錯誤了

  12. 金魚 -

    記得要在表單提交後，馬上清空表單內容，不然容易重複提交喔

  13. Peter Wang -

    這篇文章讓我學到了很多！希望能看到更多類似的技術分享

  14. 小雪 -

    非常感謝這篇文章！我覺得你的解釋很清楚，對我修復錯誤有很大幫助

  15. 小明 -

    這篇文章真的幫了我很多！我一直在煩惱表單重複提交的問題，聽了你的建議終於解決了！謝謝

  16. 林小妹 -

    我之前一直不知道如何處理這個問題，現在我終於找到了答案！感謝分享

  17. 美樂蒂 -

    感覺這個問題真的很常見，能寫這篇文章的人真是太厲害了！

  18. 小青 -

    希望能看到下一篇關於更複雜表單的教程！真的很需要

  19. Kate Nguyen -

    謝謝你的分享，我將會轉發這篇文章給同事！大家都需要學習！

  20. 大龍 -

    表單提交之後要記得把資料清掉，避免不必要的問題出現

  21. 阿土伯 -

    哈哈，這篇真是個救星！之前我常常失敗，真是太煩躁了！

  22. 阿華 -

    看了這篇文章之後，我對刷新頁面時的問題有了更深入的理解。非常實用

  23. 小志 -

    非常好的建議，我會試著實施！表單提交的正確方式真的很重要

  24. 悠悠 -

    我也在測試這些方法，希望能成功，以後不再遇到這個瓶頸

  25. 瑋倫 -

    這篇文章寫得真好！我特別喜歡你提到的使用session的方法，非常有用

  26. 毛毛 -

    我也有同樣的問題，看到這篇文章心情好多了，謝謝你提供的解決方案

  27. 阿強 -

    這篇文章提供了很好的思路，期待未來能看到更多實用的網頁技術

  28. Miki -

    不過有時候我的提交還是偶爾會重複，是不是因為網路問題啊？

  29. 阿美 -

    我有一個小問題，使用 AJAX 的話會不會影響到 SEO

留下評論

使用 FotoSketcher 將照片轉換為繪畫、素描和卡通

使用 FotoSketcher 將照片轉換為繪畫、素描和卡通

使用 FotoSketcher Studio 將照片轉換成繪畫、鉛筆素描或卡通。學習如何選擇效果、調整預覽、保存作品。

使用音訊標識符詳細分析和識別音訊文件

使用音訊標識符詳細分析和識別音訊文件

了解音訊標識符揭示的位元率、編碼器和標籤訊息，其傳統工作流程如何運作，以及當前哪些工具可以檢查文件或識別歌曲。

我的照片索引：一款適用於 Windows 的開源照片管理器。

我的照片索引：一款適用於 Windows 的開源照片管理器。

My Photo Index 是一款舊版 Windows 相片目錄管理工具，用於標記、評分和瀏覽本機影像。請查看其文件功能、相容性限制以及一個維護良好的替代方案。

使用屬性變更器變更檔案和資料夾屬性、日期和時間

使用屬性變更器變更檔案和資料夾屬性、日期和時間

學習如何使用屬性變更器安全地編輯 Windows 檔案屬性和時間戳記、更新 JPEG EXIF 照片日期以及預覽批次變更。

如何在 Windows 10 中為每個顯示器設定不同的桌布

如何在 Windows 10 中為每個顯示器設定不同的桌布

為每個 Windows 10 顯示器設定單獨的壁紙，識別顯示器，調整影像適應度，並解決缺少顯示器選擇的問題。

pViewer：一款極簡圖像檢視器和漫畫閱讀器

pViewer：一款極簡圖像檢視器和漫畫閱讀器

了解 pViewer 的功能、照片和漫畫模式的工作原理、應該下載哪個 Windows 版本，以及舊版和重寫版之間的差異。

如何在 Windows 7 和 8 中使用快速鍵切換到下一個桌面背景

如何在 Windows 7 和 8 中使用快速鍵切換到下一個桌面背景

設定 Windows 7 或 8 投影片放映，建立一個小型 VBScript 快捷方式，並指派鍵盤熱鍵來切換到下一張桌布。

NeoDownloader：設定參數並從網站批量下載圖片

NeoDownloader：設定參數並從網站批量下載圖片

學習如何建立 NeoDownloader 專案、選擇爬取範圍、設定映像過濾器和目標位置，以及查看批次下載。

XnConvert：批次應用特效和轉換影像格式

XnConvert：批次應用特效和轉換影像格式

使用 XnConvert 可以批次套用特效、調整照片大小和轉換影像格式。選擇輸出設定、預覽編輯效果並保護您的原始文件。

使用 ManicTime 追蹤工作時間和電腦使用情況

使用 ManicTime 追蹤工作時間和電腦使用情況

了解 ManicTime 如何追蹤應用程式使用情況、活躍時間和空閒時間以及文檔，然後將您的活動歷史記錄轉換為專案標籤和時間表。