调用了subscribe方法后如何收集数据并作为方法的返回结果返回给前端页面呢,能否提供完整的代码
时间: 2024-03-26 20:38:54 浏览: 21
收集数据并将其作为方法的返回结果返回给前端页面,通常需要使用异步编程技术。这里提供一个简单的示例代码,供参考:
```javascript
// 后端代码
app.post('/subscribe', async (req, res) => {
// 获取前端传递过来的数据
const { email } = req.body;
// 将数据存储到数据库中
await db.collection('subscribers').insertOne({ email });
// 查询最新的订阅列表
const subscribers = await db.collection('subscribers').find().toArray();
// 返回最新的订阅列表
res.json({ subscribers });
});
// 前端代码
async function subscribe(email) {
const response = await fetch('/subscribe', {
method: 'POST',
headers: { 'Content-Type': 'application/json' },
body: JSON.stringify({ email })
});
const data = await response.json();
return data.subscribers;
}
// 在页面中调用 subscribe 方法
subscribe('test@example.com').then(subscribers => {
console.log(subscribers);
});
```
在上面的示例代码中,后端路由 `/subscribe` 接收 POST 请求,将请求体中的 `email` 参数存储到数据库中,然后查询最新的订阅列表并将其作为 JSON 响应返回给前端页面。前端代码中的 `subscribe` 方法使用了 `fetch` API 发送 POST 请求,并将响应中的 `subscribers` 字段作为方法的返回结果返回给调用方。