--- tags: JS 直播班 - 2023 秋季班 --- # 🏅 Day 30 - HTTP 狀態碼 學會看 HTTP 狀態碼是寫網頁很重要的一個能力，狀態碼所代表的訊息可以讓我們了解一個 HTTP 請求是否已經被完成。同學可以參考 [這篇文章](https://developer.mozilla.org/zh-TW/docs/Web/HTTP/Status) 深入了解狀態碼的種類。 這邊替大家整理一些使用 AJAX 比較常遇到、需要了解的狀態碼訊息： 1. **成功回應（Successful responses, 200–299）** 這區間的狀態碼表示伺服器有成功接收到用戶端要求。以 AJAX 的串接為例，如果回傳的 **status 為 200**，則代表有成功接收到資料。 2. **用戶端錯誤（Client errors, 400–499）** 這區間的狀態碼表示有錯誤發生，且錯誤來自於「用戶端」。以 AJAX 的串接為例， * 回傳的 **status 為 400**，表示遠端伺服器接收到無效語法、無法理解請求，因此需要檢查程式碼有無寫錯的地方。 * 回傳的 **status 為 403**, 表示禁止使用，這代表用戶端沒有訪問權限，因此沒辦法成功串接資料。 * 回傳的 **status 404**，表示找不到檔案資料。 3. **伺服器端錯誤（Server errors, 500–599）** 如果發生狀態碼為 **5xx** 的錯誤，則表示錯誤發生跟「遠端伺服器」有關，此時就需要跟後端工程師進行協調了。 問題 --- > 題目一：在使用 axios 串接 API 的時候，如果 HTTP 狀態碼顯示為 403，則代表有成功接收到資料，請問是正確還是錯誤？如果答案為錯誤，則狀態碼 403 代表什麼訊息，以及成功接收到資料的 HTTP 狀態碼應該為何？ > > 題目二：請問「用戶端錯誤」以及「伺服器端錯誤」的 HTTP 狀態碼各自位於哪個數字區間？可否各自舉一個例子說明？ ## 回報流程 將答案寫在 CodePen 並複製 CodePen 連結貼至底下回報就算完成了喔! 解答位置請參考下圖（需打開程式碼的部分觀看） ![](https://i.imgur.com/vftL5i0.png) <!-- 解答： 題目一: 錯誤，狀態碼 403 代表發生錯誤，表示用戶端沒有訪問權限。成功串接資料的狀態碼回應應該為 status 200。 題目二: 「用戶端錯誤」的區間為 400–499，「伺服器端錯誤」的區間為 500–599 舉例: * 400 -「用戶端錯誤」，表示發送的語法無效，應該檢查程式碼。 * 500 -「伺服器端錯誤」，表示伺服器端發生未知或無法處理的錯誤。 --> 回報區 --- | Discord | CodePen / 答案 | |:---------------------:|:----------------------------------------------------------------------------:| |Joy-chiang |[CodePen](https://codepen.io/fwysphbw-the-vuer/pen/vYbWZop)| |yaoling.liang|[CodePen](https://codepen.io/Yao-Ling-L-/pen/vYbWVLM?editors=1100)| |JUNEW|[CodePen](https://codepen.io/June-W/pen/QWYOXxZ)| |pinyi_9|[CodePen](https://codepen.io/Wpypy/pen/wvNpvxj?editors=1010)| |runweiting|[CodePen](https://codepen.io/weiting14/pen/ExrVxXX)| |銀光菇|[CodePen](https://codepen.io/genesynthesis/pen/OJdzPLE)| |lychee_kk|[CodePen](https://codepen.io/kakakala/pen/XWOVJVN)| |Moreene|[CodePen](https://codepen.io/Moreene/pen/RwvxNxB)| |yuan!|[CodePen](https://codepen.io/townyuan/pen/RwvxNyY)| |kawa|[CodePen](https://codepen.io/z83xji6/pen/ZEwvYMp?editors=1010)| | cest_jessie |[CodePen](https://codepen.io/itsjessiechen/pen/WNPdbKe)| |Helen|[CodePen](https://codepen.io/milkteamonster/pen/jOdYPBy)| | 精靈 | [CodePen](https://codepen.io/justafairy/pen/NWoXqjr) | | yuan2781 |[CodePen](https://codepen.io/ismebir/pen/jOdYPdG)| | Alyce |[CodePen](https://codepen.io/alycehwy/pen/NWoXxKE?editors=0010)| | kuanju27 |[CodePen](https://codepen.io/Eero-Chiao/pen/rNPpxOV)| | Yijing |[CodePen](https://codepen.io/Yi-Jing-71080635/pen/ZEwvQbE)| | Winnie |[CodePen](https://codepen.io/codepen-io-winnie/pen/RwvxrPx?editors=0010)| | Peng |[CodePen](https://codepen.io/H-Peng/pen/xxMpZLd?editors=1010)| | hsu0921 |[CodePen](https://codepen.io/HSUANIN0327/pen/bGzaEWZ)| | dora |[CodePen](https://codepen.io/dorayu/pen/XWOVdbe?editors=1010)| | Uli |[CodePen](https://codepen.io/uli1313/pen/WNPdwpx?editors=1010)| | phyllis |[CodePen](https://codepen.io/gmoxhrmc-the-styleful/pen/MWLryvv)| | RX00 |[CodePen](https://codepen.io/llqzknqv-the-styleful/pen/eYxyZoj)| | Fabio20 |[CodePen](https://codepen.io/fabio7621/pen/dyaJXoP?editors=1010)| | claire |[CodePen](https://codepen.io/yi-wen-chen/pen/dyaJXPy)| |yuling|[Codepen](https://codepen.io/igzdflpu/pen/ExroPaK)| | 風羽 |[CodePen](https://codepen.io/Joy-Huang/pen/ExrogdX?editors=1100)| | ann6212 |[CodePen](https://codepen.io/yqmegupa-the-styleful/pen/vYbpygM)| | Chia Pin |[CodePen](https://codepen.io/joker-cat/pen/VwgymzR)| | celinelinnn |[CodePen](https://codepen.io/celinephoebe/pen/zYeprMw)| | 荷菓かのり |[CodePen](https://codepen.io/oogxwkvw-the-builder/pen/zYepNpV?editors=1010)| | Mattie |[CodePen](https://codepen.io/mattielin/pen/GRzyrmr)| | 保羅 |[CodePen](https://codepen.io/paul-1997/pen/YzBYZjv?editors=0010)| | yu.t_liu |[CodePen](https://codepen.io/YuT200053/pen/LYqeOPK)| | 奔跑吧(GTR150)) |[CodePen](https://codepen.io/Wer-Qwe/pen/dyaJZPb?editors=1111)| | xin |[CodePen](https://codepen.io/Estherrrrrr999/pen/YzBYBPO)| | Ataraxia |[CodePen](https://codepen.io/ataraxia8888/pen/eYxRedZ)| | ⭐️小正 |[CodePen](https://codepen.io/colorgolden/pen/xxMpBax)| | 小夏 |[CodePen](https://codepen.io/michaelhsia/pen/MWLQyLE)| | Oria |[CodePen](https://codepen.io/kajing/pen/OJdQRyQ?editors=1010)| | MY |[CodePen](https://codepen.io/ahmomoz/pen/RwvQGyM)| | 維哲 |[CodePen](https://codepen.io/kwz1202/pen/vYbWdwL)| | damon0323 |[CodePen](https://codepen.io/swk9eny2/pen/jOdZzRK?editors=1010)| | xuan |[CodePen](https://codepen.io/xuan0915/pen/bGzLKvd?editors=1011)| | tanuki5863 |[CodePen](https://codepen.io/tanuki320/pen/PoVQxmz)| | Eden |[Codepen](https://codepen.io/iseden/pen/mdvXaNj)| | gebyman |[Codepen](https://codepen.io/gebyman/pen/qBgxvye?editors=1010)| | Rogan |[Codepen](https://codepen.io/RoganHsu/pen/PoVQgmQ)| | ChrisSQR |[Codepen](https://codepen.io/ChrisSQR/pen/PoVRGeR)| | Jerry |[CodePen](https://codepen.io/ildkosxk-the-encoder/pen/OJdZPYZ?editors=0010)| | 歐陽龍龍#1061 |[Codepen](https://codepen.io/dizzydog-rgb/pen/NWoMbPE)| | Lainie |[Codepen](https://codepen.io/Lainie88/pen/abXGGPz?editors=1011)| | santu0868 |[Codepen](https://codepen.io/HatsumiSan/pen/NWoMzwm)| | Iris |[Codepen](https://codepen.io/iris831206/pen/VwgBMrP)| | nini1202desu |[Codepen](https://codepen.io/tvxq5206/pen/yLZqWgR?editors=0010)| | macihuang |[Codepen](https://codepen.io/macy1215/pen/MWLqYvE)| | bf_tsai |[Codepen](https://codepen.io/BF-Tsai/pen/ZEwMGLV?editors=1010)| | NathanJames |[Codepen](https://codepen.io/ufo060204/pen/MWLPKJJ)| | Rochel |[Codepen](https://codepen.io/rochelwang1205/pen/rNPqJqP)| | Andy |[Codepen](https://codepen.io/andy31342/pen/jOdezbe?editors=1100)| | skypassion5000 |[Codepen](https://codepen.io/skypassion5000/pen/KKJGOZz?editors=0010)| | Dayliy |[Codepen](https://codepen.io/daylily/pen/RwvqZxq)| |阿榮|[Codepen](https://codepen.io/codeitaday/pen/PoVXyKo)| | 辣椒 | [Codepen](https://codepen.io/chilichen118/pen/VwggzxM) | | sponge | [Codepen](https://codepen.io/biunpujm-the-flexboxer/pen/RwvvLKE) | | JasonFu | [Codepen](https://codepen.io/jie-Fu/pen/mdoeJQY) |