今天开始准备自己去探索下 node.js 编写接口,让自己朝着全栈逐渐靠近。
写此博客,就是为了记录下自己的探索以及实现过程。
一、安装
- 首先安装 node.js,下载地址。
- 下载完成,打开 cmd 输入 node -v,如果显示出了版本号,证明安装成功。
二、初始化
- 在磁盘中找个合适的位置,创建一个文件夹用来放项目。
- 然后在创建的文件夹根目录打开 cmd 输入 npm init 。
- 初始化完成后,会在文件夹的根目录生成一个 package.json 文件。
三、安装依赖
- express —— 基于 node.js 平台,快速、开放、极简的 web 开发框架。
- body-parser —— 用来解析表单。
- mysql —— 关系型数据库管理系统。
- cors —— 用来解决跨域问题。
npm install express body-parser mysql cors --save
四、起步
- 在文件夹根目录新建一个 index.js 文件。
- 引入依赖后,就可以直接编写接口了。
index.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 }));
-
-
/* 引入mysql */
-
const mysql = require( 'mysql');
-
const conn = mysql.createConnection({
-
host: 'localhost',
-
user: 'root',
-
password: '123456',
-
database: 'test',
-
multipleStatements: true
-
})
-
conn.connect();
-
-
/* 监听端口 */
-
app.listen( 8080, () => {
-
console.log( '——————————服务已启动——————————');
-
})
-
-
app.get( '/', (req, res) => {
-
res.send( '<p style="color:red">服务已启动</p>');
-
})
-
-
app.get( '/api/getUserList', (req, res) => {
-
const sqlStr = 'SELECT * FROM users'
-
conn.query(sqlStr, (error, results) => {
-
if (error) return res.json({ code: 10001, message: error})
-
res.json({ code: 10000, message: results})
-
})
-
})
index.html 代码如下:
-
-
<html lang=“en”>
-
<head>
-
<meta charset=“UTF-8”>
-
<meta name=“viewport” content=“width=device-width, initial-scale=1.0”>
-
<meta http-equiv=“X-UA-Compatible” content=“ie=edge”>
-
<title>node.js编写接口 </title>
-
<script src=“https://cdn.bootcss.com/jquery/3.4.1/jquery.min.js”> </script>
-
</head>
-
<body>
-
-
</body>
-
<script>
-
$( function(){
-
$.get({
-
url: ‘http://localhost:8080/api/getUserList’,
-
data: ‘’,
-
success: function(res){
-
console.log(res);
-
res.message.map( item => {
-
document.write( ’<div>’+ item.id + ‘————’ + item.userName + ’</div>’);
-
})
-
},
-
error: function(error){
-
console.log(error);
-
}
-
})
-
})
-
</script>
-
</html>