node入门-学习笔记
node
- 为什么后端要用node, 因为它是js
- js运行时环境
- 主要使用express框架， 能够快速搭建后端服务接口
启动node服务
- 注意切换目录
- 创建package.json，
npm init -y - 安装依赖包
cnpm i -S express body-parser - 启动
node express-run.js - 可以把上面的命令写入package.json，然后
npm run start - 停止
ctrl+C
//package.json
{
"name": "0",
"version": "1.0.0",
"description": "",
"main": "express-run.js",
"scripts": {
"start": "node express-run.js"
},
"keywords": [],
"author": "",
"license": "ISC",
"dependencies": {
"body-parser": "^1.19.0",
"express": "^4.17.1"
}
}
//express-run.js
//加载依赖包
var express = require("express")
var bodyParser = require('body-parser'); //http解析
var app = express();
//跨域处理
var allowCrossDomain = function (req, res, next) {
res.header('Access-Control-Allow-Origin', '*');
res.setHeader('Access-Control-Allow-Methods', '*');
res.setHeader('Access-Control-Allow-Headers', '*');
next();
};
app.use(allowCrossDomain);
app.use(bodyParser.json()); //解析前端发送的json数据
app.use(bodyParser.urlencoded({extended: true})); //解析前端发表单数据
//定义接口 http://localhost:3000/
app.get("/", function(req, res){
res.send('index') //接口返回字符串
})
//启动服务
app.listen(3000, function(){console.log("Server started on port 3000.")});
重构express-run
- 模块化import/export
- es6、babel
- 现在只有一个文件，包装多层套路
- 功能：访问db，记录日志，方便配置, 方便维护
- 支持es6语法需要添加
.babelrc, 配置babel及模块化支持 - 添加
babel-node,它会在运行时使用.babelrc把代码进行编译 cnpm i -S babel-cli babel-preset-env babel-plugin-add-module-exports- 根目录添加入口main.js, 从入口运行
- 需要导出myexpress模块并且把listen方法也要导出到外边去，需要用到
promise，与vue相同 - 若不把listen放到main.js，可能main.js没有执行完就开始监听了。
- node-promise: bluebird,node8.util.promisify
.babelrc文件：
{
"presets": ["env"], //解析es6
"plugins": ["add-module-exports"] //支持export
}
main.js文件
import express from './config/myexpress'
const server = express(); //server.listenAsync ==== promise
//配置文件处理---取端口号---port
const port = 3000;
//xxxx
//xxxx
//xxxx
server.listenAsync(port).then(()=>{
console.log("Server started on port 3000.")
})
//package.json
{
"name": "0",
"version": "1.0.0",
"description": "",
"main": "myexpress.js",
"scripts": {
"start": "babel-node main.js"
},
"keywords": [],
"author": "",
"license": "ISC",
"dependencies": {
"babel-cli": "^6.26.0",
"babel-node": "^0.0.1-security",
"babel-plugin-add-module-exports": "^1.0.2",
"babel-preset-env": "^1.7.0",
"body-parser": "^1.19.0",
"express": "^4.17.1"
}
}
config文件夹下myexpress.js文件：
//导入依赖包
import util from 'util'
import express from 'express'
import bodyParser from 'body-parser'
export default () => {
var app = express();
// 使用promise方式将app.listen导出到外边
app.listenAsync = util.promisify(app.listen); //node8.x提供的
//跨域处理
var allowCrossDomain = function (req, res, next) {
res.header('Access-Control-Allow-Origin', '*');
res.setHeader('Access-Control-Allow-Methods', '*');
res.setHeader('Access-Control-Allow-Headers', '*');
next();
};
app.use(allowCrossDomain);
app.use(bodyParser.json()); //解析前端发送的json数据
app.use(bodyParser.urlencoded({extended: true})); //解析前端发表单数据
//定义接口 http://localhost:3000/
app.get("/", function(req, res){
res.send('index') //接口返回字符串
})
//启动服务
//app.listen(3000, function(){console.log("Server started on port 3000.")});
return app; //返回promise
}
自己模拟接口：（例子）
/**Connect是一个node中间件（middleware）框架。
如果把一个http处理过程比作是污水处理，中间件就像是一层层的过滤网。
每个中间件在http处理过程中通过改写request或（和）response的数据、状态，实现了特定的功能。
中间件就是类似于一个过滤器的东西，在客户端和应用程序之间的一个处理请求和响应的的方法。*/
var connect = require('connect'); //创建连接
var bodyParser = require('body-parser'); //body解析 用于处理 JSON, Raw, Text 和 URL 编码的数据。
var lists = [];
var index = 1; //id
var arr = [
[100, 422, 435, 934, 244, 26, 643],
[324, 663, 300, 934, 325, 325, 626],
[643, 222, 326, 325, 1290, 2664, 364],
[2344, 666, 300, 934, 325, 1330, 1320],
[432, 743, 326, 934, 263, 353, 326]
];
var app = connect()
.use(bodyParser.json()) //JSON解析
.use(bodyParser.urlencoded({extended: true}))
//use()方法还有一个可选的路径字符串，对传入请求的URL的开始匹配。
//use方法来维护一个中间件队列
.use(function (req, res, next) {
//跨域处理
// Website you wish to allow to connect
res.setHeader('Access-Control-Allow-Origin', '*'); //允许任何源
// Request methods you wish to allow
res.setHeader('Access-Control-Allow-Methods', 'GET, POST, OPTIONS, PUT, PATCH, DELETE'); //允许任何方法
// Request headers you wish to allow
res.setHeader('Access-Control-Allow-Headers', '*'); //允许任何类型
res.writeHead(200, {"Content-Type": "text/plain;charset=utf-8"}); //utf-8转码
next(); //next 方法就是一个递归调用
})
.use('/get_table', function(req, res, next) { //获取全选表格数据
var data={
"code": "200",
"msg": "success",
"result": [
{name:'张东阳',sex:'男',city:'香港',check:true,id:1},
{name:'严雷',sex:'男',city:'北京',check:false},
{name:'袁彦彦',sex:'女',city:'湖北',check:false},
{name:'苏方安',sex:'男',city:'广东',check:true},
{name:'余勇',sex:'男',city:'天津',check:false},
{name:'许康',sex:'男',city:'上海',check:false},
{name:'鲁小微',sex:'女',city:'广西',check:false}
]
}
res.end(JSON.stringify(data));
next(); //
})
.use('/get_category', function(req, res, next) { //获取全选表格数据
var data={
"code": "200",
"msg": "success",
"result": [{title:'在线咨询',icon:'icon-shenghuo',color:'#f95730'},
{title:'产品介绍',icon:'icon-11',color:'#fa69b9'},
{title:'活动动态',icon:'icon-jiazheng',color:'#49dacf'},
{title:'限时抢购',icon:'icon-jiaoyu',color:'#908cfd'},
{title:'免费领水果',icon:'icon-jiajujiafang',color:'#92d85c'},
{title:'红包签到',icon:'icon-peizhi',color:'#ab65ab'},
{title:'生活服务',icon:'icon-shengji',color:'#ea4952'},
{title:'充值中心',icon:'icon-xin',color:'#1eb5fb'},
{title:'美食娱乐',icon:'icon-duankailianjie',color:'#ecbe35'}]
}
res.end(JSON.stringify(data));
next(); //
})
.use('/get_tablist', function(req, res, next) {
var data = {
"code": "200",
"msg": "success",
"result": [
{name: '张一',con:'北京'},
{name: '张二',con:'武汉'},
{name: '张三',con:'长沙'},
{name: '张四',con:'南京'},
{name: '张五',con:'重庆'}]
}
res.end(JSON.stringify(data));
next();
})
.use('/tablist', function(req, res, next) { //获取全选表格数据
var data={
"code": "200",
"msg": "success",
"result": [{
date: '2020-03-02',
name: '张三',
address: '上海市普陀区金沙江路 1518 号',
tag: '家'
}, {
date: '2020-03-04',
name: '李四',
address: '北京市海淀区苏家坨乡前沙涧村',
tag: '公司'
}, {
date: '2020-03-01',
name: '王小虎',
address: '王府井世都百货 王府井大街99号B3',
tag: '公司'
}, {
date: '2020-03-13',
name: '李大虎',
address: '北京市海淀区首体南路1号 ',
tag: '家'
},
{
date: '2020-03-14',
name: '周深',
address: '北京市海淀区买卖街40号 ',
tag: '公司'
},
{
date: '2020-03-11',
name: '李可爱',
address: '北京宣武区广安门外大街三义东里东16-2甲8号 ',
tag: '家'
}]
}
res.end(JSON.stringify(data));
next(); //
})
.use('/get_chart', function(req, res, next) { //获取图表数据
var random = arr[parseInt(Math.random()*arr.length)];
var data={
"code": "200",
"msg": "success",
"result": random
}
res.end(JSON.stringify(data));
next();
})
.use('/student_location', function(req, res, next) { //获取全选表格数据
var data={
"code": "200",
"msg": "success",
"result": [
{name:'北京',value:1081},
{name:'上海',value:400},
{name:'湖北',value:280},
{name:'广东',value:450},
{name:'四川',value:46},
{name:'黑龙江',value:3},
{name:'吉林',value:24},
{name:'辽宁',value:5},
{name:'内蒙古',value:14},
{name:'天津',value:26},
{name:'河北',value:110},
{name:'山东',value:153},
{name:'山西',value:35},
{name:'河南',value:26},
{name:'江苏',value:436},
{name:'浙江',value:64},
{name:'福建',value:226},
{name:'台湾',value:15},
{name:'海南',value:54},
{name:'安徽',value:426},
{name:'陕西',value:26},
{name:'重庆',value:150},
{name:'贵州',value:243},
{name:'云南',value:16},
{name:'甘肃',value:2},
{name:'青海',value:5},
{name:'西藏',value:11},
{name:'新疆',value:6}
]
}
res.end(JSON.stringify(data));
next(); //
})
.use('/get_table2', function(req, res, next) { //获取全选表格数据
var data={
"code": "200",
"msg": "success",
"result": [
{data1:576,data2:853,data3:688,data4:589,data5:907,data6:1033,data7:325},
{data1:635,data2:363,data3:437,data4:659,data5:907,data6:378,data7:378},
{data1:364,data2:447,data3:543,data4:745,data5:437,data6:1033,data7:325},
{data1:375,data2:754,data3:754,data4:458,data5:543,data6:464,data7:544},
]
}
res.end(JSON.stringify(data));
next(); //
})
.use('/get_city', function(req, res, next) { //获取city
var data={
"code": "200",
"msg": "success",
"result": [
{
name: "北京",
sub: [
{name: "请选择", sub: []},
{
name: "北京",
sub: [{name: "请选择"}, {name: "东城区"}, {name: "西城区"}, {name: "崇文区"}, {name: "宣武区"}, {name: "朝阳区"}, {name: "海淀区"}, {name: "丰台区"}, {name: "石景山区"}, {name: "房山区"}, {name: "通州区"}, {name: "顺义区"}, {name: "昌平区"}, {name: "大兴区"}, {name: "怀柔区"}, {name: "平谷区"}, {name: "门头沟区"}, {name: "密云县"}, {name: "延庆县"}]
}]
},
{
name: "广东",
sub: [
{name: "请选择", sub: []},
{
name: "广州",
sub: [{name: "请选择"}, {name: "越秀区"}, {name: "荔湾区"}, {name: "海珠区"}, {name: "天河区"}, {name: "白云区"}, {name: "黄埔区"}, {name: "番禺区"}, {name: "花都区"}, {name: "南沙区"}, {name: "萝岗区"}, {name: "增城市"}, {name: "从化市"}]
},
{
name: "深圳",
sub: [{name: "请选择"}, {name: "福田区"}, {name: "罗湖区"}, {name: "南山区"}, {name: "宝安区"}, {name: "龙岗区"}, {name: "盐田区"}]
},
{
name: "珠海",
sub: [{name: "请选择"}, {name: "香洲区"}, {name: "斗门区"}, {name: "金湾区"}],
},
{
name: "汕头",
sub: [{name: "请选择"}, {name: "金平区"}, {name: "濠江区"}, {name: "龙湖区"}, {name: "潮阳区"}, {name: "潮南区"}, {name: "澄海区"}, {name: "南澳县"}]
}]
},
{
name: "上海",
sub: [{name: "请选择", sub: []},
{
name: "上海",
sub: [{name: "请选择"}, {name: "黄浦区"}, {name: "卢湾区"}, {name: "徐汇区"}, {name: "长宁区"}, {name: "静安区"}, {name: "普陀区"}, {name: "闸北区"}, {name: "虹口区"}, {name: "杨浦区"}, {name: "宝山区"}, {name: "闵行区"}, {name: "嘉定区"}, {name: "松江区"}, {name: "金山区"}, {name: "青浦区"}, {name: "南汇区"}, {name: "奉贤区"}, {name: "浦东新区"}, {name: "崇明县"}]
}]
},
{
name: "重庆",
sub: [{name: "请选择", sub: []},
{
name: "重庆",
sub: [{name: "请选择"}, {name: "渝中区"}, {name: "大渡口区"}, {name: "江北区"}, {name: "南岸区"}, {name: "北碚区"}, {name: "渝北区"}, {name: "巴南区"}, {name: "长寿区"}, {name: "双桥区"}, {name: "沙坪坝区"}, {name: "万盛区"}, {name: "万州区"}, {name: "涪陵区"}, {name: "黔江区"}, {name: "永川区"}, {name: "合川区"}, {name: "江津区"}, {name: "九龙坡区"}, {name: "南川区"}, {name: "綦江县"}, {name: "潼南县"}, {name: "荣昌县"}, {name: "璧山县"}, {name: "大足县"}, {name: "铜梁县"}, {name: "梁平县"}, {name: "开县"}, {name: "忠县"}, {name: "城口县"}, {name: "垫江县"}, {name: "武隆县"}, {name: "丰都县"}, {name: "奉节县"}, {name: "云阳县"}, {name: "巫溪县"}, {name: "巫山县"}, {name: "石柱土家族自治县"}, {name: "秀山土家族苗族自治县"}, {name: "酉阳土家族苗族自治县"}, {name: "彭水苗族土家族自治县"}]
}]
},
{
name: "湖北",
sub: [{name: "请选择", sub: []},
{
name: "武汉",
sub: [{name: "请选择"}, {name: "江岸区"}, {name: "武昌区"}, {name: "江汉区"}, {name: "硚口区"}, {name: "汉阳区"}, {name: "青山区"}, {name: "洪山区"}, {name: "东西湖区"}, {name: "汉南区"}, {name: "蔡甸区"}, {name: "江夏区"}, {name: "黄陂区"}, {name: "新洲区"}]
},
{
name: "黄石",
sub: [{name: "请选择"}, {name: "黄石港区"}, {name: "西塞山区"}, {name: "下陆区"}, {name: "铁山区"}, {name: "大冶市"}, {name: "阳新县"}]
},
{
name: "十堰",
sub: [{name: "请选择"}, {name: "张湾区"}, {name: "茅箭区"}, {name: "丹江口市"}, {name: "郧县"}, {name: "竹山县"}, {name: "房县"}, {name: "郧西县"}, {name: "竹溪县"}]
},
{
name: "荆州",
sub: [{name: "请选择"}, {name: "沙市区"}, {name: "荆州区"}, {name: "洪湖市"}, {name: "石首市"}, {name: "松滋市"}, {name: "监利县"}, {name: "公安县"}, {name: "江陵县"}]
},
{
name: "宜昌",
sub: [{name: "请选择"}, {name: "西陵区"}, {name: "伍家岗区"}, {name: "点军区"}, {name: "猇亭区"}, {name: "夷陵区"}, {name: "宜都市"}, {name: "当阳市"}, {name: "枝江市"}, {name: "秭归县"}, {name: "远安县"}, {name: "兴山县"}, {name: "五峰土家族自治县"}, {name: "长阳土家族自治县"}]
},
{
name: "襄樊",
sub: [{name: "请选择"}, {name: "襄城区"}, {name: "樊城区"}, {name: "襄阳区"}, {name: "老河口市"}, {name: "枣阳市"}, {name: "宜城市"}, {name: "南漳县"}, {name: "谷城县"}, {name: "保康县"}]
}]
}]
}
res.end(JSON.stringify(data));
next(); //
})
.use('/get_chart2', function(req, res, next) { //获取疫情地图数据
var data={
"code": "200",
"msg": "success",
"result": [
{
date:"2020-1-26",
definite: 769, //确诊
distrust: 3806 //疑似
},
{
date:"2020-1-27",
definite: 1771,
distrust: 2077
},
{
date:"2020-1-28",
definite: 1459,
distrust: 3248
},
{
date:"2020-1-29",
definite: 1737,
distrust: 4148
},
{
date:"2020-1-30",
definite: 1982,
distrust: 4812
},
{
date:"2020-1-31",
definite: 2102,
distrust: 5019
},
{
date:"2020-2-1",
definite: 2590,
distrust: 4562
},
{
date:"2020-2-2",
definite: 2829,
distrust: 5173
},
{
date:"2020-2-3",
definite: 3235,
distrust: 5072
},
{
date:"2020-2-4",
definite: 3887,
distrust: 3971
},
{
date:"2020-2-5",
definite: 3694,
distrust: 5328
},
{
date:"2020-2-6",
definite: 3151,
distrust: 4833
},
{
date:"2020-2-7",
definite: 3399,
distrust: 4214
},
{
date:"2020-2-8",
definite: 2653,
distrust: 3916
},
{
date:"2020-2-9",
definite: 3073,
distrust: 4008
},
{
date:"2020-2-10",
definite: 2484,
distrust: 3536
},
{
date:"2020-2-11",
definite: 2022,
distrust: 3342
},
{
date:"2020-2-12",
definite: 15153,
distrust: 2807
},
{
date:"2020-2-13",
definite: 5093,
distrust: 2450
},
{
date:"2020-2-14",
definite: 2644,
distrust: 2277
},
{
date:"2020-2-15",
definite: 2009,
distrust: 1918
},
{
date:"2020-2-16",
definite: 2051,
distrust: 1563
},
{
date:"2020-2-17",
definite: 1891,
distrust: 1432
},
{
date:"2020-2-18",
definite: 1751,
distrust: 1185
},
{
date:"2020-2-19",
definite: 825,
distrust: 1277
},
{
date:"2020-2-20",
definite: 892,
distrust: 1614
},
{
date:"2020-2-21",
definite: 399,
distrust: 1614
},
{
date:"2020-2-22",
definite: 649,
distrust: 882
},
{
date:"2020-2-23",
definite: 416,
distrust: 620
},
]
}
res.end(JSON.stringify(data));
next(); //
})
.use('/get_lists', function(req, res, next) { //获取图表数据
var data={
"code": "200",
"msg": "success",
"result": [
{
name:'家用电器',
icon:'icon-shenghuo',
subItems:[
{name:'电视'},
{name:'空调'},
{name:'洗衣机'},
{name:'冰箱'}
]
},
{
name:'电脑/办公',
icon:'icon-jiajujiafang',
subItems:[
{name:'电脑整机'},
{name:'电脑配件'},
{name:'外设产品'}
]
},
{
name:'食品/酒类/生鲜',
icon:'icon-licai',
subItems:[
{name:'新鲜水果'},
{name:'蔬菜蛋品'},
{name:'海鲜水产'}
]
},
{
name:'手机/数码',
icon:'icon-11',
subItems:[
{name:'手机通讯'},
{name:'运营商'},
{name:'数码配件'},
{name:'手机配件'}
]
},
{
name:'理财/众筹/白条',
icon:'icon-jiaoyu',
subItems:[
{name:'理财'},
{name:'众筹'},
{name:'东家'},
{name:'白条'}
]
}
]
}
res.end(JSON.stringify(data));
next();
})
.use('/form_login', function(req, res, next) {
var data;
if(req.method=='POST') {
if(req.body.mobile=='13987654321'&&req.body.password=='admin123'){
data = {"code":200,"msg":"success"};
}else{
data = {"code":201,"msg":"用户名&密码不匹配"};
}
res.end(JSON.stringify(data));
} else {
res.end(JSON.stringify({}));
}
next(); //
})
.use('/form_register', function(req, res, next) {
var data = {"code":200,"msg":"success"}
if(req.method=='POST') {
res.end(JSON.stringify(data));
} else {
res.end(JSON.stringify({}));
}
next(); //
})
.use('/get_login', function(req, res, next) {
var data;
if(req.method=='POST') {
if(req.body.user=='admin123'&&req.body.password=='admin123'){
data = {"code":200,"msg":"success"};
}else{
data = {"code":201,"msg":"用户名&密码不匹配"};
}
res.end(JSON.stringify(data));
} else {
res.end(JSON.stringify({}));
}
next(); //
})
.use('/get_nav', function(req, res, next) {
var data={
"code": "200",
"msg": "success",
"result": [
{
name:'首页',
icon:'icon-yonghu',
url:'/index',
child:[]
},
{name:'数据统计',
icon:'icon-jiaoyu',
url:'/stats',
},
{name:'信息管理',
icon:'icon-11',
url:'/wms',
child:[
{name:'列表展示',url:'/wms/list'}
]
},
{name:'用户管理',
icon:'icon-xin',
url:'/user',
child:[
{name:'用户统计',url:'/user/stats'},
{name:'角色统计',url:'/user/role'}
]
}
]
}
res.end(JSON.stringify(data));
next();
})
.use('/list_get', function(req, res, next) {
var data={
"code": "200",
"msg": "success",
"result": lists
}
res.end(JSON.stringify(data));
next(); //
})
.use('/list_add', function(req, res, next) {
if(req.method=='POST') {
console.log(req.body.name);
lists.push({name:req.body.name,state:req.body.state,id:index++});
console.log(lists);
var data = {"code":200,"msg":"success"};
res.end(JSON.stringify(data));
} else {
res.end(JSON.stringify({}));
}
next(); //
})
.use('/list_del', function(req, res, next) {
console.log(req.body.id);
for(var i=0; i<lists.length;i++){
if(req.body.id==lists[i].id){
lists.splice(i,1)
}
}
console.log(lists);
var data = {"code":200,"msg":"success"};
res.end(JSON.stringify(data));
})
.listen(3333);
console.log('Server started on port 3333.');
877
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
