express框架
Posted SingSingaSong
tags:
篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了express框架相关的知识，希望对你有一定的参考价值。
const express = require(‘express‘);
var server = express();
server.use(‘/‘,function(req,res){
// 一共两个参数，分别是‘/’（代表访问根目录下的文件），和function(){}
})
server.listen(8080);最基本用法：use
const express = require(‘express‘);
var server = express();
server.use(‘/a.html‘,function(req,res){
res.send(‘abc‘);
res.end();
})
server.use(‘/b.html‘,function(req,res){
res.send(‘123‘);
res.end();
})
server.listen(8080);执行结果:
注意:res.write()是原生的，res.send()是express框架的新方法
比较两者不同：
send是增强版的write。
栗子：
const express = require(‘express‘);
var server = express();
server.use(‘/a.html‘,function(req,res){
res.send({a:12,b:34});
res.end();
})
server.listen(8080);输出结果：
{"a":12,"b":34}
send方法可以显示json，但是write不行：
const express = require(‘express‘);
var server = express();
server.use(‘/a.html‘,function(req,res){
res.write({a:12,b:34});
res.end();
})
server.listen(8080);会报错：TypeError: First argument must be a string or Buffer 必须是字符串或者二进制原始数据
总结：
express保留了原生的功能，添加了一些方法。
基本的用法:
1.创建服务
var server=express();2.监听
server.listen(8080);3.处理请求
server.use(‘地址‘, function (req, res){
});
三种方法
.get(‘/‘, function (req, res){});
.post(‘/‘, function (req, res){});
.use(‘/‘, function (req, res){}); 对post和get方法通吃具体实例
html文件
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
<script src="ajax.js" charset="utf-8"></script>
<script type="text/javascript">
window.onload=function (){
var oUser=document.getElementById(‘user‘);
var oPass=document.getElementById(‘pass‘);
var oBtn=document.getElementById(‘btn1‘);
oBtn.onclick=function (){
ajax({
url: ‘/login‘,
data: {user: oUser.value, pass: oPass.value},
success: function (str){
var json=eval(‘(‘+str+‘)‘);
if(json.ok){
alert(‘登录成功‘);
}else{
alert(‘失败：‘+json.msg);
}
},
error: function (){
alert(‘通信失败‘);
}
});
};
};
window.onload = function(){
var oUser = document.getElementById(‘user‘);
var oPass = document.getElementById(‘pass‘);
var oBtn = document.getElementById(‘btn1‘);
oBtn.onclick=function(){
ajax({
url:‘/login‘,
data:{ user:oUser.value, pass:oPass.value},
success: function(str){ //收到server.js文件中res.send返回的{ok:...,mag:...}的json字符串
var json = eval(‘(‘+str+‘)‘);
if(json.ok){
alert("登录成功");
}else{
alert(‘失败‘+json.msg);
}
}
})
}
}
</script>
</head>
<body>
用户：<input type="text" id="user" /><br>
密码：<input type="password" id="pass" /><br>
<input type="button" value="登录" id="btn1" />
</body>
</html>
提示: eval()解析json字符串时为什么要加上‘(‘+str+‘)‘？
原因: json字符串格式是{},在js中会被默认当做一条语句，加上括号后才会被当做对象。
server.js文件
import { read } from ‘fs‘;
const express = require(‘express‘);
const expressStatic = require(‘express-static‘);
var server = express();
server.listen(8080)
// 用户数据
var users = {
‘张雯‘:‘123‘
}
server.get(‘/login‘,function(req,res){
var user = req.query[‘user‘];
var pass = req.query[‘pass‘];
//
if(users[user]==null){
res.send({ok:false,msg:‘不存在该用户‘})
}else{
if(users[user]!=pass){
res.send({ok:false,msg:‘密码错误‘})
}else{
res.send({ok:true,msg:‘登录成功‘})
}
}
})
// 如果server.get没有获取到数据，就进入这一步
server.use(expressStatic(‘./www‘));ajax.js文件
function json2url(json){
var arr=[];
for(var name in json){
arr.push(name+‘=‘+json[name]);
}
return arr.join(‘&‘);
}
function ajax(json){
json=json || {};
if(!json.url)return;
json.data=json.data || {};
json.type=json.type || ‘get‘;
var timer=null;
if(window.XMLHttpRequest){
var oAjax=new XMLHttpRequest();
}else{
var oAjax=new ActiveXObject(‘Microsoft.XMLHTTP‘);
}
switch(json.type){
case ‘get‘:
oAjax.open(‘GET‘,json.url+‘?‘+json2url(json.data),true);
oAjax.send();
break;
case ‘post‘:
oAjax.open(‘POST‘,json.url,true);
oAjax.setRequestHeader(‘Content-Type‘,‘application/x-www-form-urlencoded‘);
oAjax.send(json2url(json.data));
break;
}
oAjax.onreadystatechange=function(){
if(oAjax.readyState==4){
clearTimeout(timer);
if(oAjax.status>=200 && oAjax.status<300 || oAjax.status==304){
json.success && json.success(oAjax.responseText);
}else{
json.error && json.error(oAjax.status);
}
}
};
}
以上是关于express框架的主要内容，如果未能解决你的问题，请参考以下文章
Express4.10.2开发框架中默认app.js的代码注释