html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
用户: <input type="text" id="user"><br>
密码: <input type="password" id="pass"><br>
<input type="button" value="注册" id="reg_btn">
<input type="button" value="登录" id="login_btn">
</body>
</html>
<script src="./ajax.js"></script>
<script>
//页面初始化
window.onload = function(){
var reg_btn = document.querySelector('#reg_btn');
var login_btn = document.querySelector('#login_btn');
var user = document.querySelector('#user');
var pass = document.querySelector('#pass');
//注册事件
reg_btn.onclick = function(){
ajax({
url:'/user',
data:{act:'reg',user:user.value,pass:pass.value},
type:'get',
success:function(res){
var json = eval('('+res+')');//eval可把string运行js
console.log(json);
if(json.ok){
alert( '注册成功' );
}else{
alert('注册失败:' + json.msg);
}
},
err:function(){
alert('通信失败');
}
})
}
//登录事件
login_btn.onclick = function(){
ajax({
url:'/user',
data:{act:'login',user:user.value,pass:pass.value},
type:'get',
success:function(res){
var json = eval('('+res+')');
if(json.ok){
alert('登录成功')
}else{
alert(json.msg)
}
}
})
}
}
</script>
ajax
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);
}
}
};
}
Node
var http = require('http');
var fs = require('fs');
var querystring = require('querystring');
var urlLib = require('url');
var users = {};//用于保存用户密码
var server = http.createServer((req,res)=>{
//解析数据
var str = '';
//开始
req.on('data',data=>{
str += data;
})
//结束
req.on('end',()=>{
var obj = urlLib.parse(req.url,true);
console.log(obj);
const url = obj.pathname;
const get = obj.query;
const post = querystring.parse(str);
//区分接口,文件
if(url == '/user'){//接口
switch(get.act){
case 'reg':
//检查用户名已存在
if(users[get.user]){
res.write('{"ok":false , "msg": "此用户已存在"}');
}else{//不存在
users[get.user] = get.pass;//插入users
res.write('{"ok":true , "msg":"注册成功"}');
}
break;
case 'login':
//检查用户是否存在
console.log(users,'-----',get.pass);
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,(err,data)=>{
if(err){
res.write('404')
}else{
res.write(data);
}
res.end();
})
}
})
})
server.listen('3000','127.0.0.1',()=>{
console.log('服务器启动');
})
网友评论