分类目录归档：WEB

Web技术文章，起源自大学的积累！

APP后台架构设计

项目背景&前期铺垫

2018年金融组织结构大调整，新的组织结构是中台研发。期初我对这个名称也感觉新鲜，了解后就发现，是连接前端部门与各业务部门桥接与提供公共服务的部门。
新组织架构调整伊始，开始对接各种项目，最繁琐的或许就是重前端的活动页搭建项目，也许因为这个原因吧，领导把我安排到了接收这个项目的“营销与权益”组。接手别人的项目总是痛苦的，以至于最后我们打算自己做一套。虽然很复杂，但是慢慢来应该不成问题。所以我决定全新用Spring boot2+，管理界面界面采用ElementUI做SPA，搭了一套还算比较完整的项目。总觉得以往的项目还是太过于陈旧，新项目就全部用最新的技术和框架重新搭建。小组成员们边了解需求边尝试，用了几周的时间做好了基础版的拖拽生成页面的Demo。当然没有专业前端的加入，界面还是比较丑陋的。

突然降临的挑战

上层领导决定公司APP大改版，时间很紧迫，任务非常重。原先交接过来的系统不能够支持新版APP的页面数据结构。虽然时间非常紧迫，从接到任务到上线预计也就一个月的时间，但考虑的需求比较简单还是决定全部重新做（后来发现，先期了解的需求并不全面，真是把自己给坑了）！有了上面“活动搭建”项目的后台，新项目进展还是比较迅速的。经过了解需求，思考了一下午，我大致想做一套基于领域模型驱动的架构（虽然由于自己才疏学浅，并没有在项目中把领域模型驱动设计发挥出来，但初衷还是有的），也就有了第一次小组会议我在墙上画下的初步架构设想图如图1：

第一次会议架构设想图
继续阅读 →

基于WebSocket的实时动态图表

本文介绍一下基于WebSocket的实时数据双向通讯的小范畴应用，来实现实时动态图表的展示功能。其实实现图表动态更新又岂止是只有这一种方法。用户页面端的js心跳轮询一样可以获取来自后台的最新数据，只是我感觉那是伪实时。

首先介绍一下什么是WebSocket？

WebSocket是HTML5开始提供的一种在单个TCP 连接上进行全双工通讯的协议。 WebSocket通讯协议定于2011年被IETF定为标准RFC 6455，WebSocketAPI被W3C定为标准。 在WebSocket API中，浏览器和服务器只需要做一个握手的动作，然后，浏览器和服务器之间就形成了一条快速通道。 两者之间就直接可以数据互相传送。或者看一下来自国内知乎上的解释：https://www.zhihu.com/question/20215561

项目需求：

其实标题说的很清晰了，就是要实现图标的实时动态更新，当时我的第一感觉就是要采用WebSocket去解决这个问题。而我的数据来源是来自MQ（消息队列），也就是触发数据推送就是在消息消费的地方。

继续阅读 →

Spring Batch与MyBatis结合案例

看了一下博客，好几个月没写什么文章了。再不写，估计Google再也不来了！^_^闲话少说，这次的主题就讲一下Spring Batch。Spring Batch是Spring与Accenture的合作产物。作为前Accenture员工，感觉还是很亲切的。当然这是不是我在工作中技术选型的主要原因，更重要的是看中他的强大！
业务背景：
金融系统中有一种表叫台账表，这也是在接触这个领域后才知道的。而针对这张表，每天会进行定时全表遍历进行计算利息，费用等相关操作，也就是俗称的跑批。而跑批无非就是遍历循环表中数据再进行运算而已，可是一旦数据量上去了，很多看似简单的事情往往实现起来就不再是原先的逻辑了。一张上亿行数的表，查询出来，放到内存？那肯定是不明智的做法。当然应该采用游标或者分页的查询方式去实现更好的性能。而自己去写这类方法，其实并不难，如果只是简单地为了分页查询，确实可以自己去写一个。而之所以此处选择Spring Batch，是因为它不仅仅支持这一点特性，它能做的还有很多很多。
系统背景：
系统是典型的Java Web系统架构，Spring MVC与MyBatis。当然其他诸如服务治理，消息消费等就不赘述了，此处跟那些没有太大关系。而之所以有这篇文章的出现，正是因为MyBatis。因为在我使用过程中，查询大量资料，唯独与MyBatis集成的相关资料特别少。官方的jar包里也是针对ibatis做的封装（并且已经标注为废弃状态），而MyBatis自身针对Spring Batch做了分页Writer和Reader，此次我们主要就是用这两个类。外加用Java Config自动生成Step与Job方式，避免使用xml配置，对于有代码洁癖的人来讲，过多的配置文件感觉很乱很脏。 继续阅读 →

Activiti生成动态流程图

最近又开始忙活工作流的相关工作了，第一次接触工作流也就是我在埃森哲的第一个项目，也是最后一个项目。那时候用的是日本的一整套解决方案好像叫-iMart。而进入金山工作后第二个项目也是和工作流密切相关的项目，那时候才接触到了这个开源工作流引擎-Activiti。那时候也是第一次真正了解这些东西。只是从金山离职后回到现在的公司，没想到还要用这些东西，好像又回到了去年的这个时间。
这一次需要重新集成这个引擎，以插件包的方式。其实工作量不大，因为Activiti已经自己封装的很好了，完全可以在日常开发中直接引用它的Service。闲话少说，这次解决工作流流程图问题。简而言之，在任何一条已启动的流程实例查看流程状态，用流程图片的形式展示一下。
提供的Service方法如下：

