使用 node 搭建 web 服务
1、浏览器请求根目录,把index.html页面返回给浏览器
2、index.html页面中包含用户名和密码输入框,用户点击提交按钮,使用get方式提交(提交使用ajax方式异步提交,不能使用表单默认的提交事件)
3、服务器接收用户提交参数,判断user为yuZhi,pass为123456时,验证通过,给用户返回’success’字段,前端页面收到该返回值后,弹框显示:登陆成功,否则返回“fail”字段,前端页面弹框显示”登录失败“
/**
- Created by My on 2016/9/19.
*/
var fs = require('fs');
var url = require('url');
var http = require('http');
var server = http.createServer(function (req,res) {
var urlObj = url.parse(req.url)
console.log(urlObj);
if(urlObj.query == 'username=yuZhi&password=123456'){
res.end('success')
}else if(urlObj.pathname == '/' || urlObj.pathname == '/index.html'){
var rs = fs.createReadStream('index.html') rs.pipe(res);
}else if(urlObj.pathname != '/favicon.ico'){
var rs = fs.createReadStream('.'+urlObj.pathname); rs.pipe(res)
}else{
res.end('fail')
}});
server.listen(8080);
html 方面创建ajax请求
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title></title>
<script type="text/javascript" src="jquery-3.1.0.js"></script>
<script>
$(function () {
var data = '';
$('button').on('click',function () {
data = 'username='+$('#name').val()+'&'+'password='+$('#pass').val();
$.ajax({
type:'get',
url:'/?'+data,
success:function (data) {
if(data=='success'){
alert('验证成功')
}else{
alert('验证失败')
}
}
})
})
})
</script>
</head>
<body>
用户名 : <input type="text" value="" id="name"></br>
密码: <input type="password" value="" id="pass</br>
<button>提交</button></body></html>