一、启动服务
1、安装并引入 express
const express = require("express");
2、启动一个 express 的实例(app)
const app = express();
3、app.listen 一个端口,启动一个后台服务
app.listen(8080, () => {
console.log("接口已启动")
});
4、app.get 设置基础的路由,吐出数据
// 平时的请求都是 get 浏览器直接敲
app.get('/query', (req, res) => {
res.send('用户名:'+req.query.username)
});
app.get('/params/:id', (req, res) => {
res.send('id:'+req.params.id)
});
app.get('/json/:id', (req, res) => {
res.json({
id:req.params.id*1
});
});
PS:可以下载一个 supervisor (热更新的包)
二、restful 风格
restful(表现层状态转换)架构风格: 同样的接口竟然能写出两套业务逻辑(接地气的片面理解)
app.js
const express = require("express");
const bodyParser = require("body-parser");
const app = express();
const urlencodedParser = bodyParser.urlencoded({
extended: false
});
app.listen(8080, () => {
console.log("接口已启动")
});
app.use(express.static('./public'));
app.get('/index', (req, res) => {
res.sendFile(__dirname + "/views/" + "index.html")
});
app.post('/index', urlencodedParser, (req, res) => {
res.redirect("https://www.baidu.com/s?ie=utf-8&f=8&rsv_bp=1&rsv_idx=1&tn=baidu&wd="+req.body.data+"%20&rsv_pq=dfa08e9b0015a43f&rsv_t=aa9fHxuyEixgj9Fh%2FNs6I7bGZi7rFgfo1v4I%2BuH9lx1s%2BZZXEbY1GYQ7YJI&rqlang=cn&rsv_enter=1&rsv_dl=tb&rsv_sug3=9&rsv_sug1=2&rsv_sug7=100&rsv_sug2=0&inputT=1177&rsv_sug4=2042");
});
public/css/index.css
div {
width: 100px;
height: 100px;
background: greenyellow;
}
public/js/index.js
const test=()=>{
console.log(123);
};
test();
views/index.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>测试首页</title>
<link rel="stylesheet" href="css/index.css">
</head>
<body>
<div>
123
</div>
<form action="/index" method="post">
<input type="text" name="data">
<input type="submit" value="提交">
</form>
<script src="js/index.js"></script>
</body>
</html>