HTTP 學習筆記

# 前言

身為一名非本科後端工程師, 如果只會開發, 連網路的全貌都看不清的話, 那也太遜了吧？

其實每個人興趣都不同, 上面跟大家開個小玩笑, Ray 豈敢在眾大神面前造次？

本篇主要是 HTTP 的學習筆記, 所以不會分什麼章節, 會直接以最原始的 Q & A 的形式把知識記錄下來

# 參考書目

• HTTP: The Definitive Guide
• MDN web docs
• 網路

# Questions and Answers

HTTP CORS 當中, 當我 Access-Control-Allow-Origin 不是使用 wildcard, 而是指定一個特定的 origin, 並且這個 origin 可能會變動時, 需要加上 vary header 如下 example, 為什麼？

• Example:

  Access-Control-Allow-Origin: https://mozilla.org
  Vary: Origin

• Answer:
  防止 browser cache

HTTP CORS 當中, 當 server side 要定義允許的 header 時, 可使用哪個 header?

Access-Control-Expose-Headers: X-My-Custom-Header, X-Another-Custom-Headers

HTTP CORS 當中, 當 request 的 header 帶著 cookie 時, server side 的 Access-Control-Allow-Origin, 必須要設為什麼, 可設為 * 嗎？

要有明確的 origin, 不可設為 *

HTTP CORS 當中, 當 request 為帶著 cookie 的 simple request 時, 如果 server side 的 response 少了哪個 header, 瀏覽器會 reject 這個 response？

Access-Control-Allow-Credentials: true

HTTP CORS 當中, 下面的 header 意思是？

• Example:

  Access-Control-Allow-Origin: http://foo.example
  Access-Control-Allow-Methods: POST, GET, OPTIONS
  Access-Control-Allow-Headers: X-PINGOTHER, Content-Type
  Access-Control-Max-Age: 86400

• Answer:

  // 允許的來源
  Access-Control-Allow-Origin: http://foo.example
  // 允許的 method
  Access-Control-Allow-Methods: POST, GET, OPTIONS
  // 允許的 header
  Access-Control-Allow-Headers: X-PINGOTHER, Content-Type
  // 回給此 preflight request 的 response 將會 cache 多久, 意思就是在此時間內不需在發 preflight
  Access-Control-Max-Age: 86400

HTTP CORS 當中, 對於 server 端來說, 如果要允許任何 domain 都可以存取資源, 需要定義哪一個 header?

Access-Control-Allow-Origin:*

HTTP CORS 當中, 哪三種 content type 符合 simple request?

• application/x-www-form-urlencoded
• mutipart/form-data
• text/plain

HTTP CORS 當中, 哪三種 HTTP method 符合 simple request?

• GET
• HEAD
• POST

HTTP CORS 當中, 若 client 與 server 不同源, 在真正的 client request 之前, Browser 會發一個什麼 request 來取得 server side 允許非同源的各項要求？

option request

HTTP CORS 當中, ORIGIN 由哪三樣定義?

• domain
• protocol
• port

request 的 content/type 中, application/x-www-form-urlencoded 會將所有的參數都視為甚麼型別？？

string

request 的 content/type 中, application/json vs application/x-www-form-urlencoded, 最大的差異是？

型別

request 的 content/type 中, application/json 每次都會發送 preflight request, 為什麼？

因為不在 CORS simple request 的 scope 內

request 的 content/type 中, application/json vs application/x-www-form-urlencoded, 哪種的字元數較節省？

application/json

request 的 content/type 中, application/json vs application/x-www-form-urlencoded, 哪種格式較為複雜？

application/x-www-form-urlencoded

request 的 content/type 中, application/json vs application/x-www-form-urlencoded, 哪種較為被大公司使用？

application/x-www-form-urlencoded

request 的 content/type 中, application/json vs application/x-www-form-urlencoded, 哪種不在 CORS 的 simple request scope 內？

application/json

當我在 http://test.com, 但其中一個按鈕的動作如下 example code, 它的意思是？

• Example:

  <iframe style="display:none" name="csrf-frame"></iframe>
  <form method='POST' action='https://small-min.blog.com/delete' target="csrf-frame" id="csrf-form">
    <input type='hidden' name='id' value='3'>
    <input type='submit' value='submit'>
  </form>
  <script>document.getElementById("csrf-form").submit()</script>

• Answer:
  是 CSRF attack
  按下按鈕後, 會執行 form 的 POST, 刪除 https://small-min.blog.com 網站的 id 3, 但因為 target 是 name 為 csrf-frame 的 iframe, 而 iframe 的 style 為 display:none, 所以使用者不會發現有什麼異常

防範 CSRF 的方法中, 何謂 Double Submit Cookie?

由 server 產生一組隨機的 token, 同時也讓 client side 設定一個名叫 csrftoken 的 cookie, 值也是同一組 token。
當使用者按下 submit 的時候，server 比對 cookie 內的 csrftoken 與 form 裡面的 csrftoken, 檢查是否相等
假設現在攻擊者想要攻擊，他可以隨便在 form 裡面寫一個 csrf token，這當然沒問題，可是因為瀏覽器的限制，他並不能在他的 domain 設定 small-min.blog.com 的 cookie 啊！所以他發上來的 request 的 cookie 裡面就沒有 csrftoken，就會被擋下來。

防範 CSRF 的方法中, 當我今天是 SPA 架構時, 如何實施 Double Submit Cookie?

由 client 端產生一個 token 寫到 form, 也將這個 token 寫到 cookie, 當 server 端收到 request 後, 同時驗證 request 跟 cookie 內的 token 是否相同
如果是第三方送出 request 的話, 他或許可以自己在 request 中生成 token, 但他猜不到 cookie 中的 token, 也無法改變 cookie 的值, 因此可防範 CSRF

JWT token 主要含有哪三大部分？

header, payload, signature, 用 . 串接起來

JWT token 的 header 通常包含哪兩個資訊？

type, algorithm

JWT token 的 header 以及 payload 會使用哪種格式編碼？

base64Url

JWT token 的 signature 如何產生？

將 encoded header, encoded payload, 以及一段自定義的 secret, 用 header 中指定的 algorithm 加密而得

JWT token 的 signature 作用為何？

驗證 JWT token 是否有被更動過, 當 server 端收到後會使用 server 才有的 secret 以及 header 以及 payload, 透過 header 中指定的 algorithm 加密, 如果得到的 signature 與 request 帶上的 signature 一樣, 代表內容沒有被更動過, 要是結果不相符, 要嘛是 header 或 payload 被更動過, 要嘛是 secret 不正確

Browser 中, cookie 可以使用 JS 存取嗎？

驗證 JWT token 是否有被更動過, 當 server 端收到後會使用 server 才有的 secret 以及 header 以及 payload, 透過 header 中指定的 algorithm 加密, 如果得到的 signature 與 request 帶上的 signature 一樣, 代表內容沒有被更動過, 要是結果不相符, 要嘛是 header 或 payload 被更動過, 要嘛是 secret 不正確

JWT token 的 claim 又分為哪三種？

registered claim, public claim, private claim