繁體中文
選單

Web技術基礎

以三選一題型學習HTTP的請求與回應、方法與狀態碼、標頭與快取控制、HTTP/2與HTTP/3、Cookie與工作階段、JWT、OAuth與OpenID Connect、REST API與URL、JSON、WebSocket與Webhook、DOM與CSS、事件迴圈、同源政策與跨來源資源共用（CORS）、Service Worker、CDN與壓縮、Core Web Vitals、Web伺服器與反向代理，以及SSR、CSR、SSG。

練習10題從本領域隨機抽取10題 · 約5分鐘 練習這個領域以隨機順序出題，涵蓋這個領域的所有題目 弱項題目只重做最近答錯的題目

Web技術基礎的重點

在瀏覽器中開啟URL時，HTTP請求會送達伺服器，瀏覽器再根據回傳的HTML、CSS、JavaScript組成畫面。維持登入狀態的Cookie、與其他服務連結的API、加快顯示的快取與CDN等，Web的機制是由許多技術組合而成的。

本單元學習HTTP請求與回應的形式、方法的安全性與冪等性、狀態碼、以標頭控制快取，以及HTTP/1.1、HTTP/2、HTTP/3的差異。接著介紹以Cookie、工作階段與JWT管理狀態，OAuth 2.0與OpenID Connect，REST API與URL的結構、百分比編碼、JSON，以及WebSocket與Webhook。在瀏覽器方面，介紹DOM、CSS的盒子模型與權重、到首次顯示為止的處理流程、JavaScript的事件迴圈、同源政策與CORS、Service Worker、響應式設計；在傳送方面，則介紹瀏覽器與CDN的快取、壓縮與傳輸時間的計算、Core Web Vitals、影像格式、Web伺服器與應用程式伺服器、反向代理，以及SSR、CSR、SSG。也有助於準備資訊相關證照考試的網路與Web系統領域。TCP/IP、DNS、TLS的機制在「電腦網路基礎」，XSS、CSRF、SQL注入等攻擊與對策在「資訊安全基礎」，負載分散與備援的設計則在「系統架構與可靠度設計」單元中介紹。

