用户模块 之 首页的显示
在上一篇博文中我们实现了三大框架的整合,实现的效果就是在运行的时候没有报错
分析主页数据的显示:
初始主页面的显示:
初始时的访问页面:
初始web.xml
<welcome-file-list> <welcome-file>index.html</welcome-file> <welcome-file>index.htm</welcome-file> <welcome-file>index.jsp</welcome-file> <welcome-file>default.html</welcome-file> <welcome-file>default.htm</welcome-file> <welcome-file>default.jsp</welcome-file> </welcome-file-list>
将web.xml中这里只有一个default.jsp,让default.jsp跳转一个代码,跳转到action中,通过action进行访问
<welcome-file-list>
<welcome-file>default.jsp</welcome-file>
</welcome-file-list>
由于页面都是静态的,因此需要在jsp中写入Java代码,进行获取信息,
其获取信息的的思路:
在项目中新建一个default.jsp
初始在default.jsp中加入代码,直接访问action:
1 <%@ page language="java" contentType="text/html; charset=ISO-8859-1" 2 pageEncoding="ISO-8859-1"%> 3 <!DOCTYPE html> 4 <html> 5 <head> 6 <meta charset="ISO-8859-1"> 7 <title>泉师释疑</title> 8 </head> 9 <body> 10 11 <%response.sendRedirect(request.getContextPath()+"/GetDataAction_getData"); %> 12 13 </body> 14 </html>
用图分析主页数据的显示
在主页的显示中,需要进行如下的修改:
操作系统、本计算机ip地址、本计算机名称、内存总量、内存使用量、当前内存剩余量都通过代码进行动态的获取,而由于使用的是Java版本将其与mysql版本都写为静态的。
只用到了web层
获取当前时间以及ip地址
创建action
GetDataAction
在工具包中建一个ComputerInfo.java
private String os;//操作系统 private String ip;//本计算机的ip地址 private String computerName;//本计算机的名称 private String memTotal;//内存的总量 private String memUse;//内存的使用量 private String memFree;//当前内存的剩余量 private String time;//当前时间
![](https://images.cnblogs.com/OutliningIndicators/ContractedBlock.gif)
1 package com.guiyan.utils; 2 3 public class ComputerInfo { 4 5 private String os;//操作系统 6 private String ip;//本计算机的ip地址 7 private String computerName;//本计算机的名称 8 private String memTotal;//内存的总量 9 private String memUse;//内存的使用量 10 private String memFree;//当前内存的剩余量 11 private String time;//当前时间 12 13 14 15 16 public String getOs() { 17 return os; 18 } 19 public void setOs(String os) { 20 this.os = os; 21 } 22 public String getIp() { 23 return ip; 24 } 25 public void setIp(String ip) { 26 this.ip = ip; 27 } 28 public String getComputerName() { 29 return computerName; 30 } 31 public void setComputerName(String computerName) { 32 this.computerName = computerName; 33 } 34 public String getMemTotal() { 35 return memTotal; 36 } 37 public void setMemTotal(String memTotal) { 38 this.memTotal = memTotal; 39 } 40 public String getMemUse() { 41 return memUse; 42 } 43 public void setMemUse(String memUse) { 44 this.memUse = memUse; 45 } 46 public String getMemFree() { 47 return memFree; 48 } 49 public void setMemFree(String memFree) { 50 this.memFree = memFree; 51 } 52 public String getTime() { 53 return time; 54 } 55 public void setTime(String time) { 56 this.time = time; 57 } 58 59 60 61 62 }
在GetDataAction.java中写入获取当前时间以及ip地址
package com.guiyan.web; import java.net.InetAddress; import java.text.SimpleDateFormat; import java.util.Date; import java.util.Map; import java.util.Properties; import com.guiyan.utils.ComputerInfo; public class GetDataAction { public String getData() throws Exception { ComputerInfo computerInfo = new ComputerInfo(); //获取时间 SimpleDateFormat format = new SimpleDateFormat("yyyy-MM-dd HH:mm:ss"); computerInfo.setTime(format.format(new Date())); //获取ip地址 InetAddress addr; addr = InetAddress.getLocalHost(); String ip = addr.getHostAddress(); computerInfo.setIp(ip); return "index"; } }
获取操作系统以及计算机名称
关于获取计算机名称用到的属性方法的网址:
https://www.cnblogs.com/lykbk/p/asdfasddaa23432434.html
在GetDataAction.java中获取操作系统以及计算机名称
//操作系统 Properties properties = System.getProperties(); String osName = properties.getProperty("os.name");//获取操作系统的名称 computerInfo.setOs(osName); //计算机名称(注意不是获取用户的名称) //通过键获取其名称 Map<String, String> map = System.getenv(); String computerName = map.get("COMPUTERNAME"); computerInfo.setComputerName(computerName);
测试结果:
测试代码:
System.err.println(computerInfo.getTime());
System.err.println(computerInfo.getIp());
System.err.println(computerInfo.getOs());
System.err.println(computerInfo.getComputerName());
在struts.xml中允许所有方法中写入这一句:
<action name="GetDataAction_*" class="com.guiyan.web.GetDataAction" method="{1}"> </action>
在applicationContext.xml中配置该action:
<!-- 配置Action --> <bean name="getDataAction" class="com.guiyan.web.GetDataAction" scope="prototype"> </bean>
运行后出现的错误如下:
该错误没事,是由于还没有写返回的结果,因此产生的错误
获取内存与其使用量与剩余量
需要通过一个插件来进行获取:
sigar插件的详情使用:https://blog.csdn.net/a123demi/article/details/50689265
Sigar sigar = new Sigar(); Mem mem = sigar.getMem(); //内存 long total = mem.getTotal(); //内存使用量 long used = mem.getUsed(); //内存剩余量 long free = mem.getFree();
System.err.println( total);
System.err.println( used);
System.err.println( free);
java如何引入dll文件:
当运行上面的代码时报这样的错误了:
把这个dll文件复制到你Java安装的目录中的jdk中
我的Java是安装在这里
放在这里它会自动加载
运行的结果:
由于数字的是以字节为单位的,需进行单位的转换,转换为G:
进行单位转化的代码:
System.err.println(1.0 * total/1024/1024/1024); System.err.println(1.0 * used/1024/1024/1024); System.err.println(1.0 * free/1024/1024/1024);
其转化的结果为:
这样就获取了内存的总量,内存的使用量以及内存的剩余量,
由于还没有写返回结果,因此还有如下错误
接下来,就需要解决此问题,让其有返回结果
完善前端页面:给welcome.jsp提供数据
在jsp中都需要进行引入Struts标签库:
<%@ taglib uri="/struts-tags" prefix="s" %>
利用Struts标签库使页面动态显示:
在GetDataAction.java中加入:
computerInfo.setMemTotal(total/1024/1024/1024 + "G"); computerInfo.setMemUse(used/1024/1024/1024 + "G"); computerInfo.setMemFree(free/1024/1024/1024 + "G"); ActionContext.getContext().put("computerInfo", computerInfo); //通过使用actionContext进行转发 return "index";
在struts.xml中加入结果集
<!-- 允许所有方法 --> <global-allowed-methods>regex:.*</global-allowed-methods> <action name="GetDataAction_*" class="com.guiyan.web.GetDataAction" method="{1}"> <result name="index">/index.jsp</result> </action>
index.jsp:
![](https://images.cnblogs.com/OutliningIndicators/ContractedBlock.gif)
1 <%@ page language="java" contentType="text/html; charset=utf-8" 2 pageEncoding="utf-8"%> 3 <%@ taglib uri="/struts-tags" prefix="s" %> 4 <!doctype html> 5 <html lang="en"> 6 <head> 7 <meta charset="UTF-8"> 8 <title>泉师释疑后台</title> 9 <meta name="renderer" content="webkit|ie-comp|ie-stand"> 10 <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"> 11 <meta name="viewport" content="width=device-width,user-scalable=yes, minimum-scale=0.4, initial-scale=0.8,target-densitydpi=low-dpi" /> 12 <meta http-equiv="Cache-Control" content="no-siteapp" /> 13 14 <link rel="shortcut icon" href="/favicon.ico" type="image/x-icon" /> 15 <link rel="stylesheet" href="./css/font.css"> 16 <link rel="stylesheet" href="./css/xadmin.css"> 17 <script type="text/javascript" src="https://cdn.bootcss.com/jquery/3.2.1/jquery.min.js"></script> 18 <script src="./lib/layui/layui.js" charset="utf-8"></script> 19 <script type="text/javascript" src="./js/xadmin.js"></script> 20 21 </head> 22 <body> 23 <!-- 顶部开始 --> 24 <div class="container"> 25 <div class="logo"> 26 <a href="./index.jsp">泉师释疑后台</a> 27 </div> 28 <div class="left_open"> 29 <i title="展开左侧栏" class="iconfont"></i> 30 </div> 31 <ul class="layui-nav left fast-add" lay-filter=""> 32 <li class="layui-nav-item"> 33 <a href="javascript:;">+新增</a> 34 <dl class="layui-nav-child"> 35 <!-- 二级菜单 --> 36 <dd> 37 <a onclick="x_admin_show('资讯','http://www.baidu.com')"> 38 <i class="iconfont"></i> 39 资讯 40 </a> 41 </dd> 42 <dd> 43 <a onclick="x_admin_show('图片','http://www.baidu.com')"> 44 <i class="iconfont"></i> 45 图片 46 </a> 47 </dd> 48 <dd> 49 <a onclick="x_admin_show('用户','http://www.baidu.com')"> 50 <i class="iconfont"></i> 51 用户 52 </a> 53 </dd> 54 </dl> 55 </li> 56 </ul> 57 <ul class="layui-nav right" lay-filter=""> 58 <li class="layui-nav-item"> 59 <a href="javascript:;">admin</a> 60 <dl class="layui-nav-child"> 61 <!-- 二级菜单 --> 62 <dd> 63 <a onclick="x_admin_show('个人信息','http://www.baidu.com')">个人信息</a> 64 </dd> 65 <dd> 66 <a onclick="x_admin_show('切换帐号','http://www.baidu.com')">切换帐号</a> 67 </dd> 68 <dd> 69 <a href="./login.html">退出</a> 70 </dd> 71 </dl> 72 </li> 73 <li class="layui-nav-item to-index"> 74 <a href="/">前台首页</a> 75 </li> 76 </ul> 77 78 </div> 79 <!-- 顶部结束 --> 80 <!-- 中部开始 --> 81 <!-- 左侧菜单开始 --> 82 <div class="left-nav"> 83 <div id="side-nav"> 84 <ul id="nav"> 85 <li> 86 <a href="javascript:;"> 87 <i class="iconfont"></i> 88 <cite>用户管理</cite> 89 <i class="iconfont nav_right"></i> 90 </a> 91 <ul class="sub-menu"> 92 <li> 93 <a _href="#"> 94 <i class="iconfont"></i> 95 <cite>用户列表</cite> 96 97 </a> 98 </li> 99 <li> 100 <a _href="#"> 101 <i class="iconfont"></i> 102 <cite>用户删除</cite> 103 104 </a> 105 </li> 106 </ul> 107 </li> 108 <li> 109 <a href="javascript:;"> 110 <i class="iconfont"></i> 111 <cite>帖子管理</cite> 112 <i class="iconfont nav_right"></i> 113 </a> 114 <ul class="sub-menu"> 115 116 <li> 117 <a href="javascript:;"> 118 <i class="iconfont"></i> 119 <cite>帖子列表</cite> 120 <i class="iconfont nav_right"></i> 121 </a> 122 <ul class="sub-menu"> 123 <li> 124 <a _href="#"> 125 <i class="iconfont"></i> 126 <cite>已完结</cite> 127 128 </a> 129 </li> 130 <li> 131 <a _href="#"> 132 <i class="iconfont"></i> 133 <cite>未完结</cite> 134 135 </a> 136 </li> 137 138 139 </ul> 140 </li> 141 <li> 142 <a _href="#"> 143 <i class="iconfont"></i> 144 <cite>帖子删除</cite> 145 146 </a> 147 </li> 148 </ul> 149 </li> 150 <li> 151 <a href="javascript:;"> 152 <i class="iconfont"></i> 153 <cite>系统统计</cite> 154 <i class="iconfont nav_right"></i> 155 </a> 156 <ul class="sub-menu"> 157 <li> 158 <a _href="#"> 159 <i class="iconfont"></i> 160 <cite>总体数量显示</cite> 161 </a> 162 </li> 163 <li> 164 <a _href="#"> 165 <i class="iconfont"></i> 166 <cite>总体数量详细显示</cite> 167 </a> 168 </li> 169 <li> 170 <a _href="#"> 171 <i class="iconfont"></i> 172 <cite>总体数量雷达图</cite> 173 </a> 174 </li> 175 <li> 176 <a _href="#"> 177 <i class="iconfont"></i> 178 <cite>帖子大比拼</cite> 179 </a> 180 </li> 181 <li> 182 <a _href="#"> 183 <i class="iconfont"></i> 184 <cite>每周用户统计</cite> 185 </a> 186 </li> 187 <li> 188 <a _href="#"> 189 <i class="iconfont"></i> 190 <cite>每周数量统计</cite> 191 </a> 192 </li> 193 194 </ul> 195 </li> 196 <li> 197 <a href="javascript:;"> 198 <i class="iconfont"></i> 199 <cite>图标字体</cite> 200 <i class="iconfont nav_right"></i> 201 </a> 202 <ul class="sub-menu"> 203 <li> 204 <a _href="unicode.html"> 205 <i class="iconfont"></i> 206 <cite>图标对应字体</cite> 207 </a> 208 </li> 209 </ul> 210 </li> 211 </ul> 212 </div> 213 </div> 214 <!-- <div class="x-slide_left"></div> --> 215 <!-- 左侧菜单结束 --> 216 <!-- 右侧主体开始 --> 217 <div class="page-content"> 218 <div class="layui-tab tab" lay-filter="xbs_tab" lay-allowclose="false"> 219 <ul class="layui-tab-title"> 220 <li class="home"> 221 <i class="layui-icon"></i> 222 我的桌面 223 </li> 224 </ul> 225 <div class="layui-tab-content"> 226 <div class="layui-tab-item layui-show"> 227 <iframe src="${pageContext.request.contextPath }/GetDataAction_getData" frameborder="0" scrolling="yes" class="x-iframe"></iframe> 228 </div> 229 </div> 230 </div> 231 </div> 232 <div class="page-content-bg"></div> 233 <!-- 右侧主体结束 --> 234 <!-- 中部结束 --> 235 <!-- 底部开始 --> 236 <div class="footer"> 237 <div class="copyright">Copyright ©2019 All Rights Reserved</div> 238 </div> 239 <!-- 底部结束 --> 240 <script> 241 //百度统计可去掉 242 var _hmt = _hmt || []; 243 (function() { 244 var hm = document.createElement("script"); 245 hm.src = "https://hm.baidu.com/hm.js?b393d153aeb26b46e9431fabaf0f6190"; 246 var s = document.getElementsByTagName("script")[0]; 247 s.parentNode.insertBefore(hm, s); 248 })(); 249 </script> 250 </body> 251 </html>
welcome.jsp
![](https://images.cnblogs.com/OutliningIndicators/ContractedBlock.gif)
1 <%@ page language="java" contentType="text/html; charset=UTF-8" 2 pageEncoding="UTF-8"%> 3 <%@ taglib uri="/struts-tags" prefix="s" %> 4 <!DOCTYPE html> 5 <html> 6 <head> 7 <meta charset="UTF-8"> 8 <title>欢迎页面</title> 9 <meta name="renderer" content="webkit"> 10 <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"> 11 <meta name="viewport" content="width=device-width,user-scalable=yes, minimum-scale=0.4, initial-scale=0.8,target-densitydpi=low-dpi" /> 12 <link rel="shortcut icon" href="/favicon.ico" type="image/x-icon" /> 13 <link rel="stylesheet" href="./css/font.css"> 14 <link rel="stylesheet" href="./css/xadmin.css"> 15 </head> 16 <body> 17 <div class="x-body layui-anim layui-anim-up"> 18 <blockquote class="layui-elem-quote">欢迎管理员: 19 <span class="x-red">test</span>!当前时间:<s:property value="#computerInfo.time"/></blockquote> 20 <fieldset class="layui-elem-field"> 21 <legend>数据统计</legend> 22 <div class="layui-field-box"> 23 <div class="layui-col-md12"> 24 <div class="layui-card"> 25 <div class="layui-card-body"> 26 <div class="layui-carousel x-admin-carousel x-admin-backlog" lay-anim="" lay-indicator="inside" lay-arrow="none" style="width: 100%; height: 90px;"> 27 <div carousel-item=""> 28 <ul class="layui-row layui-col-space10 layui-this"> 29 <li class="layui-col-xs2"> 30 <a href="javascript:;" class="x-admin-backlog-body"> 31 <h3>文章数</h3> 32 <p> 33 <cite>66</cite></p> 34 </a> 35 </li> 36 <li class="layui-col-xs2"> 37 <a href="javascript:;" class="x-admin-backlog-body"> 38 <h3>会员数</h3> 39 <p> 40 <cite>12</cite></p> 41 </a> 42 </li> 43 <li class="layui-col-xs2"> 44 <a href="javascript:;" class="x-admin-backlog-body"> 45 <h3>回复数</h3> 46 <p> 47 <cite>99</cite></p> 48 </a> 49 </li> 50 <li class="layui-col-xs2"> 51 <a href="javascript:;" class="x-admin-backlog-body"> 52 <h3>商品数</h3> 53 <p> 54 <cite>67</cite></p> 55 </a> 56 </li> 57 <li class="layui-col-xs2"> 58 <a href="javascript:;" class="x-admin-backlog-body"> 59 <h3>文章数</h3> 60 <p> 61 <cite>67</cite></p> 62 </a> 63 </li> 64 <li class="layui-col-xs2"> 65 <a href="javascript:;" class="x-admin-backlog-body"> 66 <h3>文章数</h3> 67 <p> 68 <cite>6766</cite></p> 69 </a> 70 </li> 71 </ul> 72 </div> 73 </div> 74 </div> 75 </div> 76 </div> 77 </div> 78 </fieldset> 79 <fieldset class="layui-elem-field"> 80 <legend>系统通知</legend> 81 <div class="layui-field-box"> 82 <table class="layui-table" lay-skin="line"> 83 <tbody> 84 <tr> 85 <td > 86 <a class="x-a" href="/" target="_blank">新版泉师释疑上线了</a> 87 </td> 88 </tr> 89 <tr> 90 <td > 91 <a class="x-a" href="/" target="_blank">交流qq:(3413319614)</a> 92 </td> 93 </tr> 94 </tbody> 95 </table> 96 </div> 97 </fieldset> 98 <fieldset class="layui-elem-field"> 99 <legend>系统信息</legend> 100 <div class="layui-field-box"> 101 <table class="layui-table"> 102 <tbody> 103 <tr> 104 <th>操作系统</th> 105 <td><s:property value="#computerInfo.os"/></td> 106 </tr> 107 <tr> 108 <th>ip地址</th> 109 <td><s:property value="#computerInfo.ip"/></td> 110 </tr> 111 <tr> 112 <th>计算机名称</th> 113 <td><s:property value="#computerInfo.computerName"/></td> 114 </tr> 115 116 <tr> 117 <th>Java版本</th> 118 <td>JDK 1.8</td> 119 </tr> 120 <tr> 121 <th>MYSQL版本</th> 122 <td>5.7</td> 123 </tr> 124 <tr> 125 <th>内存总量</th> 126 <td><s:property value="#computerInfo.memTotal"/></td> 127 </tr> 128 <tr> 129 <th>当前已使用内存</th> 130 <td><s:property value="#computerInfo.memUse"/></td> 131 </tr> 132 <tr> 133 <th>剩余内存</th> 134 <td><s:property value="#computerInfo.memFree"/></td> 135 </tr> 136 137 </tbody> 138 </table> 139 </div> 140 </fieldset> 141 <fieldset class="layui-elem-field"> 142 <legend>开发团队</legend> 143 <div class="layui-field-box"> 144 <table class="layui-table"> 145 <tbody> 146 <tr> 147 <th>版权所有</th> 148 <td>xxxxx(xxxx) 149 <a href="http://www.xxx.com/" class='x-a' target="_blank">访问官网</a></td> 150 </tr> 151 <tr> 152 <th>开发团队</th> 153 <td>xxxxxx</td></tr> 154 </tbody> 155 </table> 156 </div> 157 </fieldset> 158 <blockquote class="layui-elem-quote layui-quote-nm">感谢layui,百度Echarts,jquery,本系统由x-admin提供技术支持。</blockquote> 159 </div> 160 <script> 161 var _hmt = _hmt || []; 162 (function() { 163 var hm = document.createElement("script"); 164 hm.src = "https://hm.baidu.com/hm.js?b393d153aeb26b46e9431fabaf0f6190"; 165 var s = document.getElementsByTagName("script")[0]; 166 s.parentNode.insertBefore(hm, s); 167 })(); 168 </script> 169 </body> 170 </html>
在运行中出现了这样的问题;
原因是出现了死循环
解决方法:
将default.jsp中改为:
<body> <%response.sendRedirect(request.getContextPath()+"/GetDataAction_getIndex"); %> </body>
在GetDataAction.java加入:
public String getIndex() throws Exception { return "index"; }
getData()返回的是:
return "welcome";
在struts.xml中加入结果集:
<!-- 允许所有方法 --> <global-allowed-methods>regex:.*</global-allowed-methods> <action name="GetDataAction_*" class="com.guiyan.web.GetDataAction" method="{1}"> <result name="welcome">/welcome.jsp</result> <result name="index">/index.jsp</result> </action>
最终首页页面显示效果: