发送locale.storage电子邮件和新的电子邮件axios发布请求

Question

我正在尝试更改当前登录用户的电子邮件。

基本上我有一个字段，在这里我输入我的"；新的"；电子邮件(组件代码(：

 const [email, setEmail] = useState("");
.........
                        
 <input type="email" placeholder={user.email} onChange={(e) => setEmail(e.target.value)}/>

我的axios在组件中发布请求：

const changeEmail = async () => {
            try {
                const res = await axios.post("/auth/change/", {
                    email: email
                }, {
                    headers: {
                        token:
                            "Bearer "+JSON.parse(localStorage.getItem("user")).accessToken,
                    },
                }).then(r => console.log(r)).catch(err => console.log(err))
            } catch (err) {
                console.log(err);
            }
        };

我当前的服务器/routes/auth.js:

router.post("/change", verify , async (req, res) => {
    if(req.body.email === '' || !(req.body.email.match(/^w+([.-]?w+)*@w+([.-]?w+)*(.w{2,3})+$/g))){
        res.status(400).json("Email not valid")
    }
    try {
        User.findOne({
            where: {
                email: JSON.parse(localStorage.getItem("user")).email
            },
        }).then((user) => {
            if(user === null) {
                console.log("email not in db")
                res.status(403).json("Email not valid")
            } else {
;               user.update({
                email : req.body.email
                })
            }
        })
    } catch (err) {
        console.log(err)
        res.status(500).json(err);
    }
});

我的想法是在数据库中搜索locale.storage电子邮件，如果找到了，则使用在useState中设置的电子邮件更新用户。但显然，区域设置存储在api中不可用。是否有将旧的和新的电子邮件发送到api中的post请求？

Answer 1

您可以在客户端代码中从localStorage获得用户的电子邮件，就像您获得令牌一样。

const changeEmail = async () => {
 try {
    const res = await axios
    .post(
        "/auth/change/",
        {
        email: email,
        old_email: JSON.parse(localStorage.getItem("user")).email
        },
        {
        headers: {
            token:
            "Bearer " + JSON.parse(localStorage.getItem("user")).accessToken,
        },
        }
    )
    .then((r) => console.log(r))
    .catch((err) => console.log(err));
  } catch (err) {
    console.log(err);
 }
};

并将api处理程序更改为这些(在这里，我们试图从旧电子邮件中获取用户，如果找到，则更新用户电子邮件(

   router.post("/change", verify, async (req, res) => {
    if (
        req.body.email === "" ||
        !req.body.email.match(/^w+([.-]?w+)*@w+([.-]?w+)*(.w{2,3})+$/g)
    ) {
        res.status(400).json("Email not valid");
    }
    try {
        User.findOne({
        where: {
            email: req.body.old_email,
        },
        }).then((user) => {
        if (user === null) {
            console.log("email not in db");
            res.status(403).json("Email not valid");
        } else {
            user.update({
            email: req.body.email,
            });
        }
        });
    } catch (err) {
        console.log(err);
        res.status(500).json(err);
    }
  });

不要忘记在更新用户电子邮件后更新localStorage，否则它将处于不一致的阶段。