安装Node.js
新建一个文件来放项目，在文件内打开终端进行初始化
npm init安装依赖
- express —— 基于 node.js 平台，快速、开放、极简的 web 开发框架。
- body-parser —— 用来解析表单。
- mysql —— 关系型数据库管理系统。
- cors —— 用来解决跨域问题。
npm install express body-parser mysql cors --save在文件内新建一个文件 app.js 引入依赖开始编写接口
更改后需要重新运行Node.js
/* 引入express框架 */
const express = require('express');
const app = express();
/* 引入cors */
const cors = require('cors');
app.use(cors());
/* 引入body-parser */
const bodyParser = require('body-parser');
app.use(bodyParser.json());
app.use(bodyParser.urlencoded({ extended: false }));
app.all('*', function (req, res, next) {
if (!req.get('Origin')) return next();
// use "*" here to accept any origin
res.set('Access-Control-Allow-Origin', '*');
res.set('Access-Control-Allow-Methods', 'GET');
res.set('Access-Control-Allow-Headers', 'X-Requested-With, Content-Type');
// res.set('Access-Control-Allow-Max-Age', 3600);
if ('OPTIONS' == req.method) return res.send(200);
next();
});
app.get('/', (req, res) => {
res.send('<p style="color:red">服务已启动</p>');
})
app.get('/api/list', (req, res) => {
res.json({
code: 200,
message: '成功',
data: {
list: [
{
id:'1',
name:'张三',
gae:'18'
},
{
id:'2',
name:'李四',
gae:'20'
}
]
}
});
})
/* 监听端口 */
app.listen(3000, () => {
console.log('listen:3000');
})之后就可以调用接口
index.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<script src="https://cdn.jsdelivr.net/npm/axios/dist/axios.min.js"></script>
<body>
<button id="btn1">发起GET请求</button>
</body>
<script>
document.querySelector('#btn1').addEventListener('click', function () {
var url = 'http://localhost:3000/api/list' // 这里设置你本机的ip:端口号
axios.get(url).then(function (res) {
console.log(res.data)
})
})
</script>
</html>