第九周团队博客
本周内，我们团队主要完成了以下工作：
1、跨域问题的解决
2、前端页面部分的编写
3、模型与前端的整合与调整
4、模型平滑处理
1、跨域问题的解决
由于项目采用了前后端分离的方式，静态资源放置在了8081端口，而数据请求则开放在8082端口。
获取数据时的跨域问题已经解决了，然而在利用cookie获取已登录用户的个人信息时出现了问题，因为登录时得到的JSESSIONID和发送post请求时的JSESSIONID不一致，这里猜测是出现了跨域问题导致cookies无法正确的提交给后台。
查阅了大量的资料配合试验之后，最终得到了一个实用的解决方案：
1.后端配置
这段代码写在了检查登录的过滤器里面
response.setHeader("Access-Control-Allow-Origin", "http://localhost:8081");
response.setHeader("Access-Control-Allow-Methods", "POST, GET, OPTIONS, DELETE");
response.setHeader("Access-Control-Max-Age", "3600");
response.setHeader("Access-Control-Allow-Headers", "x-requested-with");
// 允许跨域请求中携带cookie
response.setHeader("Access-Control-Allow-Credentials", "true");
此外登录成功的时候，将sessionId返回给前台，因为前台获取这个sessionId实在是太困难了。。。
if(envelope.getCode() == 0){ //如果验证成功
session.setAttribute("user",envelope.getObj()); //设置session
envelope.setObj(session.getId()); //返回sessionid
}
2.登录时利用cookies存储sessionId
$.post('http://localhost:8082/user/login',data,function(str,status,xhr){
//alert(str)
res = eval('('+str+')');
if(res.code != 0){
alert(res.message);
}else{
// 设置一个键为loginCoo的cookies，保存jsession的值
setCookie('loginCoo',res.object);
window.location.href = 'http://localhost:8081/blog.html';
}
});
3.提交时构建一个允许cookies的请求
首先手动设置jsessionid然后利用这个jsessionid来提交数据。
document.cookie = 'JSESSIONID='+getCookie('loginCoo');
$.ajax({
url : 'http://localhost:8082/comment/comArt',
data : data,
dataType: 'json',
type : 'POST',
xhrFields: {
withCredentials: true
},
crossDomain: true,
success: function(res) {
// 如果提交成功
if(res.code == 0){
;
}else{
alert(res.message);
}
}
})；
这样就实现了提交数据时携带cookies。
2、前端页面
这次主要是把一些用户逻辑的前端页面写好,然后定义好后台的一些接口,方便后台的编写.
其实工作的话,整体是工程多一些,难度不是很大.
一、登陆、注册
这部分工作实在是比较简单…
主要就是花点时间写好看一点,注重一下验证逻辑
效果如下:
三、模型与前端的整合与调整
目前遇到的问题主要有以下两点：
模型垂直方向预测不够准确，出现漂移
模型在使用过程中会有较为严重的抖动现象
本周主要解决的是第一个问题
解决思路主要分为以下两种：
将模型一分为二，采用专门的模型预测水平方向和专门的模型预测垂直方向
在竖直方向上对视线位置进行分层离散处理
对于第一种方法，在修改模型结构并训练后在实际测试中效果并没有明显的改善，因此将重点放到了第二种方法上。
对于分层离散处理，简单来说就是在视线追踪不灵敏的垂直区域上划定几个固定的高度，当检测的垂直高度在某个区间内时 ，变将垂直高度统一的一个固定的高度。在初步测试中，该方法对与改善垂直方向上的追踪效果有较大的改善。目前在垂直方向一共划分了三个区域，上中下三区域中，上负责向上滑动翻页，中间区域负责浏览点击操作，下区域 负责滑动下翻页。
四、平滑处理目前遇到的问题主要有以下两点：
算法设计1
起初打算使用滑动窗口的思想，设定一个大小为10的滑动窗口。由于模型每0.1s预测一次视线位置，因此滑动窗口保存1s前的所有预测点。
假设窗口内的预测点为10个向量[x0,x1,x2,x3,x4,x5,x6,x7,x8,x9]，计算出相邻点之间的差值向量，差值向量有9个[x1-x0,x2-x1,x3-x2,x4-x3,x5-x4,x6-x5,x7-x6,x8-x7,x9-x8]。计算这9个向量的平均值，作为当前移动的方向。
把该移动方向乘以一个固定的系数α，再加上前一个时刻的视线位置，就得到了当前的视线位置。
后来发现这个平滑方式没有考虑到前一个时刻点的位置，因此不可采纳。
算法设计2
记录前一个时刻点的位置（x0,y0），模型预测的当前时刻的位置(x,y)，则视点的位置则变为(x0,y0)+α*[(x,y)-(x0,y0)]。(0<α<1)
后经测试，这种方法只会使点的移动幅度降低，仍然会存在明显的抖动，影响体验，不可采纳。
算法设计3
记录前一个时刻点的位置（x0,y0），模型预测的当前时刻的位置(x,y)，设定一个变量α，0<α<1，屏幕长为w，则当||(x,y)-(x0,y0)||<α*w时，视点不变，经测试α取0.2左右时效果较好，能有效地降低抖动，改善用户操作性，予以采纳。