//nodejs代码
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){ // 解析数据 if (req.url == "/favicon.ico") { return; } 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": "此用户已存在"}'); //2、插入user }else{ users[GET.user] = GET.pass; res.write('{"ok": true, "msg": "注册成功"}') } break; //登录 case 'login': //1、检查登录用户名是否存在 if (users[GET.user] == null) { res.write('{"ok": false, "msg": "此用户不存在"}'); //2、检查密码是否正确 }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(); console.log(users); console.log(GET); console.log(GET.user); console.log(GET.pass); }else{ // 读取文件 var file_name = './www'+req.url; fs.readFile(file_name, function(err, data){ if (err) { res.write(404); }else{ res.write(data); } res.end(); }) } }); }); server.listen(8082);
//HTML + JS代码
<!DOCTYPE html> <html lang="en"> <head> <meta charset="utf-8"> <script type="text/javascript" src="ajax.js"></script> <script type="text/javascript"> window.onload = function(){ var oTextUser = document.getElementById("user"); var oTextPass = document.getElementById("pass"); var loginBtn = document.getElementById("login_btn"); var regBtn = document.getElementById("reg_btn"); loginBtn.onclick = function(){ ajax({ url: '/user', data: {act: 'login', user: oTextUser.value, pass: oTextPass.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: oTextUser.value, pass: oTextPass.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="text" id="pass" /><br /> <input type="button" value="登录" id="login_btn" /> <input type="button" value="注册" id="reg_btn" /> </body> </html>
/** Ajax 代码 * Author:strive * Date: 2016/1/13 */ 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); } } }; }