Tornado 网站demo 二
连接数据库
methods 中建立一个文件 db.py 分别建立起连接对象和游标对象
#!/usr/bin/env Python # coding=utf-8 import pymysql conn = pymysql.connect(host="localhost", user="root", passwd="123456", db="testdb", port=3306, charset="utf8") #连接对象 cur = conn.cursor() #游标对象
用户登录
进入到 templates 文件,建立名为 index.html 的文件:
<!DOCTYPE html> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1" /> <title>Learning Python</title> </head> <body> <h2>Login</h2> <form method="POST"> <p><span>UserName:</span><input type="text" id="username"/></p> <p><span>Password:</span><input type="password" id="password" /></p> <p><input type="button" value="login" id="login" /></p> </form> <script src="{{static_url('js/jquery-3.2.1.min.js')}}"></script> <script src="{{static_url('js/script.js')}}"></script> </body>
其中<meta name="viewport" content="width=device-width, initial-scale=1" />
,其目的在将网页的默认宽度(viewport)设置为设备的屏幕宽度(width=device-width),并且原始缩放比例为 1.0(initial-scale=1),即网页初始大小占屏幕面积的 100%。这样做的目的,是让在电脑、手机等不同大小的屏幕上,都能非常好地显示。
编写 js
statics/js/script.js
/** * Created by fulong on 2017/6/14. */ $(document).ready(function(){ alert("good"); $("#login").click(function(){ var user = $("#username").val(); var pwd = $("#password").val(); alert("username: "+user); }); });
hanlers 里面的程序
创建 __init__.py 只要在该目录中加入了这个文件,该目录中的其它 .py 文件就可以作为模块被 Python 引入了。
运行结果
数据传输
前端传输数据
用 ajax() 方法实现数据传输,需要修改 script.js 文件内容:
statics/js/script.js
/** * Created by fulong on 2017/6/14. */ $(document).ready(function(){ $("#login").click(function(){ var user = $("#username").val(); var pwd = $("#password").val(); var pd = {"username":user, "password":pwd}; $.ajax({ type:"post", url:"/", data:pd, cache:false, success:function(data){ alert(data); }, error:function(){ alert("error!"); }, }); }); });
ajax() 参数说明
- type:post 还是 get。
- url:post 或者 get 的地址
- data:传输的数据,包括三种:(1)html 拼接的字符串;(2)json 数据;(3)form 表单经 serialize() 序列化的。本例中传输的就是 json 数据,这也是经常用到的一种方式。
- cache:默认为 true,如果不允许缓存,设置为 false.
- success:请求成功时执行回调函数。本例中,将返回的 data 用 alert 方式弹出来。 alert() 这个东西,目的在于调试,走一步看一步,看看得到的数据是否如自己所要
- error:如果请求失败所执行的函数。
后端接收数据
在 IndexHandler 类中增加 post(),增加之后的完善代码是:
index.py
#!/usr/bin/env Python # coding=utf-8 import tornado.web class IndexHandler(tornado.web.RequestHandler): def get(self): self.render("index.html") def post(self): username = self.get_argument("username") password = self.get_argument("password") self.write(username)
特别注意,在 get 的时候,通过 get_argument() 函数获得 url 的参数,如果是多个参数,就获取最后一个的值。要想获取多个值,可以使用 get_arguments(name, strip=true)
。
运行之后即可看到结果
验证用户名和密码
在 methods 目录中创建一个readdb.py的文件,专门用来存储读数据用的函数
#!/usr/bin/env Python # coding=utf-8 from methods.db import * def select_table(table, column, condition, value ): sql = "select " + column + " from " + table + " where " + condition + "='" + value + "'" cur.execute(sql) lines = cur.fetchall() return lines
改写index.py
#!/usr/bin/env Python # coding=utf-8 import tornado.web import methods.readdb as mrd class IndexHandler(tornado.web.RequestHandler): def get(self): self.render("index.html") def post(self): username = self.get_argument("username") password = self.get_argument("password") user_infos = mrd.select_table(table="users",column="*",condition="username",value=username) if user_infos: db_pwd = user_infos[0][2] if db_pwd == password: self.write("welcome you: " + username) else: self.write("your password was not right.") else: self.write("There is no thi user.")
运行即可看到结果