编写和前端连接代码
时间: 2024-02-17 12:00:11 浏览: 11
要实现与前端的数据交互,后端需要提供相应的API接口,前端通过调用这些接口来获取或提交数据。以下是一个简单的后端API示例,使用Node.js和Express框架实现:
```javascript
const express = require('express');
const bodyParser = require('body-parser');
const app = express();
app.use(bodyParser.json());
app.get('/api/hello', (req, res) => {
const name = req.query.name || 'World';
res.json({ message: `Hello, ${name}!` });
});
app.post('/api/login', (req, res) => {
const { username, password } = req.body;
if (username === 'user' && password === '123456') {
res.json({ success: true });
} else {
res.status(401).json({ error: 'Invalid credentials' });
}
});
app.listen(3000, () => {
console.log('Server is running on port 3000');
});
```
这个后端代码提供了两个API接口,`/api/hello`用于返回问候语,`/api/login`用于验证用户登录。前端可以通过Ajax等方式调用这些接口,如下所示:
```javascript
// 获取问候语
$.ajax({
url: '/api/hello',
success: function(data) {
console.log(data.message); // Hello, World!
}
});
// 登录
$.ajax({
url: '/api/login',
type: 'post',
data: { username: 'user', password: '123456' },
success: function(data) {
console.log(data.success); // true
},
error: function(xhr, status, error) {
console.log(xhr.responseText); // {"error":"Invalid credentials"}
}
});
```
这里使用了jQuery库的`ajax`方法,调用后端API接口。注意,需要根据实际情况修改API接口的URL地址、请求类型、请求参数等。