如何将 html 数据从节点 js 发送到前端?

Posted

技术标签:

【中文标题】如何将 html 数据从节点 js 发送到前端?【英文标题】:How to send html data from node js to front end? 【发布时间】:2020-07-06 06:37:32 【问题描述】:

我目前正在创建一个应用程序,我使用 MongoDB 存储登录数据,使用 nodejs 创建 API 和前端 JS html 来显示页面。我正在创建用户,我通过 fetch ajax POST 调用将电子邮件 ID 和密码传递给后端节点服务器。在 DB 中创建用户的后端 api 路由。我想在创建用户后重定向到不同的页面。我怎样才能做到这一点?她是我的代码 sn-p。

//前端获取调用

async function  createUser(email , password) 

return fetch("http://localhost:3000/user", 
     

    // Adding method type

    method: "POST", 

    // Adding body or contents to send 

    headers :
        "content-type": "application/json"
    ,

    body: JSON.stringify(
        "userId" : email.value,
        "password" : password.value
    )
);


//后端代码

 app.post('/user', async (req, res) => 

// res.header("Access-Control-Allow-Origin", "*");
// res.header("Access-Control-Allow-Methods", "POST,OPTIONS");
const error = validate(req.body);

if (error) 
return res.status(400).send(error.details[0].message);

let user = await User.findOne(userId : req.body.userId);
if(user) return res.status(400).send("User already registered");

let newUser = new User (
    
        userId : req.body.userId,
        password : req.body.password
    
);

newUser = await newUser.save();
res.redirect('/logged');
//res.send(newUser)
//res.send("<h1>Hi</h1>");
//res.sendFile((path.join(__dirname+'/loggedon.html')));
//res.send("<h1>Hi</h1>");


);

app.get('/logged' , function(req, res)
    res.send("<h1>Hi</h1>");
    // res.setHeader(200 , 'Content-Type' , 'text/html');
    // fs.readFile('./loggedon.html', function(err , data)
    //     res.write("<h1>Hi</h1>");
    // )

);

我正在检查仅发送 HI。但这在本地服务器上可以正常工作。但是我将如何将数据发送到前端。请告诉我。注释行是我已经尝试过的。

【问题讨论】:

【参考方案1】:

res.redirect 发送一个 HTTP 重定向响应,意思是“你从这个 URL 请求了一些数据。你可以从这个 URL 获取它”。

由于您使用 Ajax 发出请求,因此将遵循重定向,请求新 URL,并将结果传递给 Ajax 处理程序。

你还没有编写处理程序(或者,如果你有,你也没有费心将它包含在问题中)所以什么都没有发生。


旁白:需要注意的是,这并不意味着“在主浏览器窗口中加载新 URL”。

只有在最初打算在主浏览器窗口中加载请求时,新 URL 才会加载到主浏览器窗口中。

你的不是。这是一个 Ajax 请求。


可以在 promise 解决时让 Ajax 处理程序为 location 分配一个新值。

坦率地说,如果你想加载一个新页面,我首先会质疑 Ajax 的使用,只是将系统设计为使用常规表单提交,根本不涉及客户端 JS。

【讨论】:

感谢您的回复。我在这方面的初学者水平。我想我会将一个 html 文件发送到前端并渲染它并显示它。但是,在 ajax 中,当承诺得到解决时,我得到了标准响应。即状态码、重定向网址等。所以只想知道如果我想保留我的前端并渲染它,我需要什么。我会在 GitHub 中推送它并在某个时候发送链接。请在这里帮助我。 :) 谢谢 :) 据我了解,只是因为 ajax 只为单页应用程序调用,所以我无法使用 ajax 加载新页面???

以上是关于如何将 html 数据从节点 js 发送到前端?的主要内容,如果未能解决你的问题,请参考以下文章

如何将 JSON 数据从节点 js 脚本发送到不同服务器上的 HTML 文件

如何将innerHTML添加到从节点JS发送的静态文件中?

将数组从异步函数节点 js 发送到 html

套接字 io,节点 js,将图像/文件从服务器发送到客户端的简单示例

如何使用 JWT 从前端(角度 4)将密钥传递到后端(节点 js)

text [从JS获取节点ID]在后端获取节点ID将其发送到前端#drupal #php #hook #node #id