我想在重新加载时保留后端数据

Question

我创建了一个应用程序，它有一个将数据发送到后端的购物车，现在当我恢复时，我想保留数据并显示与以前相同的数据。

我使用了 PUT 方法而不是 POST，当我从 Firebase 发送和获取数据时，数据在重新加载时被保留并且来自数据库的数据是可见的，但是如果我使用我自己的后端Node.js，我无法在重新加载时获取数据。这是我从后端获取数据的地方。

export const fetchCartData=()=>{
 return async(dispatch)=>{
  const getData= async() =>{
   const response = await fetch('https://localhost:5000/');
   if(!response.ok){
    throw new Error('Something went wrong'); 
   }
   const info=await response.json();
   return info;
};

  try{
   const data= await getData();
   console.log("Here is data from Firebase", data);
   dispatch(order_action.replaceCart({
     items:data.items || [],
     totalQuantity:data.totalQuantity || 0
   }));
  }catch(error){
   dispatch(show_action.showNotification({
     status:"failed",
     title:"Error...",
     message:"Some error occurred."
   }));
  }
 }
}

后端代码是：

const express=require("express");
const bodyParser=require('body-parser');
const cors=require('cors');
const app=express();
app.use(cors());
app.use(bodyParser.json());

app.put("/",function (req,res) {
  const data={
    items:req.body.items,
    totalQuantity:req.body.totalQuantity
  }
console.log(data);
console.log("END");
res.send({data});
})

app.get("/",function (req,res) {
console.log(req.body);
const data={
  items:req.body.items,
  totalQuantity:req.body.totalQuantity
}

res.send({data})
})

app.listen(5000,function () {
console.log("Running on 5000");
})

Answer 1

您可以在浏览器上使用 localStorage，即 client-side。每当购物车有任何变化时，请执行以下步骤：

使用 PUT 方法将数据发送到后端 API 并将其存储在数据库或缓存中（根据您正在处理的网站和用户）。
收到 API 的响应后，更新您的 localStorage 数据。

localStorage.set('cart', JSON.stringify(dataFromAPI));

现在，每次重新加载时，您将始终获得最后更新的购物车数据。

when I send and get data from Firebase, data is preserved on reload and the data from the database is visible

仅供您了解，firebase 是一个数据库，当您保存数据时，它是持久的。现在，在重新加载时，您必须调用 firebase 数据库来取回数据，这就是您在客户端看到数据的原因，否则如果不在本地缓存或保存数据，就无法获取数据。

我想在重新加载时保留后端数据

I want to preserve backend data on reload

node.js

express

reactjs

react-fullstack