workshopper-browser-guide

Version:

Create an html browser version of the exercise descriptions

github.com/finnp/workshopper-browser-guide

finnp/workshopper-browser-guide

108 lines (102 loc) • 5.39 kB

HTML

<!doctype html> <html class="no-js" lang="zh-tw"> <head> <meta charset="utf-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <title>learnyounode Guide</title> <meta name="description" content="learn git and github"> <meta name="viewport" content="width=device-width, initial-scale=1"> <link rel="stylesheet" href="assets/css/style.css"> <link rel="stylesheet" href="assets/css/code.css"> <link href='assets/fonts/fonts.css' rel='stylesheet' type='text/css'> </head> <body>  <header class="site-header"> <div class="nav u-posFixed"> <ul class="nav-lang"> <li><a href="http_json_api_server.html" >English</a></li> <li><a href="http_json_api_server.es.html" >Español</a></li> <li><a href="http_json_api_server.ja.html" >日本語</a></li> <li><a href="http_json_api_server.pt-br.html" >Português (Brasil)</a></li> <li><a href="http_json_api_server.ru.html" >Русский</a></li> <li><a href="http_json_api_server.zh-cn.html" >中文 (中国)</a></li> <li><a href="http_json_api_server.zh-tw.html" >中文 (臺灣)</a></li> </ul> <div class="wrap-width u-textCenter"> <a href="http_uppercaserer.zh-tw.html" <span class="u-floatLeft hand">☜</span> </a> <a class="filledblock" href="index.zh-tw.html">learnyounode</a> <a href="index.zh-tw.html" <span class="u-floatRight hand">☞</span> </a> </div> </div> <div class="wrapper"> <div class="u-floatLeft"> <span class="all-caps">CHALLENGE</span> <h2 class="challenge-name">HTTP JSON API SERVER</h2> </div> <div class="u-floatRight u-textRight"> <span class="all-caps">NUMBER</span> <h2 class="challenge-name">13 / 13</h2> </div> </div> </header> <div class="wrapper"> <p>撰寫一個 HTTP <strong>伺服器</strong> ，當伺服器收到路徑「/api/parsetime」的 GET 請求時，要回應 JSON 格式的資料。這個請求會包含一個 query ， key 是「iso」，值是 ISO 格式的時間。</p> <p>如下例：</p> <p> /api/parsetime?iso=2013-08-10T12:10:15.474Z</p> <p>回應的 JSON 應該只包含三個屬性：「hour」、「minute」及「second」。舉例來說：</p> <pre><code class="lang-json">{ <span class="hljs-string">"hour"</span>: <span class="hljs-number">14</span>, <span class="hljs-string">"minute"</span>: <span class="hljs-number">23</span>, <span class="hljs-string">"second"</span>: <span class="hljs-number">15</span> } </code></pre> <p>您還要加入第二個可以接受相同 query ，但這次在「unixtime」屬性下回應 UNIX 時間格式（又稱為 epoch 或 POSIX 時間格式）的路徑「/api/unixtime」。 </p> <pre><code class="lang-json">{ <span class="hljs-string">"unixtime"</span>: <span class="hljs-number">1376136615474</span> } </code></pre> <p>您的伺服器應該持續監聽在第一個參數提供的 port 上。</p> <hr> <h2 id="-">提示</h2> <p>來自 HTTP 伺服器的 <code>request</code> 物件會擁有一個 <code>url</code> 屬性，您可以使用這個屬性判斷請求究竟是針對哪個路徑。</p> <p>您可以使用 Node 核心模組 url 來解析 query 和網址。 <code>url.parse(request.url, true)</code> 會解析 request.url 的內容，並提供您一個擁有好用屬性的物件。</p> <p>舉例來說，在命令列中輸入：</p> <pre><code class="lang-sh">$ node -pe <span class="hljs-string">"require('url').parse('/test?q=1', true)"</span> </code></pre> <p>要閱讀 <code>url</code> 模組的文件，可以在瀏覽器中打開這個頁面：</p> <p>Documentation on the <code>url</code> module can be found by pointing your browser here: <a href="../node_apidoc/url.html">/node_apidoc/url.html</a></p> <p>您的回應應該是 JSON 格式。要了解更多資訊，可以參考 <code>JSON.stringify()</code> 。</p> <p>您也應該做個網路上的好公民，回應 Content-Type 屬性：</p> <pre><code class="lang-js">res.writeHead(<span class="hljs-number">200</span>, { <span class="hljs-string">'Content-Type'</span>: <span class="hljs-string">'application/json'</span> }) </code></pre> <p>Javascript 的 <code>Date</code> 物件可以用 ISO 格式顯示日期，如 <code>new Date().toISOString()</code> 。如果您把日期字串傳入 <code>Date</code> 物件，這個物件也可以用來解析時間格式。 <code>Date.getTime()</code> 也可以派上用場。</p> <hr> <div class="prenext"> <div class="u-floatLeft"> <a href="http_uppercaserer.zh-tw.html" class="u-inline-block all-caps">HTTP UPPERCASERER <div>⤶ </div> </a> </div> <div class="u-textRight u-floatRight"> <a href="index.zh-tw.html" class="u-inlineBlock all-caps"> <div>⤷</div> </a> </div> </div> <footer>  </footer> </div> </body> </html>