【问题标题】:Fetch data from back end to front end after getting it in router from database [closed]从数据库中获取路由器后从后端到前端获取数据[关闭]
【发布时间】:2021-04-25 13:16:07
【问题描述】:

我正在构建一个 mern expo 应用程序登录和登录页面。单击登录按钮时,它应该登录,但我无法从后端获取数据,尽管我已经在路由器 express 中进行了查找查询。我相信我的代码会帮助你更好地理解。

routeSignIn.js

const express = require("express");
const router = express.Router();
const User = require("../models/User");

router.post("/", async (req, res) => {
  User.findOne({ email: req.body.email }).then((user) => {
    if (!user) {
      return res.status(404).json("Email or password is incorrect");
    } else {
      const foundUser = res.json(user);
    }
  });
});
module.exports = router;

服务器.js

const express = require("express");
const app = express();
const mongoose = require("mongoose");

const url = "mongodb://localhost/my-project1";
mongoose.connect(url, { useNewUrlParser: true });

const con = mongoose.connection;

app.use(express.json());

//Router
 const routeSignIn = require("../route/routeSignIn");
 app.use("/getUser", routeSignIn);

con.on("open", () => {
  console.log("Database is connected...");
});

const server = app.listen(3000, () => {
  const { address, port } = server.address();
  console.log(`Server started. Listening at http://${address}:${port}`);
});

这就是问题所在,我无法从路由器获取它

登录.js

  const loginHandle = (email, password) => {
    axios
       //The address here is my laptop IP address, because i wanted to link my mern server with expo server
      .get("http://192.168.29.7:3000/getUser") 
      .then((res) => {
        if (!res) {
          Alert.alert("Invalid User, Username or password is incorrect.");
        }
      })
      .catch((err) => {
        console.log("Error fetching data : ", err);
      });

    if (data.email.length == 0 || data.password.length == 0) {
      Alert.alert("Email or password field cannot be empty");
    }
  };

App.js

const authContext = useMemo(
    () => ({
      signIn: async (email) => {
        const userToken = String(foundUser);
        try {
          await AsyncStorage.setItem("userToken", userToken);
        } catch (err) {
          console.log("SignIn error", err);
        }
        dispatch({ type: "LOGIN", email: email, token: userToken });
      },
    }),
    []
  );

正如您在上面看到的,我想要做的是在路由(在 routeSignIn.js 中)与特定用户之后,我想要获取该数据(来自 signIn.js)并将该数据传递到 App.js 以调度它。请注意,reducers 函数与 dispatch 位于同一文件(App.js)中。

【问题讨论】:

  • 你在哪里使用authContext
  • 在初始化授权上下文的同一个文件中,即App.js

标签: reactjs mongodb express mern reducers


【解决方案1】:

我认为我可以通过您从数据库中发布和检索数据的方式检测到几个问题。

首先,您使用的是axios.get 函数而不是axios.post,并且您将它发布到一个根本不存在的URL ("http://192.168.29.7:3000/getUser")。您将需要使用 "/getUser/login" 之类的东西。还将您的 const 定义为 loginHandle = userData 并在您的 userData 中定义电子邮件为 user.email 和密码为 user.password

在服务器端,您可能希望使用端口 3000 或 5000,看看哪个效果最好,因为有时您可能需要在端口 5000 上运行服务器。

在您的 routeSignIn.js 文件中,请改用 router.post("/login",以便确保您路由到正确的 URL。

我不太确定您的app.js,所以不会对此发表评论。

希望这在某种程度上可以解决您的问题,但我建议您尽可能关注this,当您对 NodeJS 和 React 感到满意时,再自定义代码。

【讨论】:

  • 您好,Kamran,非常感谢您的帮助...我认为我实现代码的方式有问题。你能看看我的source code,看看你能不能帮我想出一个稍微修改/不同/替代的方式让用户在凭据有效的情况下登录。
  • 我建议使用上面的链接并遵循他们的方法,直到您完全理解它,然后您可以自定义代码以满足您的需要。但是,由于它只是一个登录请求(全部在后端完成),您几乎可以使用相同的代码。
猜你喜欢
  • 2020-01-11
  • 1970-01-01
  • 1970-01-01
  • 2021-07-01
  • 2013-11-22
  • 2020-04-06
  • 2019-05-27
  • 1970-01-01
  • 2021-04-08
相关资源
最近更新 更多