用Node編寫RESTful API接口-js教程-PHP中文網

前言

建立HTTP伺服器

設定回應頭

Hello Node

設定狀態碼

建構 RESTful Web 服務

#POST和GET請求

需求分析

前端部分

Todo List

後端部分

小结

首頁

web前端

js教程

用Node編寫RESTful API接口

不言

Jul 07, 2018 pm 06:00 PM

axios html javascript node.js vue.js

這篇文章主要介紹了關於用Node編寫RESTful API接口，有著一定的參考價值，現在分享給大家，有需要的朋友可以參考一下

前言

本文將透過一個todo list前後端分離的小專案來講解如何用Node建立符合RESTful風格的API介面。

建立HTTP伺服器

我們先來了解下如何用Node建立HTTP伺服器（熟悉的讀者可以直接跳過）。
用Node建立HTTP伺服器是非常方便的，建立HTTP伺服器要呼叫http.createServer()函數，它只有一個參數，是個回調函數，伺服器每次收到HTTP請求後都會調用這個回調函數。這個回呼會收到兩個參數，請求和回應對象，通常簡寫為req和res：

var http = require('http')
var server = http.createServer(function(req, res){
   res.end('Hello World')
})
server.listen(3000, '127.0.0.1')

登入後複製

運行上面的程式碼，在瀏覽器中存取http://localhost:3000。然後你應該可以看到一個包含「Hello World.」的普通文字頁面。

伺服器每收到一個HTTP請求，都會用新的req和res物件觸發回呼函數。
在觸發回呼函數之前，Node會解析請求的HTTP頭，並將它們作為req物件的一部分提供給請求回呼。但Node不會在回呼函數被觸發之前開始對請求體的解析。這種做法跟某些服務端框架不同，例如PHP就是在程式邏輯運作前就把請求頭和請求體都解析出來了。

Node不會自動往客戶端寫任何回應。在調用完請求回呼函數之後，就要由你負責用res.end()方法結束回應了（見下圖）。這樣在結束回應之前，你可以在請求的生命期內運行任何你想運行的非同步邏輯。如果你沒能結束回應，請求會掛起，直到客戶端逾時，或者它會一直處於開啟狀態。
用Node編寫RESTful API接口

搭建HTTP伺服器只是個開始。接下來我們來看看如何設定回應狀態碼和回應頭中的字段，如何正確處理異常。

設定回應頭

可以用res.setHeader(field, 值)來設定對應的回應頭，以下是程式碼：

var http = require('http')
var server = http.createServer(function(req, res){
  var body = '<h1 id="Hello-Node">Hello Node</h1>'
  res.setHeader('Content-Length', body.length)
  res.setHeader('Content-Type', 'text/html')
  res.end(body)
})
server.listen(3000)

登入後複製

設定狀態碼

我們常常需要傳回預設狀態碼200以外的HTTP狀態碼。比較常見的情況是當所要求的資源不存在時傳回一個404 Not Found狀態碼。
這可以透過設定res.statusCode屬性來實現。在程式回應期間可以隨時給這個屬性賦值，但必須在第一次呼叫res.write()或res.end()之前。

var http = require('http')
var server = http.createServer(function(req, res) {
  var body = '<p>页面丢失了</p>'
  res.setHeader('Content-Type', 'text/html;charset=utf-8')
  res.statusCode = 404
  res.end(body)
})
server.listen(3000, '127.0.0.1')

登入後複製

Node的策略是提供小而強的網路API，不同於Rails或Django之類的框架。像會話這種進階概念以及HTTP cookies這樣的基礎元件都沒有包括在Node的核心之中。那些都要由第三方模組提供。

建構 RESTful Web 服務

Roy Fielding博士在2000年提出了表徵狀態轉移（REST）。它是一種基於 HTTP 協定的網路應用的介面風格。
依照規定，例如GET、POST、PUT和DELETE，分別與資源的取得、建立、更新和刪除相對應。
HTTP 協定定義了以下8種標準的方法：

GET：請求取得指定資源。
HEAD：請求指定資源的回應頭。
POST：向指定資源提交資料。
PUT：請求伺服器儲存一個資源。
DELETE：請求伺服器刪除指定資源。
TRACE：回顯伺服器收到的請求，主要用於測試或診斷。
CONNECT：HTTP/1.1 協定中預留給能夠將連線改為管道方式的代理伺服器。
OPTIONS：傳回伺服器支援的HTTP請求方法。

建立標準的REST服務需要實作四個HTTP謂詞。每個謂詞會覆寫一個運算：

GET：取得
#POST：新增
PUT：更新
DELETE：刪除

#POST和GET請求

接下來，我們開始寫符合RESTful風格的GET和POST介面。

需求分析

專案決定採用前後端分離，互動資料格式約定為json，前端新增的資料提交到伺服器後，由伺服器存入伺服器記憶體中。前端介面如下：
用Node編寫RESTful API接口

首先，我們先寫前端部分。

前端部分

前端部分採用當今流行的vue.js作為框架，ajax請求採用axios函式庫。程式碼如下：

nbsp;html>


  <meta>
  <title>Title</title>

  <script></script>
  <script></script>




<p>
  </p><h1 id="Todo-List">Todo List</h1>

登入後複製

{{ item }}

後端部分

後端部分將以req.method取得請求的HTTP謂詞，並分情況處理。程式碼如下：

var http = require('http')

var items = []

http.createServer(function(req, res) {
  // 设置cors跨域
  res.setHeader('Access-Control-Allow-Origin', '*')
  res.setHeader('Access-Control-Allow-Headers', 'Content-Type')
  res.setHeader('Content-Type', 'application/json')

  switch (req.method) {
    // 设置了cors跨域
    // post请求时，浏览器会先发一次options请求，如果请求通过，则继续发送正式的post请求
    case 'OPTIONS':
      res.statusCode = 200
      res.end()
      break

    case 'GET':
      let data = JSON.stringify(items)
      res.write(data)
      res.end()
      break

    case 'POST':
      let item = ''
      req.on('data', function (chunk) {
        item += chunk
      })
      req.on('end', function () {
        // 存入
        item = JSON.parse(item)
        items.push(item.item)
        // 返回到客户端
        let data = JSON.stringify(items)
        res.write(data)
        res.end()
      })
      break
  }
}).listen(3000)

console.log('http server is start...')

登入後複製