[0000]Android + Volley + node.js + Mysql 实现用户登录

# 框架

## node.js + Express + mysql + bower

* 生成工程: express --css stylus login

* 运行工程: DEBUG=login:* npm start

## 登录接口

  

  /login 交互方式 post json

  参数 username 用户名

  参数 password 密码 (md5)

实现:
点击(此处)折叠或打开

1. var express = require('express');
   
2. var router = express.Router();
   
3. var db = require('./db.js');
   
4. 
   
5. /* GET login listing. */
   
6. router.post('/', function(req, res, next) {
   
7.     var data = {};
   
8.     data.ret = -1;
   
9.     data.msg = "登录失败";
   
10. 
    
11.     var name = req.param("name");
    
12.     var password = req.param("password");
    
13.     db.connection.query("select * from " + db.tb_name + " where name=? ", [name],
    
14.         function (err, rows) {
    
15.             console.error(rows);
    
16. 
    
17.             if (rows.length == 0) {
    
18.                 // 无此用户名
    
19.                 data.msg = "无此用户名";
    
20.                 res.json(data);
    
21.                 return;
    
22.             }
    
23. 
    
24.             item = rows[0];
    
25.             if (item.password.toUpperCase() == password.toUpperCase()) {
    
26.                 data.msg = "登录成功";
    
27.                 data.ret = 0;
    
28.             }
    
29.             else {
    
30.                 data.msg = "密码错误";
    
31.                 data.ret = -2;
    
32.             }
    
33. 
    
34.             res.json(data);
    
35.             return;
    
36. 
    
37.         });
    
38. });
    
39. 
    
40. router.get('/', function(req, res, next) {
    
41.   res.render('login',
    
42.       { title:'用户登录',
    
43.         btn_name:"登录",
    
44.         post_url:"/login"
    
45.       });
    
46. });
    
47. 
    
48. module.exports = router;

## 注册接口

  /register 交互方式 post json

  参数 username 用户名

  参数 password 密码 (md5)
实现：

点击(此处)折叠或打开

1. var express = require('express');
   
2. var router = express.Router();
   
3. var db = require('./db.js');
   
4. 
   
5. function sql_default_cb(err, rows)
   
6. {
   
7.   if (err) {
   
8.     console.error('error connecting: ' + err.stack);
   
9.     return;
   
10.   }
    
11.   console.error('');
    
12.   console.error(rows);
    
13.   console.error('');
    
14. }
    
15. 
    
16. /* GET register listing. */
    
17. router.get('/', function(req, res, next) {
    
18.   res.render('login',
    
19.       { title:'用户注册',
    
20.         btn_name:"注册",
    
21.         post_url:"/register"
    
22.       });
    
23. });
    
24. 
    
25. router.post('/', function(req, res, next) {
    
26.   var data = {};
    
27.   data.ret = -1;
    
28.   data.msg = "登录失败";
    
29.   //data.name = req.param("name");
    
30.   //data.password = req.param("password");
    
31. 
    
32.   var name = req.param("name");
    
33.   var password = req.param("password");
    
34. 
    
35.   // 注册
    
36.   db.connection.query("select * from " + db.tb_name + " where name=?", [name],
    
37.       function(err, rows) {
    
38.         if (rows.length!=0) {
    
39.           data.msg = "用户名重复";
    
40.           data.ret = -2;
    
41.           res.json(data);
    
42.           return;
    
43.         }
    
44. 
    
45.         // register
    
46.         db.connection.query("insert into " + db.tb_name + "(name, password) values (?, ?)", [name, password],
    
47.         function(err, rows) {
    
48. 
    
49.           if (err) {
    
50.             console.error(err);
    
51.             data.ret = -3;
    
52.             data.msg = "数据库插入错误";
    
53.           }
    
54.           else {
    
55.             data.ret = 0;
    
56.             data.msg = "注册成功";
    
57.           }
    
58. 
    
59.           console.error(rows);
    
60.           res.json(data);
    
61.           return;
    
62.         });
    
63.       });
    
64. });
    
