【京东个人中心】——Nodejs/Ajax/HTML5/Mysql爬坑之功能与数据分析
一、引言
在学习了Nodejs和HTML5之后,发现了Nodejs的使用很方便,和php是完全不同的另一种后台语言。我也明白了,在一个项目里,是不可能同时存在Apach服务器(php)和Web服务器(Node.js)。在前面我做过一个京东账户项目,那个是完全使用php和Ajax以及mysql数据库做到的前后端交互,现在我也要用Node.js和Ajax以及mysql数据库完成一个京东个人中心的项目练习。在这个项目中,还要用到HTML5中的很多技术来完成项目中所需的绘图要求。这是一个非常综合的项目。
二、主要功能点
- 用户注册
- 用户登录
- 用户中心——我的订单/消费统计图/幸运抽奖
三、所用技术
Ajax、数据库(MySql)、Node.js、Express、Canvas、SVG、WebStorage、Video、增强型表单、Bootstrap
四、实现步骤
(一)创建数据库结构:数据库 jd
- 用户表:jd_user(uid,uname,upwd)
- 产品表:jd_product()
- 订单表:jd_order()
- 订单详情表:jd_order_detail()
- 抽奖记录表:jd_lottery()
(二)使用Node.js+Express创建Web服务器,监听8080端口
(三)让Web服务器向客户端提供如下静态文件:
- register.html
- login.html
- header,html
- footer.html
- usercenter.html
- css/js...
(四)让Web服务器向客户端提供如下动态资源:
- POST/user/register 接收用户注册信息
- POST/user/login 执行用户登录验证
- GET/usercenter/myorder 获取所有订单
- GET/usercenter/buystat 获得消费统计数据
- GET/usercenter/lotterystat 获得抽奖统计数据
- POST/usercenter/lottery 保存抽奖结果
五、数据库建表
所有的数据表在之前“京东账户”的基础上添加:
DROP DATABASE IF EXISTS jd;
CREATE DATABASE jd CHARSET=UTF8;
USE jd; /**用户登录表**/
CREATE TABLE t_login(
uid INT PRIMARY KEY AUTO_INCREMENT,
uname VARCHAR(32),
upwd VARCHAR(32)
);
INSERT INTO t_login VALUES
(10,'zhangsan',''),
(20,'lisi',''),
(30,'wangwu',''); /**产品信息表**/
CREATE TABLE jd_product(
pid INT PRIMARY KEY AUTO_INCREMENT,
pname VARCHAR(64),
price FLOAT(8,2),
pic VARCHAR(32)
);
INSERT INTO jd_product VALUES
(1,'小米 Note 全网通 白色 移动联通电信4G手机 双卡双待',1199.00,'images/phone/phone_01.jpg'),
(2,'Apple iPhone 6s (A1700) 16G 玫瑰金色 移动联通电信4G手机',3999.00,'images/phone/phone_02.jpg'),
(3,'PPO R9 4GB+64GB内存版 玫瑰金 全网通4G手机 双卡',2499.00,'images/phone/phone_03.jpg'),
(4,'小米 红米 3S 高配全网通 3GB内存 32GB ROM 经典金色',899.00,'images/phone/phone_04.jpg'),
(5,'金立M6 Plus 香槟金 4GB+64GB版 移动联通电信4G手机 双卡双待',2999.00,'images/phone/phone_05.jpg'),
(6,'Apple iPhone 6s Plus (A1699) 64G 玫瑰金色 移动联通电信4G手机',5799.00,'images/phone/phone_06.jpg'),
(7,'vivo X7 全网通 4GB+64GB 移动联通电信4G手机 双卡双待',2499.00,'images/phone/phone_07.png'),
(8,'小米 红米Note3 高配全网通版 3GB+32GB 金色 移动联通电信4G手机',1099.00,'images/phone/phone_08.jpg'),
(9,'【六个月碎屏换新】荣耀8 4GB+32GB 全网通版 魅海蓝 双镜头,双2.5D玻璃',2499.00,'images/phone/phone_09.jpg'),
(10,'荣耀7 (PLK-AL10) 3GB+64GB内存版 荣耀金 移动联通电信4G手机',1799.00,'images/phone/phone_10.jpg'),
(11,'荣耀 V8 全网通 高配版 4GB+64GB 香槟金 移动联通电信4G手机 双卡双待双通',2799.00,'images/phone/phone_11.jpg'),
(12,'荣耀 畅玩5X 3GB内存版 落日金 移动联通电信4G手机 双卡双待 炫酷指纹',1099.00,'images/phone/phone_12.jpg'),
(13,'Apple iPhone 6 (A1586) 64GB 金色 移动联通电信4G手机',4199.00,'images/phone/phone_13.jpg'),
(14,'TCL 初现 750 雅金 移动联通电信4G手机 双卡双待 后置1600万摄像,美姿拍照!',4199.00,'images/phone/phone_14.jpg'),
(15,'华为 P9 plus 64GB 琥珀灰 移动联通电信4G手机 双卡双待',3988.00,'images/phone/phone_15.jpg'),
(16,'Apple iPhone 5s (A1530) 16GB 金色 移动联通4G手机',2198.00,'images/phone/phone_16.jpg'),
(17,'vivo X7Plus 全网通 4GB+64GB 移动联通电信4G手机 双卡双待 金色',2798.00,'images/phone/phone_17.jpg'),
(18,'华为 畅享5S 金色 移动联通电信4G手机 双卡双待 10万好评手机!',1099.00,'images/phone/phone_18.jpg'),
(19,'Apple iPhone 6 Plus (A1524) 16GB 银色 移动联通电信4G手机',3899.00,'images/phone/phone_19.jpg'),
(20,'华为 麦芒5 全网通 4GB+64GB版 香槟金 移动联通电信4G手机 双卡双待',2599.00,'images/phone/phone_20.jpg'),
(21,'小米5 全网通 标准版 3GB内存 32GB ROM 白色 移动联通电信4G手机',1799.00,'images/phone/phone_21.jpg'),
(22,'华为 P9 全网通 3GB+32GB版 流光金 移动联通电信4G手机 双卡双待 麒麟955',3188.00,'images/phone/phone_22.jpg'),
(23,'金立 金钢 标准版 爵士金 移动联通电信4G手机 双卡双待 4G全网通',999.00,'images/phone/phone_23.jpg'),
(24,'360手机 N4 全网通 4GB+32GB 阳光白 移动联通电信4G手机 双卡双待',999.00,'images/phone/phone_24.jpg'),
(25,'小米 Max 全网通 标准版 3GB内存 32GB ROM 金色 移动联通电信4G手机',1299.00, 'images/phone/phone_25.jpg'),
(26,'华为 P9 全网通 4GB+64GB版 金色 移动联通电信4G手机 双卡双待 后置1200万',3688.00, 'images/phone/phone_26.jpg'),
(27,'乐视(Le)乐2(X620)32GB 原力金 移动联通电信4G手机 双卡双待 5.5英寸',988.00,'images/phone/phone_27.jpg'),
(28,'努比亚(nubia)【3+64GB】小牛5 Z11mini 黑色 移动联通电信4G手机',1299.00, 'images/phone/phone_28.jpg'),
(29,'乐视(Le)乐2Pro 32GB 金色 移动联通电信4G手机 双卡双待 5.5英寸In-Cell屏',1399.00,'images/phone/phone_29.jpg'),
(30,'华为 Mate 8 3GB+32GB版 玫瑰金 移动联通电信4G手机 双卡双待 麒麟950芯片',2799.00, 'images/phone/phone_30.jpg'),
(31,'小米 4c 标准版 全网通 白色 移动联通电信4G手机 双卡双待 高通骁龙808畅销机',799.00,'images/phone/phone_31.jpg'),
(32,'vivo X7 全网通 4GB+64GB 移动联通电信4G手机 双卡双待 星空灰 vivox7',2498.00, 'images/phone/phone_32.jpg'),
(33,'联想 乐檬3 (K32C36)16GB 金色 移动4G手机 双卡双待 刀锋致敬经典',599.00,'images/phone/phone_33.jpg'),
(34,'华为 荣耀 畅玩4X 晨曦金 移动联通电信4G手机 双卡双待 5.5英寸大屏看片利器',749.00,'images/phone/phone_34.jpg'),
(35,'三星 Galaxy On5(G5500)金色 移动联通4G手机 真皮质感后盖,2600毫安大容量',699.00,'images/phone/phone_35.jpg'),
(36,'OPPO A37 2GB+16GB内存版 玫瑰金 全网通4G手机 双卡双待 【赠品任你选】',1299.00,'images/phone/phone_36.jpg'); /***购物车表***/
CREATE TABLE jd_cart(
id INT PRIMARY KEY AUTO_INCREMENT,
uid INT,
productid INT,
count INT
);
INSERT INTO jd_cart VALUES(null,10,1,2);
INSERT INTO jd_cart VALUES(null,10,2,1); /***订单表***/
CREATE TABLE jd_order(
oid INT PRIMARY KEY AUTO_INCREMENT,
rcvName VARCHAR(16),
price DECIMAL(9,2),
payment INT, #1-货到付款 2-在线付款 3-京东卡支付
orderTime BIGINT,
status INT, #1-等待付款 2-派货中 3-运输中 4-订单完成
userId INT
);
INSERT INTO jd_order VALUES
(NULL,'马东',820,1,1381234567890,1,10),
(NULL,'王磊',810,2,1351234567890,2,10),
(NULL,'赵信',830,3,1391234567890,3,10),
(NULL,'李贵',850,1,1311234567890,4,10),
(NULL,'钱大大',860,2,1771234567890,1,10),
(NULL,'孙艳',870,3,1781234567890,2,10),
(NULL,'甄露露',880,1,1358234567890,3,10),
(NULL,'姜辉',890,2,1305534567890,4,10),
(NULL,'韩雪',960,3,1301774567890,1,10),
(NULL,'马东梅',980,1,1381274567890,2,10),
(NULL,'张芬',870,2,1351234127890,3,10),
(NULL,'蔡国庆',850,3,1311258567890,4,10),
(NULL,'周福',960,1,1371234757890,1,10),
(NULL,'肖国',950,2,1381237567890,2,10),
(NULL,'张帆',940,3,1351238767890,3,10),
(NULL,'叶一安',870,1,1771454567890,4,10),
(NULL,'吴文',890,2,1781237867890,1,10),
(NULL,'安庆',920,3,1361231557890,2,10),
(NULL,'梅芳',870,1,1381234777890,3,10),
(NULL,'郑槐',960,2,1381234657890,4,10),
(NULL,'何晟铭',880,3,1391984567890,1,10),
(NULL,'谢兰',890,1,1311234467890,2,10),
(NULL,'张绍刚',790,2,1381255567890,3,10),
(NULL,'撒贝宁',900,3,1371276567890,4,10); /***订单详情表***/
CREATE TABLE jd_order_detail(
did INT PRIMARY KEY AUTO_INCREMENT,
orderId INT,
productid INT,
count INT
);
INSERT INTO jd_order_detail VALUES
(NULL, 1, 10, 1),
(NULL, 1, 15, 1),
(NULL, 2, 11, 1),
(NULL, 3, 12, 1),
(NULL, 3, 16, 1),
(NULL, 3, 21, 1),
(NULL, 4, 5, 1),
(NULL, 5, 30, 1),
(NULL, 5, 18, 1),
(NULL, 6, 7, 1),
(NULL, 7, 1, 1),
(NULL, 8, 12, 1),
(NULL, 8, 18, 1),
(NULL, 9, 21, 1),
(NULL, 10, 11, 1),
(NULL, 11, 22, 1),
(NULL, 11, 10, 1),
(NULL, 12, 10, 1),
(NULL, 13, 19, 1),
(NULL, 13, 28, 1),
(NULL, 13, 21, 1),
(NULL, 14, 1, 1),
(NULL, 14, 2, 1),
(NULL, 15, 8, 1),
(NULL, 16, 7, 1),
(NULL, 16, 17, 1),
(NULL, 17, 8, 1),
(NULL, 17, 9, 1),
(NULL, 18, 10, 1),
(NULL, 19, 19, 1),
(NULL, 19, 3, 1),
(NULL, 20, 1, 1),
(NULL, 21, 15, 1),
(NULL, 21, 18, 1),
(NULL, 22, 1, 1),
(NULL, 22, 31, 1),
(NULL, 23, 18, 1),
(NULL, 23, 3, 1),
(NULL, 24, 27, 1),
(NULL, 24, 25, 1); /***抽奖记录表***/
CREATE TABLE jd_lottery(
lid INT PRIMARY KEY AUTO_INCREMENT,
userId INT,
level INT, #1-一等奖 2-二等奖 3-三等奖 4-四等奖
lotteryTime BIGINT
);
INSERT INTO jd_lottery VALUES
(NULL, 10, 3, 1391234567890),
(NULL, 10, 2, 1371234567890),
(NULL, 10, 4, 1381234567890);
【京东个人中心】——Nodejs/Ajax/HTML5/Mysql爬坑之功能与数据分析的更多相关文章
- 【京东个人中心】——Nodejs/Ajax/HTML5/Mysql爬坑之静态页面
一.引言 接着上一篇,京东个人中心的所有功能数据分析完成之后,现在需要把静态页面完成,实现过程中要用到的技术有:Bootstrap.html5表单新特性等.除此之外,还要利用Node.js的Expre ...
- 【京东个人中心】——Nodejs/Ajax/HTML5/Mysql爬坑之注册与登录监听
一.引言 在数据库和静态页面都创建好之后,下面就该接着完成后台Node.js监听注册和登录的部分了.这个部分主要使用的技术是:Node.js的Express框架和ajax异步请求.登录和注册的代码实现 ...
- centos7安装Mysql爬坑记录
centos7安装Mysql爬坑记录 查看是否已安装 使用下列命令查看是否已经安装过mysql/mariadb/PostgreSQL 如果未安装,不返回任何结果(ECS的centos镜像默认未安装 ...
- 日均5亿查询量的京东订单中心,为什么舍MySQL用ES?
阅读本文大概需要 8 分钟. 来源:京东技术订阅号(ID:jingdongjishu) 作者:张sir 京东到家订单中心系统业务中,无论是外部商家的订单生产,或是内部上下游系统的依赖,订单查询的调 ...
- AJAX 与 MySQL
AJAX 与 MySQL AJAX 可用来与数据库进行交互式通信. AJAX 数据库实例 下面的实例将演示网页如何通过 AJAX 从数据库读取信息: 实例 Select a person: P ...
- 使用nodejs+express+socketio+mysql搭建聊天室
使用nodejs+express+socketio+mysql搭建聊天室 nodejs相关的资料已经很多了,我也是学习中吧,于是把socket的教程看了下,学着做了个聊天室,然后加入简单的操作mysq ...
- nodejs remote链接mysql数据库总结
nodejs链接远端mysql,这个折腾了一个上午才搞定.本以为,直接使用就OK了,但是发现不行,后来查阅各种资料后,终于找到了方法. nodejs链接远端数据库主要分为几个步骤: 1)安装node- ...
- Ajax数据的爬取(淘女郎为例)
mmtao Ajax数据的爬取(淘女郎为例) 如有疑问,转到 Wiki 淘女郎模特抓取教程 网址:https://0x9.me/xrh6z 判断一个页面是不是 Ajax 加载的方法: 查看网页源代码, ...
- 使用PHP+MySql+Ajax+jQuery实现省市区三级联动功能
使用PHP+MySql+Ajax+jQuery实现省市区三级联动功能 要求:写一个省市区(或者年月日)的三级联动,实现地区或时间的下拉选择. 实现技术:php ajax 实现:省级下拉变化时市下拉区下 ...
随机推荐
- Leetcode 532.数组中的K-diff数对
数组中的K-diff数对 给定一个整数数组和一个整数 k, 你需要在数组里找到不同的 k-diff 数对.这里将 k-diff 数对定义为一个整数对 (i, j), 其中 i 和 j 都是数组中的数字 ...
- 二维数组的动态分配(new)、初始化(memset)和撤销(delete)
来自http://blog.csdn.net/maverick1990/article/details/22829135 一维数组 动态分配,int *array = new int[10] 初始化, ...
- windows下命令行
创建文件夹 mkdir 文件夹名字 创建文件 echo >文件名字 输入文件内容
- HDU 5322 Hope ——NTT 分治 递推
发现可以推出递推式.(并不会) 然后化简一下,稍有常识的人都能看出这是一个NTT+分治的情况. 然而还有更巧妙的方法,直接化简一下递推就可以了. 太过巧妙,此处不表,建议大家找到那篇博客. 自行抄写 ...
- pdo防sql注入
http://blog.csdn.net/qq635785620/article/details/11284591
- JavaScript 笔记(2) -- 类型转换 & 正则表达 & 变量提升 & 表单验证
目录: typeof, null, undefined, valueOf() 类型转换 正则表达式 错误: try, catch, throw 调试工具 变量提升 strict 严格模式 使用误区 ...
- fetch上传cookie数据方法
Fetch 请求默认是不带cookie的.需要设置fetch的第二个参数: 先来看下,请求头部信息Request method - 使用的HTTP动词,GET, POST, PUT, DELETE, ...
- FOJ Problem 2273 Triangles
Problem 2273 Triangles Accept: 201 Submit: 661Time Limit: 1000 mSec Memory Limit : 262144 KB P ...
- Python之访问set
dict的作用是建立一组 key 和一组 value 的映射关系,dict的key是不能重复的. 有的时候,我们只想要 dict 的 key,不关心 key 对应的 value,目的就是保证这个集合的 ...
- depletion mosfet 的 depletion 解釋
Origin mosfet 除了有 n channel 及 p channel 外, 還分為 enhanced 及 depletion 兩種, 引起我注意的是, depletion 代表什麼, Exp ...