目录结构
- login
+ www
ajax.js
user.html.js
server.js
server.js:
const http=require('http');
const fs=require('fs');
const querystring=require('querystring');
const urlLib=require('url');
var users = {};//模拟数据,把接收到的东西放到这里
var server = http.createServer(function(req,res){
//解析数据
var str = '';
req.on('data',function(data){
str += data;
})
req.on('end',function(){
var obj = urlLib.parse(req.url,true);
const url = obj.pathname;
const GET = obj.query;
const POST = querystring.parse(str);
//区分访问文件还是接口
if(url == '/user'){ //接口
switch(GET.act){
case 'reg':
//1.检查用户名是否已经有了
if(users[GET.user]){
res.write('{"ok": false, "msg": "此用户已存在"}');
}else{
//2.插入users
users[GET.user]=GET.pass;
res.write('{"ok": true, "msg": "注册成功"}');
}
break;
case 'login':
//检查用户是否存在
if(users[GET.user] == null){
res.write('{"ok":false,"msg":"此用户不存在"}')
}else if(users[GET.user] != GET.pass){
//检查密码是否正确
res.write('{"ok":false,"msg":"用户名或密码错误"}')
}else{
res.write('{"ok":true,"msg":"登录成功"}')
}
break;
default:
res.write('{"ok":false,"msg":"未知的act"}')
}
res.end()
}else{ //文件
//读取文件
var file_name = './www' + url;
fs.readFile(file_name,function(err,data){
if(err){
res.write('404')
}else{
res.write(data)
}
res.end();
})
}
})
})
server.listen(1377)
user.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>user</title>
<script type="text/javascript" src="ajax.js"></script>
<script type="text/javascript">
window.onload = function(){
var ouser = document.getElementById('user');
var opass = document.getElementById('pwd');
var regBtn = document.getElementById('regBtn');
var loginBtn = document.getElementById('loginBtn');
loginBtn.onclick = function(){
ajax({
url: '/user',
data: {act: 'login',user:ouser.value,pass:opass.value},
type: 'get',
success:function(str){
var json = eval('(' + str + ')');
if(json.ok){
alert('登录成功')
}else{
alert('登录失败' + json.msg)
}
},
error: function(){
alert('通信失败')
}
})
}
regBtn.onclick = function(){
ajax({
url: '/user',
data: {act: 'reg',user:ouser.value,pass:opass.value},
type: 'get',
success:function(str){
var json = eval('(' + str + ')');
if(json.ok){
alert('注册成功')
}else{
alert('注册失败' + json.msg)
}
},
error: function(){
alert('通信失败')
}
})
}
}
</script>
</head>
<body>
用户:<input type="text" id="user"><br>
密码:<input type="password" id="pwd"><br>
<input type="button" value="注册" id="regBtn">
<input type="button" value="登录" id="loginBtn">
</body>
</html>