node day1 login

https://blog.csdn.net/weixin_33901641/article/details/85967847 vue之node.js的简单介绍

http://nodejs.cn/
http://www.runoob.com/nodejs/nodejs-express-framework.html

cmd ->
node -v
npm -v

 1 <!DOCTYPE html>
 2 <html lang="en">
 3 <head>
 4     <meta charset="UTF-8">
 5     <meta http-equiv="X-UA-Compatible" content="IE=edge">
 6     <meta name="viewport" content="width=device-width">
 7     <title>Title</title>
 8     <script type="text/javascript"  src="http://libs.baidu.com/jquery/1.10.2/jquery.min.js"></script>
 9     <style>
10         span{
11             color: rgb(255, 0, 0);
12         }
13     </style>
14 </head>
15 <body>
16 <div>
17     <form action="" method="post">
18         <p>用户名：<input type="text" placeholder="username" id="username"></p>
19         <p>密码：<input type="password" placeholder="password" id="password"></p>
20         <input type="submit" value="提交" onclick="login()">
21         <span></span>
22     </form>
23 </div>
24 <script>
25     function login() {
26         var username = $("#username").val();
27         var password = $("#password").val();
28         var url = "http://localhost:8080/login";
29         console.log(username,password);
30         $.post(url, {username,password}, function (response) {
31             console.log(response);
32             if (response){
33                 alert("登陆成功")
34             }else{
35                 alert("登录失败")
36             }
37 
38         })
39 
40     }
41 
42 </script>
43 </body>
44 </html>

server.js

 1 var express = require("express"); //引用包 npm install express --save
 2 var query = require("querystring");
 3 
 4 var app = express();  //初始化
 5 app.listen("8080",function () {  //监听
 6     console.log("服务已经启动，端口是8080")
 7 });
 8 
 9 var data2="";
10 app.post(
11   '/login',
12   function (request,response) {
13       response.header("Access-Control-Allow-Origin", "*");
14       request.on("data",function (datas) {   //接收用户发来的数据,里面的data是不变的，就得叫data
15           data2 = "";
16           // console.log(datas)  ; //<Buffer 75 73 65 72 6e 61 6d 65 3d 26 70 61 73 73 77 6f 72 64 3d
17                                 // >这样打印的结果是Buffer 类型的，所以我们得拼接一下,用querystring这个模块转成字符串
18           data2+=datas;
19       });
20       request.on("end",function () {  //接收用户发来的数据之后开始解析
21           console.log(query.parse(data2));  //{ username: '海燕', password: '123' }
22           var username = query.parse(data2).username;
23           var password = query.parse(data2).password;
24           if (username == "海燕" && password == "123"){
25               response.send(true)//如果登录成功就把数据返回给前端
26           }else{
27               response.send(false)
28           }
29       })
30 
31   }
32 );

直接运行html

posted on 2019-02-19 16:49 Aaron_Net 阅读(241) 评论(0) 收藏举报