Web技術基礎的題目列表（40題）
  1. HTTP/1.1請求的第一行（請求列）所排列的元素組合，下列何者正確？
  2. HTTP方法之中，不是「安全」（不打算改變伺服器上資源的狀態），但屬於「冪等」（同一個請求無論送出幾次，狀態都與送出1次時相同）的是下列何者？
  3. HTTP狀態碼與其意義的組合，下列何者正確？
  4. 在會員制網站上，已登入的一般會員請求了只允許管理者存取的網頁。伺服器已能確認使用者是誰，但不允許存取這個網頁。此時回傳的狀態碼，下列何者最適當？
  5. Web API以JSON格式的資料作為回應本文回傳。為了表示本文的格式而附加在回應上的標頭，下列何者是一般使用的？
  6. 瀏覽器把先前收到之影像的回應中所附的ETag值放進If-None-Match標頭，再次請求該影像。伺服器上的影像沒有改變時，伺服器的回應下列何者正確？
  7. 關於HTTP/2與HTTP/3的說明，下列何者正確？
  8. 從RTT為40 ms的Web伺服器，依序一個一個取得1個HTML以及它所參照的4張影像。假設建立TCP連線需要1個往返，每次請求與回應需要1個往返，並且不考慮資料的傳輸時間、伺服器的處理時間、TLS以及連線的中斷。每個物件都建立新TCP連線的情況，與重複使用一條TCP連線（持續連線）的情況，所需時間的差為下列何者？
  9. HTTP是無狀態的協定。關於這一點以及網站維持登入狀態的一般方法，下列說明何者正確？
  10. 關於以上方標頭設定的Cookie，下列說明何者正確？
  11. 瀏覽器的localStorage與Cookie的差異，下列何者正確？
  12. 在負載平衡器後方放置3台應用程式伺服器，依序把請求分配給各伺服器（循環配置）。已登入使用者的工作階段資訊，只保存在處理登入之伺服器的記憶體中。容易發生的問題與對策的組合，下列何者適當？
  13. 關於一般帶簽章的JWT（JSON Web Token），下列說明何者正確？
  14. 相片沖印服務的應用程式，取得使用者的許可後，讀取使用者存放在另一家公司相片儲存服務中的相片。在OAuth 2.0中，向使用者顯示請求許可的畫面，並在使用者同意後對應用程式發行存取權杖的角色，為下列何者？
  15. 關於OAuth 2.0與OpenID Connect的關係，下列說明何者正確？
  16. 符合REST概念的Web API設計，下列何者適當？
  17. 在瀏覽器中開啟 https://www.example.com:8443/docs/guide.html?lang=ja#install。這個URL中，不包含在送往伺服器的請求裡、只在網頁載入後於瀏覽器內使用的部分，為下列何者？
  18. 為了在URL的查詢中放入日文的「あ」，把這個字元以UTF-8表示的位元組序列（E3 81 82）進行百分比編碼。結果下列何者正確？
  19. 在聊天應用程式中，想把新訊息立即從伺服器送到瀏覽器。關於WebSocket的說明，下列何者正確？
  20. 想讓特約商店的伺服器立即得知線上支付服務的付款已完成。關於支付服務以HTTP的POST，向特約商店事先登錄的URL送出通知的方式（Webhook），下列說明何者正確？
  21. 關於瀏覽器中使用的DOM（Document Object Model），下列說明何者正確？
  22. 套用上方CSS的元素，從左邊框外緣到右邊框外緣的寬度為下列何者？
  23. 假設沒有其他樣式設定。在上方的HTML中，「Hello」文字的顏色為下列何者？
  24. 在瀏覽器顯示第一個畫面之前的處理（關鍵轉譯路徑）中，若<head>中有不加屬性的 <script src="app.js">，HTML的解析就會在那裡停住。為這個元素加上defer屬性時的行為，下列何者正確？
  25. 在瀏覽器中執行上方的JavaScript時，主控台顯示文字的順序，下列何者正確？
  26. 依瀏覽器的同源政策，被視為與 https://www.example.com/app/index.html 同源的URL為下列何者？
  27. https://app.example.com 網頁的JavaScript，要使用fetch對 https://api.example.net/orders 送出附有Content-Type: application/json本文的POST請求。此時跨來源資源共用（CORS）的行為，下列何者正確？
  28. 關於Service Worker的說明，下列何者正確？
  29. 在也支援智慧型手機的響應式設計網頁中，於<head>寫入 <meta name="viewport" content="width=device-width, initial-scale=1"> 的主要目的為下列何者？
  30. 在內容因使用者而異的「我的頁面」回應中，加上Cache-Control: private, max-age=60。這項設定的效果，下列何者正確？
  31. Web伺服器以gzip或Brotli壓縮回應後傳送時，壓縮所減少的傳輸量一般最小的是下列何者？
  32. 把1.5 MB的文字資料以gzip壓縮為3分之1的大小後傳送。頻寬為10 Mbps、RTT為100 ms，在開始傳送資料之前，TCP連線、TLS交握、HTTP請求合計需要3個往返。假設1 MB = 10^6 位元組，並忽略壓縮與解壓縮的時間、標頭，以及TCP壅塞控制造成的等待。到接收完資料為止的時間，最接近下列何者？
  33. 每秒接收2,000個請求的CDN，快取命中率從90%提高到98%。命中時的回應時間為20 ms，未命中時要從原始伺服器取得後回傳，需要200 ms，且只有未命中的請求會送達原始伺服器。提高到98%之後，送達原始伺服器的請求數與平均回應時間的組合為下列何者？
  34. 在表示網頁使用體驗的指標Core Web Vitals之中，CLS（Cumulative Layout Shift）表示的是下列何者？
  35. 網頁所用影像的格式與其一般用途的組合，下列何者適當？
  36. 把3,000位元組的影像資料以Base64編碼後嵌入HTML中。不插入換行時，編碼後的字元數為下列何者？
  37. 以Web伺服器、應用程式伺服器、資料庫伺服器三層構成Web系統。應用程式伺服器主要負責的處理，下列何者適當？
  38. 關於反向代理的說明，下列何者正確？
  39. CGI在Web伺服器每次收到請求時，都以新的行程啟動程式，處理結束後行程就終止。FastCGI或應用程式伺服器的方式，比CGI更能有效率地處理大量請求的主要理由為下列何者？
  40. 製作網站網頁的方式之中，在建置階段就預先產生所有網頁的HTML檔案，對請求直接回傳這些檔案的方式為下列何者？

電腦系統的其他領域