项目总目录:基于Hadoop的好友推荐系统项目综述
一、MapReduce任务实时监控实现
1、前端展示
- jsp页面
当我们启动一个MapReduce任务后,后台会自动打开一个监控页面,其jsp页面如下:
<table>
<tr>
<td><label for="name">所有任务个数:</label></td>
<td><input class="easyui-validatebox" type="text"
id="jobnums" data-options="required:true" value="#" />
</td>
</tr>
<tr>
<td><label for="name">当前任务:</label></td>
<td><input class="easyui-validatebox" type="text"
id="currjob" data-options="required:true" value="#" />
</td>
</tr>
<tr>
<td><label for="name">JobID:</label></td>
<td><input class="easyui-validatebox" type="text"
id="jobid" data-options="required:true" style="width:300px" value="#" />
</td>
</tr>
<tr>
<td><label for="name">JobName:</label></td>
<td><input class="easyui-validatebox" type="text"
id="jobname" data-options="required:true" style="width:600px"
value="#" />
</td>
</tr>
<tr>
<td><label for="name">Map进度:</label></td>
<td><input class="easyui-validatebox" type="text"
id="mapprogress" data-options="required:true"
value="0.0%" />
</td>
</tr>
<tr>
<td><label for="name">Reduce进度:</label></td>
<td><input class="easyui-validatebox" type="text"
id="redprogress" data-options="required:true"
value="0.0%" />
</td>
</tr>
<tr>
<td><label for="name">任务执行状态:</label></td>
<td><input class="easyui-validatebox" type="text"
id="state" data-options="required:true"
value="#" />
</td>
</tr>
</table>
</div>
该jsp页面显示了监控的各项信息,包括任务个数、任务Id、任务状态等等。
- js逻辑
首先来看如何自动打开监控页面:
前端启动任何一个任务都是通过调用callByAJax这个方法来实现,其定义如下:
function callByAJax(url,data_){
$.ajax({
url : url,
data: data_,
async:true,
dataType:"json",
context : document.body,
success : function(data) {
// $.messager.progress('close');
closeProgressbar();
console.info("data.flag:"+data.flag);
var retMsg;
if("true"==data.flag){