继续阅读 →

中国提速WordPress

竟然这么长时间没有写点什么了？来济南都忙活什么了？哦，遇到很多好事，坏事，恶心事。真是该碰上的碰上了，不该遇到的也遇到了。总归善恶终有一报。

近段时间一直挂念着VPS的事，前几周一下买了两台，一台是从淘宝上选的，一台是在美国一家VPS服务商直接购买的。价格都在25-30元/月。配置也都差不多的事儿，1G的RAM。身为Java程序员平时可能少不了跑点Java程序，所以512MB的内存在吃内存太厉害的Java手下显得有点捉急。

配置不在话下，那问题就来到访问速度上了。因为我大天朝“威严”，空间只能买美国的（无需备案）。所以在服务器地点上选择美国西海岸机房对中国用户的访问速度是最快的。所以两台都是洛杉矶的机房。

然而购买VPS的供应商不同，各方面也会出现一些差异。 继续阅读 →

Java模拟Http访问

Java模拟Http访问将返回的JSON解析为Bean对象

应用场景：某系统访问另一个系统获取一些数据，其中这些返回数据类型必须是JSON格式，接受系统可以将结果转换为简单的Bean对象，也可以将返回的是集合数据转换成List。这就需要我们模拟一个Http访问，然后处理返回的JSON数据。

方案选型：看了看网上的很多Demo，都是比较老的。其中应用的apache的框架现在也已经找不到了。所以决定亲自去apache官网去看看。发现以前的httpclient包已经独立出来命名为Apache HttpComponents。当前最新包为4.3.3。我采用的是OSChina的Maven源，还不错，已经有资源了。而JSON解析才用了最为流行的Jackson。

Demo示例：

Test.java 返回的JSON数据将要被解析成为的对象类 继续阅读 →

Annotation与SpEL实现系统记录操作日志

先说几句废话吧。最近工作比较混乱，一遍研究着Hadoop，一遍搞着另外一个系统的开发。这段时间，一心想写点技术文章却迟迟没能提笔。今天终于，打开音乐播放器，戴上耳机。享受着宁静的夜晚与指尖跃起的文字。甚至于还想着，什么时候才能有合适的机会回到山东，守在爸妈身边。好了，废话不多说了，开始记录正文。

需求：

系统中的一个模块属于关键区，它所有的操作主要针对修改与删除是要求记录下日志来的。而这个记录的日志并不是像我们把它们打印在log文件里，而是需要标准的记录到数据库中。以便于后来专门日志操作模块的查询。

思考： 继续阅读 →

jQuery选择器使用集锦

一个面向B/S架构的软件工程师必须要面对的几点：CSS，Html，JavaScript。而JavaScript中让人耳熟能详的jQuery大家肯定是不会陌生的。
而面对jQuery，要想了解他使用它肯定是要从选择器开始了。下面来自摘文，总结得很不错：

先来几个稍微复杂的应用：

选取一个 name 为”S_03_22″的input text框的上一个td的text值
$(”input[@ name =S_03_22]“).parent().prev().text() 
 
名字以”S_”开始，并且不是以”_R”结尾的
$(”input[@ name ^=’S_’]“).not(”[@ name $=’_R’]“) 
 
一个名为 radio_01的radio所选的值
$(”input[@ name =radio_01][@checked]“).val();   继续阅读 →

jQuery与扫码器

总是想找时间写点什么，却总是拖拖拉拉一直没能写些。今天要写的这点东西是后补在4月份的。
前段时间工作中接触了我们常见的超市扫码器，我接手了这块的开发，除了后台的验证等操作，感觉新奇的就是前台html接受扫码器所输入的条形码值。
没接触过的时候或许觉得挺难以理解的，也不知道他的实现原理。真正接手试验后才发现，并没有想象的那么麻烦，因为读取条形码的过程不需要我们参与，那些已经嵌入到了扫码器中。我们可以简单的将扫码过程理解成：连续按下了键盘上对应的键盘，输入了一串对应键盘的一别编码，然后最后跟着一个13，代表着回车结束输入。
逻辑分析：
<1> 14位条形码（读取过程中会自动添加回车符1位），也就是网页需要监听扫码器输入的每一个值，将其累加起来，当达到15位时，判断第15位是否为13，即回车。
<2> 当然还要屏蔽人为输入行为，怎么判断人为和扫码器的输入呢？最终在输入速度上作为判断依据。认为输入的速度必定是慢的，机器输入的速度还是比极快的。所以采用定义setInterval()，来进行对字符串的间断性清空。 继续阅读 →

jQuery监听事件全选Select选项

2013年一月份，从博客的日志更新上就可以看得出，这个月真的很忙。正式上项目着手开发，天天都在进行着有意思或者无聊的Coding。而这些对于我来说都是工作经验的积累。不想让2013年的一月留下空白，特此才会忙中偷闲，在公司写下此篇博客。有这样一个需求，当然后来证实是我理解错了。在一个可以多选的select下拉列表中，选择第一个名为“全选”选项后，要求其他选项都要成为selected状态。
因为此列表为页面加载的时候从数据库中查询并动态加载到此页面的，所以没法使用简单的onclick事件去获取用户的点击动作。所以我想到的是用jQuery去监听用户对此列表的点击事件。 继续阅读 →