65. 
    
66. module.exports = router;

## 表结构描述

字段	类型	默认值	描述
_id	int		主键、自增长
name	varchar
password	varchar

##　网页端测试代码
网页端测试采用jquery.form来实现

login.jade -> login.html

点击(此处)折叠或打开

1. <!DOCTYPE html>
   
2. <html lang="zh">
   
3. <head><title>用户登录</title>
   
4.     <meta charset="UTF-8">
   
5.     <link href="/bower_components/bootstrap/dist/css/bootstrap.min.css" rel="stylesheet">
   
6.     <script src="/bower_components/jquery/dist/jquery.min.js"></script>
   
7.     <script src="/bower_components/bootstrap/dist/js/bootstrap.min.js"></script>
   
8.     <script src="/javascripts/jquery.form.js"></script>
   
9.     <script src="/javascripts/jquery.md5.js"></script>
   
10. </head>
    
11. <body>
    
12. <div class="container">
    
13.     <div class="row">
    
14.         <div style="padding-top:30px; " class="col-md-12">
    
15.             <form id="form_Register" role="form" method="post" class="form-horizontal">
    
16.                 <div class="form-group">
    
17.                     <div class="col-md-2"></div>
    
18.                     <h2 id="info" class="alert alert-success col-md-10"></h2></div>
    
19.                 <div class="form-group"><label for="name" class="col-md-2 control-label">用户名</label>
    
20. 
    
21.                     <div class="col-md-10"><input id="name" type="text" name="name" placeholder="请输入用户名(英文)" required=""
    
22.                                                   class="form-control"></div>
    
23.                 </div>
    
24.                 <div class="form-group"><label for="password" class="col-md-2 control-label">密码</label>
    
25. 
    
26.                     <div class="col-md-10"><input id="password" type="password" placeholder="请输入密码" required=""
    
27.                                                   class="form-control"></div>
    
28.                 </div>
    
29.                 <div class="form-group">
    
30.                     <div class="col-md-offset-2 col-md-10">
    
31.                         <button type="submit" class="btn btn-primary">登录</button>
    
32.                     </div>
    
33.                     <div id="result" style="display:none;" class="result"></div>
    
34.                 </div>
    
35.             </form>
    
36.         </div>
    
37.     </div>
    
38. </div>
    
39. <script>var post_url = "/login";</script>
    
40. <script src="/javascripts/login.js"></script>
    
41. </body>
    
42. </html>

login.js:

点击(此处)折叠或打开

1. $(document).ready(function(){
   
2. 
   
3.     function log(msg)
   
4.     {
   
5.         $("#info").text(msg);
   
6.         $("#info").show();
   
7.         timer.reset();
   
8.     }
   
9. 
   
10.     $('#form_Register').ajaxForm({
    
11.         url: post_url,
    
12.         type: "post",
    
13.         dataType: "json",
    
14.         beforeSubmit: function (arr, $form, options){
    
15.             var password_md5 = $.md5($("#password").val());
    
16.             arr.push({ name: 'password', value: password_md5 });
    
17.             return true;
    
18.         },
    
19.         success: function(data) {
    
20.             switch (data.ret) {
    
21.                 default:
    
22.                     log(data.msg);
    
23.                     break;
    
24.             }
    
25.         }
    
26.     });
    
27. 
    
28.     // For Test
    
29.     $("#name").val("admin1");
    
30.     $("#password").val("123");
    
31. 
    
32. });

## Android测试源码:
采用Volley网络库实现:  https://git.oschina.net/caicry/volley

点击(此处)折叠或打开

1. View.OnClickListener mBtnLoginCallback = new View.OnClickListener() {
   
2.         
   
3.         @Override
   
4.         public void onClick(View v) {
   
5.             String strName = editName.getText().toString();
   
6.             String strPasword = editPassword.getText().toString();    
   
7.         
   
8.             if (strName.length() == 0 ||
   
9.                     strPasword.length() == 0) {
   
10.                 showToast(