gpt4 book ai didi

node.js - 处理 React 和 Express 之间的路由请求

转载 作者:太空宇宙 更新时间:2023-11-04 01:20:01 24 4
gpt4 key购买 nike

我正在使用 React 和 Express 创建一个具有登录和注册功能的应用程序。我使用 Formik 来处理表单数据并发布它:

> const initialValues={{username:"", email:"", password:""}}
onSubmit ={ async (values, { setSubmitting }) => {
const value = values.username+'/'+values.email+'/'+values.password;
const res = await fetch(`http://localhost:5000/newuser/${value}`, {
method: 'GET',
mode: 'cors',
headers: {
'Content-Type': 'application/json',
'Access-Control-Allow-Origin': '*'
}}).then(response => response.json());
console.log(res);
values = initialValues;
setSubmitting(false);

}

然后将其发送到以下路由的 Express 应用程序:

> app.get('/newuser/:username/:email/:password', (req, res) => {
const username = req.params.username;
const email = req.params.email;
const password = req.params.password;
let sql = `Insert into users (username, useremail, userpass) values ('${username}', '${email}', '${password}')`;
query = db.query(sql, (err, results) => {
if(err){throw err;}
res.send("New user added you can login now");
});

});

我能够将这些用户保存到数据库中,但是我对这段代码有以下两个问题,我可以从各种不同的视频、教程、问题和文档中拼凑出这些问题:

  1. 关于这一行:

app.get('/newuser/:username/:email/:password', (req, res)

这是我可以将表单数据导入到express中的唯一方法,如果我不包含分号并使用req.params调用这些值,我会收到“404未找到错误”,因为这3个值是空的。如果我尝试通过 req.body 访问它们,它们仍然显示为空。我尝试对它们进行 JSON.stringify,并且在 Express 应用程序中使用 body-parser。我的问题是如何使用 req.body 访问这 3 个值(用户名、电子邮件、密码)?如果我想从浏览器访问此路由,还有一种特定的方式应该格式化它们,例如 http://localhost:5000/users?username&email&password

  • 如何将响应发送回 react 应用程序,例如告诉它用户存在并且密码正确?我已经做了mysql查询来检查这一点并更新express中的变量,然后我只需要发送响应,也许是该变量的值,然后告诉react转到索引页。但是 res.send(variable) 似乎没有发送变量进行 react ,并且登录表单在提交后保持停滞状态。
  • 最佳答案

    要访问正文,请使用方法:“POST”而不是GET。

    let response = await fetch(`http://localhost:5000/newUser`, {
    method: 'POST',
    headers: {
    'Accept': 'application/json',
    'Content-Type': 'application/json',
    },
    body: JSON.stringify(values),
    })

    if (response.errors) {
    console.error(response.errors)
    }

    let responseJson = await response.json()

    if (responseJson['message']) {
    console.log(responseJson['message'])
    }

    服务器端使用这样的东西:

    import cors from 'cors'

    ...

    let app = express()
    .use(cors())
    .post('/newUser', (req, res) => {
    let {username, email, password} = req.body
    ...
    // If all ok
    res.status(200).send({message: "User created"})

    // If there's an issue
    res.status(500).send({message: "oups"})
    })
    ...

    关于node.js - 处理 React 和 Express 之间的路由请求,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/59633697/

    24 4 0
    Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
    广告合作:1813099741@qq.com 6ren.com