如何從 React js 向 Node js 發送請求來處理某些東西？

Question

我很抱歉我在標題中提出了這個問題，但我最近才開始編程，所以再一次，我真的很抱歉。

我正在開發一個項目，使用 React js 作為前端，node js 作為后端，我已經成功地進行了一些基本測試 api 調用以確認兩者之間的連接，但是現在，我應該如何實際處理不同的操作. 例如，當用戶登錄時，我需要首先檢查他們是否是現有用戶，如果不是，請登錄，刪除用戶帳戶，更改用戶名等。

我非常努力地尋找相關文章，但我只能找到基本的“一次性” api 調用，我應該為整批操作做什么？ 據我了解，從 React 發送請求到在 Node js 中處理它的過程是這樣的：

react js ======> 
(request for operation) node js ======> 
(process the operation) ======> 
send a response back to react

如果我的問題有任何錯誤，請糾正我......非常感謝！

Answer 1

這個問題真的很廣泛，所以我將重點關注這部分：

我非常努力地尋找相關文章，但我只能找到基本的“一次性” api 調用，我應該為整批操作做什么？

我猜當您談論請求和 API 時，您談論的是 HTTP 請求和 REST API，它們基本上是“無狀態”的東西； HTTP 請求是自包含的，后端不必在請求之間跟蹤任何應用程序 state 以便說出 HTTP。

但后端應用程序通常會維護 state，通常以數據庫的形式。 例如，許多 REST API 公開了重要業務實體的 CRUD（創建、讀取、更新和刪除）操作——事實上，Stack Overflow 可能正是這樣做的答案。 當我發布這個答案時，我的瀏覽器可能會發送某種“創建”請求，當我不可避免地注意到並修復錯字時，我會發送某種“更新”請求。 當您在瀏覽器中加載它時，您將發送一個“讀取”請求，該請求將從 Stack Overflow 的數據庫中獲取答案文本。 Stack Overflow 的后端會跟蹤我在請求之間的回答，這樣就可以將它作為許多不同請求的一部分發送給許多用戶。

如果您的項目執行涉及多個相互依賴的請求的事情，您的前端將不得不做類似的事情 - 例如，您需要跟蹤用戶是否經過身份驗證以便向他們顯示登錄屏幕，並且您需要保留他們的身份驗證令牌以與后續請求一起發送。

---

編輯：讓我們來看一個具體的例子。 作為用戶，我希望能夠創建和閱讀筆記。 每個筆記都應該有一個唯一的 ID 和一個用於其文本的字符串。 在后端，我們將有一組 CRUD 端點：

var express = require(“express”);
var router = express.Router();

class Note {
    constructor(id, text) {
        this.id = id;
        this.text = text;
    }
}

// This is a quick and dirty database!
notes = {};

router.put("/note/:id", function(req, res) {
    notes[req.params.id] = "hello"; // TODO: accept text as well
    res.send("");
});

router.get(“/note/:id”, function(req, res) {
    res.send(notes[req.params.id].text);
});

module.exports = router;

然后在客戶端，可以創建一個便箋，然后像這樣閱讀它：

// this request will create the note
fetch("http://localhost:9000/note/42", { method: 'PUT', body: 'hello note!' });

// this request will read the note, but only after it is created!
fetch("http://localhost:9000/note/42")
        .then(res => res.text())
        .then(res => console.log(res));