如何用Node实现前后端交互 - 问答

要使用Node.js实现前后端交互，可以使用Express框架来处理HTTP请求和响应。以下是一个简单的示例：

首先，确保你已经安装了Node.js和Express框架，并创建一个新的项目文件夹。
在项目文件夹中创建一个server.js文件，并编写以下代码：

const express = require('express');
const app = express();

// 设置静态文件夹
app.use(express.static('public'));

// 处理GET请求
app.get('/api/data', (req, res) => {
  res.json({ message: 'Hello from the server!' });
});

// 启动服务器
const PORT = 3000;
app.listen(PORT, () => {
  console.log(`Server is running on http://localhost:${PORT}`);
});

在项目文件夹中创建一个public文件夹，并在其中创建一个index.html文件，用于前端页面。
在index.html文件中编写以下代码：

<!DOCTYPE html>
<html>
<head>
  <title>Frontend</title>
</head>
<body>
  <h1>Frontend</h1>
  <button onclick="getData()">Get Data</button>
  <div id="data"></div>

  <script>
    async function getData() {
      const response = await fetch('/api/data');
      const data = await response.json();
      document.getElementById('data').innerText = data.message;
    }
  </script>
</body>
</html>

在命令行中进入项目文件夹，运行node server.js启动服务器。
在浏览器中打开http://localhost:3000，点击按钮可以通过前端页面发起GET请求获取来自服务器的数据。

通过以上步骤，你就可以用Node.js实现前后端交互了。在实际项目中，你可以根据需要添加更多的路由和处理逻辑来实现更复杂的交互功能。

0 赞

0 踩