创新实训——《基于人脸情绪识别的教学环境中的情感感知系统》——工作汇报(一)
一、阶段性总结(第一周)
创新实训的第一周主要进行的工作主要有
(1)明确项目需求,确定项目章程,明确组员分工。
(2)按照个人分工进行相关系统配置、工具选择和环境搭建。(本人分工以前端为主)
(3)进行前端网站的初步规划以及对thinkphp框架的学习与使用。
二、具体工作内容
1. 网站需求规划
通过与小组成员讨论初步确定了系统前台网站的需求:
网站用户暂定为两种
(1)管理员
管理员负责管理所有教师用户,具有增删教师ID的功能,具有对每位教师的历史课程录像,每堂课的学生情绪变化曲线,饼状图,不合乎规范的语言记录以及总的量化评分的查看权限,具有对全校平均量化信息和教师量化评估排行的查看权限等。
(2)教师
教师可以修改账户信息,可以查看自己历史课程录像每堂课的学生情绪变化曲线,饼状图,不合乎规范的语言记录以及总的量化评分,可以查看全校平均量化信息以及教师量化评估排行等。
(3)其他有关网站的布局规划将于下周进行,后期还要进行网站需求管理,需求变更以及后期的网站稳定性安全性等性能的测试与改进。
2. 环境搭建
(1)WAMP环境的搭建
由于本人使用Windows系统,且固态硬盘没有足够的空间安装双系统,后台环境为Linux系统,故采取在Windows系统下进行前台开发,并于Linux系统下同步进行测试的开发模式。
对于WAMP环境的搭建我选择了phpstudy这款中间件,自动进行Apache+MySQL+PHP 的环境配置,免去了手工配置的困难。其中PHP采用PHP-7.0.12-NTS版本。
(2)LAMP 环境的搭建
本人将Linux操作系统装在了移动硬盘中,并且也进行了web开发相应的环境配置。
(3)thinkphp框架的下载
通过****下载了5.0版本的thinkphp框架。
3. TP5初步
通过查阅大量资料,以及通过极客学院和网易云课堂的视频学习,初步掌握了thinkphp框架的使用方法,并且通过thinkphp初步完成了系统登陆页面部分功能的实现。
(1)MVC结构
就我个人的理解来说,TP的最大特色就是他采用了MVC结构,将web的数据获取,数据处理,数据呈现相分离,增加了代码的可读性以及可移植性,实现代码重用,利于小组成员间的分工合作。MVC分别为Model,view,controller.Controller为控制器,为.php格式,每个控制器包含多个方法,可以通过调用TP类库使用TP封装的数据库访问函数等函数,方便实现网站后台的管理。而前台.html文件则位于同一模块下View文件中,方便被控制器调用。
(2)数据库操作
TP的DB类库封装了PHP访问后台数据库函数的一系列操作函数,极大的方便了数据库与前台网站和用户间的交互。
查询:
Db::table('think_user')->where('status',1)->select();
Db::name('user')->where('id',1)->find();
Db::name('user')->where('status',1)->select();
db('user')->where('id',1)->find();
db('user')->where('status',1)->select();
插入:
$data = ['foo' => 'bar', 'bar' => 'foo'];
Db::table('think_user')->insert($data);
Db::name('user')->insert($data);
$userId = Db::name('user')->getLastInsID();
修改:
Db::table('think_user')->where('id', 1)->update(['name' => 'thinkphp']);
Db::table('think_user')->update(['name' => 'thinkphp','id'=>1]);
删除:
Db::table('think_user')->delete(1);
Db::table('think_user')->delete([1,2,3]);
Db::table('think_user')->where('id',1)->delete();
Db::table('think_user')->where('id','<',10)->delete();
(3)登陆验证以及验证码实现
通过对thinkphp框架的学习,掌握了TP5访问数据库的一系列操作方法,并进行了登陆界面的功能实现,以及利用thinkphp think-captcha包实现了登陆界面验证码的功能。
Login.html代码:-------------------------------------------------------------------------------------
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Bootstrap Login Form Template</title>
<!-- CSS -->
<link rel="stylesheet" href="http://fonts.googleapis.com/css?family=Roboto:400,100,300,500">
<link rel="stylesheet" href="__STATIC__/index/bootstrap/css/bootstrap.min.css">
<link rel="stylesheet" href="__STATIC__/index/font-awesome/css/font-awesome.min.css">
<link rel="stylesheet" href="__STATIC__/index/css/form-elements.css">
<link rel="stylesheet" href="__STATIC__/index/css/style.css">
<!-- HTML5 Shim and Respond.js IE8 support of HTML5 elements and media queries -->
<!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
<!--[if lt IE 9]>
<script src="https://oss.maxcdn.com/libs/html5shiv/3.7.0/html5shiv.js"></script>
<script src="https://oss.maxcdn.com/libs/respond.js/1.4.2/respond.min.js"></script>
<![endif]-->
<!-- Favicon and touch icons -->
<link rel="shortcut icon" href="__STATIC__/index/ico/favicon.png">
<link rel="apple-touch-icon-precomposed" sizes="144x144" href="__STATIC__/index/ico/apple-touch-icon-144-precomposed.png">
<link rel="apple-touch-icon-precomposed" sizes="114x114" href="__STATIC__/index/ico/apple-touch-icon-114-precomposed.png">
<link rel="apple-touch-icon-precomposed" sizes="72x72" href="__STATIC__/index/ico/apple-touch-icon-72-precomposed.png">
<link rel="apple-touch-icon-precomposed" href="__STATIC__/index/ico/apple-touch-icon-57-precomposed.png">
</head>
<body background="__STATIC__/index/img/backgrounds/1.jpg">m
<!-- Top content -->
<div class="top-content">
<div class="inner-bg">
<div class="container">
<div class="row">
<div class="col-sm-8 col-sm-offset-2 text">
<h1><strong>Bootstrap</strong> Login Form</h1>
<div class="description">
<p>
This is a free responsive login form made with Bootstrap.
Download it on <a href="#"><strong>AZMIND</strong></a>, customize and use it as you like!
</p>
</div>
</div>
</div>
<div class="row">
<div class="col-sm-6 col-sm-offset-3 form-box">
<div class="form-top">
<div class="form-top-left">
<h3>Login to our site</h3>
<p>Enter your username and password to log on:</p>
</div>
<div class="form-top-right">
<i class="fa fa-key"></i>
</div>
</div>
<div class="form-bottom">
<form role="form" action="{:url('check')}" method="post" class="login-form">
<div class="form-group">
<label class="sr-only" for="form-username">Username</label>
<input type="text" name="name" placeholder="Username..." class="form-username form-control" id="form-username">
</div>
<div class="form-group">
<label class="sr-only" for="form-password">Password</label>
<input type="password" name="pass" placeholder="Password..." class="form-password form-control" id="form-password">
</div>
<div class="form-group">
<label class="sr-only" for="form-password">Code</label>
<input type="text" name="code" placeholder="Code..." class="form-password form-control" id="form-code">
<img src="{:captcha_src()}" alt="captcha" onclick="this.src=this.src+'?'+Math.random()" />
</div>
<button type="submit" class="btn">Sign in!</button>
</form>
</div>
</div>
</div>
<div class="row">
<div class="col-sm-6 col-sm-offset-3 social-login">
<h3>...or login with:</h3>
<div class="social-login-buttons">
<a class="btn btn-link-1 btn-link-1-facebook" href="#">
<i class="fa fa-facebook"></i> Facebook
</a>
<a class="btn btn-link-1 btn-link-1-twitter" href="#">
<i class="fa fa-twitter"></i> Twitter
</a>
<a class="btn btn-link-1 btn-link-1-google-plus" href="#">
<i class="fa fa-google-plus"></i> Google Plus
</a>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="copyrights">Collect from <a href="http://www.cssmoban.com/" title="网站模板">网站模板</a></div>
<!-- Javascript -->
<script src="__STATIC__/index/js/jquery-1.11.1.min.js"></script>
<script src="__STATIC__/index/bootstrap/js/bootstrap.min.js"></script>
<script src="__STATIC__/index/js/jquery.backstretch.min.js"></script>
<script src="__STATIC__/index/js/scripts.js"></script>
<!--[if lt IE 10]>
<script src="__STATIC__/index/js/placeholder.js"></script>
<![endif]-->
</body>
</html>
Login.php代码:------------------------------------------------------------------------------------
<?php
namespace app\index\controller;
//系统数据库类
use think\Db;
//系统控制器类
use think\Controller;
class Login extends Controller
{
public function login()
{
return view();
}
public function check()
{
if($this->checkUsername()){
if($this->checkPassword()){
$this->checkCode();
}
}
}
public function checkCode(){
$code=input('post.code');
//验证码判断
if(captcha_check($code)){
//echo"验证码正确";
//echo"<hr>";
echo "<script>alert('登陆成功!!!!!!!!!!');</script>";
return true;
}
else{
echo "<script>alert('验证码错误');history.go(-1);</script>";
return false;
}
}
public function checkUsername()
{
$data=Db::table('user_1')->where('name',input('post.name'))->select();
if(!$data){
echo "<script>alert('用户名不存在');history.go(-1);</script>";
//echo"用户名不存在";
//echo"<hr>";
return false;
}
else{
return true;
}
}
public function checkPassword()
{
$data=Db::table('user_1')->where('name',input('post.name'))->select();
if(!$data){
return false;
}
else if(input('post.pass')==$data[0]['pass']){
//echo"密码正确";
//echo"<hr>";
return true;
}
else{
echo "<script>alert('密码错误');history.go(-1);</script>";
//echo"密码错误";
//echo"<hr>";
return false;
}
}
}
三、感悟与收获
创新实训开始的第一周,面对90%充满不确定因素的未知的道路,面对队友的期望与信任,面对繁重的课业任务,以及自己的考研目标,感觉自己不知不觉进入了人生中最为关键的一个阶段,肩上的担子越来越重,脚下的步伐越来越沉稳,心智也越来越成熟。
别的不多说,我对于自己第一周的表现是即有满意也有失望,满意的地方是自己可以做到一整天专心于项目而忘记其他事情,并且能够合理地安排时间以及项目的知识学习和开发流程,但失望的地方是自己在TP环境配置过程中绕了很多的弯路,从一开始学习TP3.2的使用到后来放弃3.2转而选择5.0浪费了太多的时间。不过好在最终完成了TP5.0的环境配置以及简单使用,还学会了使用composer下载不同版本的TP以及PHP的各种资源包等等。
总之,第一周可以看作一个适应期,从第二周开始我就要着手于Jquery,BS,等样式的学习与编写,JS,PHP的学习和使用,用心做好前端网站的布局,样式,色调,以及JS脚本,后台PHP等代码的编写,最终完成前端网站与后台人脸识别分析等函数衔接,完成这场属于程序员的马拉松。