版权声明:本文为博主原创文章,未经博主允许不得转载。 https://blog.csdn.net/qq_33322074/article/details/89872704
文章目录
1. 商城项目总结笔记:
1.1. 第一天工作记录:搭建Maven工程
- 创建Maven工程
- 创建一个parent父工程
- 创建一个manager聚合工程,包含dao层,interface层,pojo层,service层
- 创建一个web工程,该工程是视图层。
- 创建一个common层,用于实现各种工具类吧
- 配置各种依赖包
1.2. 第二天工作记录:创建SOA面向服务架构,通过工具类实现分页技术
- 将工程修改为SOA面向服务型架构
- SOA服务型架构的目的是:将web层与服务层分开,大量web层通过Dubbo容器访问服务层,Dubbo容器来管理服务层。
- 在spring配置文件中配置dubbo容器,使用dubbo来发布服务。dubbo的使用只需要引入dubbo的依赖包就行了。
- 安装zookeeper,用于dubbo服务的注册,dubbo先注册到zookeeper,然后调用者再从zookeerper中获取地址,调用dubbo中的服务。这样zookeeper还可以实现集群,通过dubbo的监控器还可以实现负载平衡。
- EasyUI获取页面
- url地址不须和返回的jsp页面一致才能获取到相应的jsp,这是EasyUI的特性。
@RequestMapping("{page}")
public String showPage(@PathVariable String page) {
return page; }
- 使用pageHelper分页插件实现分页技术
- 首先导入pageHelper项目
- 创建实体类包含total总页数,每页返回的记录数两个变量。
- 在sqlMapConfig.xml中 配置分页类的拦截器,和数据库方言。
- 书写Controller层:主要调用service层,然后返回json数据。
- 书写Service层,执行数据库查询,并返回对象结果。
1.3. 第三天工作记录:部署nginx服务器,用于图片上传,加载
- 实现图片上传
- 部署nginx服务器
- 学习nginx反向代理和负载均衡。
1.4. 第四天工作记录:创建FastDFS架构,用于图片上传,使用KindEditor富文本编辑器
- 搭建图片服务器框架FastDFS架构,是一个开源的分布式文件系统,充分考虑了负载均衡,线性扩容等机制,注重高可用,高性能指标,使用FastDFS很容易搭建一套高性能的文件服务器集群提供文件的上传下载功能。
- 该架构类似于dubbo+zookeeper组合成的框架结构,这里的Tracker相当于zookeeper,这里的dubbo相当于StoreageServerGroup1。上传到Storeage里面的图片将ip值放在Tracker中,然后当用户要访问某个图片时先去Tracker中找,获取访问路径,然后再从Storage中访问。和dubbo机制很相似。
1.4.1. 代码实现
- 代码实现上传
- 添加FastDFS依赖
- 在web层的conf中配置访问Tracker的路径client.conf
- tracker_server=192.168.25.133:22122
- 代码实现第一步:加载配置文件,即访问的路径
//使用全局对象加载配置文件。
ClientGlobal.init("G:/Eclipse2019_workSpace/e3-manager-web/src/main/resources/conf/client.conf");
- 创建一个TrackerClient对象,这个相当于存储的内容的注册器
//创建一个TrackerClient对象
TrackerClient trackerClient = new TrackerClient();
- 通过TrackerClient对象获取一个TrackerServer对象
//通过TrackClient获得一个TrackerServer对象
TrackerServer trackerServer = trackerClient.getConnection();
- 创建一个StorageServer引用,可以是null,再创建一个StorageClient包含StorageServer和TrackerServer两个服务。
- 这样FastDFS的客户端包含了Tracker服务和Storeage服务,形成了关联
//创建一个StrorageServer的引用,可以是null
StorageServer storageServer = null;
//创建一个StorageClient,参数需要TrackerServer和StrorageServer
StorageClient storageClient = new StorageClient(trackerServer, storageServer);
- 上传文件,并返回一个文件在Storage中的地址
//使用StorageClient上传文件。
String[] strings = storageClient.upload_file("F:/pic/b1601727ly1fo13tiladgg20ci05c0ul.gif", "gif", null);
for (String string : strings) {
System.out.println(string);
}
- 打印的值包含两部分,一个是上传的文件所在卷,另个一是该卷的具体位置。通过服务器ip地址+所在卷+具体位置就可以访问图片了。
- 由于我们只需要一个StorageClient来上传文件,因此可以抽取代码做成工具类
1.4.2. 案例实现图片上传
- 需要导包:common-io.jar和common-fileUpload.jar
- 配置多媒体解析器在springMVc.xml中。
<!-- 定义文件上传解析器 -->
<bean id="multipartResolver"
class="org.springframework.web.multipart.commons.CommonsMultipartResolver">
<!-- 设定默认编码 -->
<property name="defaultEncoding" value="UTF-8"></property>
<!-- 设定文件上传的最大值5MB,5*1024*1024 -->
<property name="maxUploadSize" value="5242880"></property>
</bean>
- 书写pictureController.java
- 流程是,获取磁盘文件,然后从FastDFS中获取文件存储路径,然后与FastDFS的ip组合成新的访问网址。
@Controller
public class PictureController {
@Value("${IMAGE_SERVER_URL}")
private String IMAGE_SERVER_URL;
@RequestMapping(value="/pic/upload")
@ResponseBody
public Map uploadFile(MultipartFile uploadFile) {
try {
//把图片上传的图片服务器
FastDFSClient fastDFSClient = new FastDFSClient("classpath:conf/client.conf");
//取文件扩展名
String originalFilename = uploadFile.getOriginalFilename();
String extName = originalFilename.substring(originalFilename.lastIndexOf(".") + 1);
//得到一个图片的地址和文件名
String url = fastDFSClient.uploadFile(uploadFile.getBytes(), extName);
//补充为完整的url
url = IMAGE_SERVER_URL + url;
//封装到map中返回
Map result = new HashMap<>();
result.put("error", 0);
result.put("url", url);
return result;
} catch (Exception e) {
e.printStackTrace();
Map result = new HashMap<>();
result.put("error", 1);
result.put("message", "图片上传失败");
return result;
}
}
}
- 配置加载文件resource.properties
IMAGE_SERVER_URL=http://192.168.xx.xxx/
- 配置扫描配置文件工具
<!-- 加载配置文件 -->
<context:property-placeholder location="classpath:conf/resource.properties" />
1.4.3. 解决浏览器兼容性问题
- 问题产生的原因在于各个浏览器处理能力不同,但是都能处理字符串,这是最基本的。因此最好返回的数据是String
- @ResponseBody表示直接响应浏览器,不走逻辑视图。如果返回的是对象就会变成json再返回,如果返回的是String,就不会再变了,我们的计划是将返回的数据,手动转成json字符串再返回。这样前台ajax就会接收。
- 使用java-json转换工具类。
- 设置返回值为utf-8类型
@RequestMapping(value="/pic/upload",produces =MediaType.TEXT_PLAIN_VALUE+";charset=utf-8")
1.4.4. 富文本编辑器使用–Kindeditor富文本编辑器
- 下载富文本编辑器的包
- 导入css
<link href="/js/kindeditor-4.1.10/themes/simple/simple.css" type="text/css" rel="stylesheet">
- 导入核心js
<script type="text/javascript" charset="utf-8" src="/js/kindeditor-4.1.10/kindeditor-all-min.js"></script>
- 导入配置语言包–鼠标放上去有提示。
<script type="text/javascript" charset="utf-8" src="/js/kindeditor-4.1.10/lang/zh_CN.js"></script>
- 引入textarea
<textarea style="width:800px;height:300px;visibility:hidden;" name="desc"></textarea>
- 引入javaScript代码,在页面初始化完毕后执行该方法
- 创建Editor,初始化
<script type="text/javascript">
var itemAddEditor ;
//页面初始化完毕后执行此方法
$(function(){
//创建富文本编辑器
itemAddEditor = E3.createEditor("#itemAddForm [name=desc]");
//初始化类目选择和图片上传器
E3.init({fun:function(node){
//根据商品的分类id取商品 的规格模板,生成规格信息。第四天内容。
//E3.changeItemParam(node, "itemAddForm");
}});
});
- 调用创建方法
- 绑定了在哪创建,上传文件的对象。
createEditor : function(select){
return KindEditor.create(select, E3.kingEditorParams);
},
- 同步文本框
//同步文本框中的商品描述
itemAddEditor.sync();
1.4.5. 商品添加
- 面临问题
- 使用pojo接收前台数据
- 返回的数据处理
- 商品id主键的创建处理
- 开发步骤
- 先考虑dao层,添加新商品内容,包含在在商品表中添加数据,和在商品描述表中添加数据,这是对单表的操作,可以直接使用逆向工程来解决问题。
- 根据springMVC特性,我们利用pojo参数,然后对于没有的参数在实现类中再补全该参数。注意pojo中的属性一定要和jsp中的参数一致。
- 对于返回的数据处理采用一个工具类实现
- 对于id主键的处理使用当前时间毫秒值+随机两位数。
public E3Result addItem(TbItem item, String desc) {
//1.生成产品id
long itemId = IDUtils.genItemId();
//2. 补全item属性
item.setId(itemId);
item.setCreated(new Date());
item.setUpdated(new Date());
//3. 向商品数据库表中插入数据
itemMapper.insert(item);
//4.创建一个商品描述表对应的pojo对象
TbItemDesc itemDesc=new TbItemDesc();
//5. 补全属性
itemDesc.setItemId(itemId);
itemDesc.setCreated(new Date());
itemDesc.setItemDesc(desc);
itemDesc.setUpdated(new Date());
//6. 向商品描述表插入数据
itemDescMapper.insert(itemDesc);
//7. 返回成功
return E3Result.ok();
}
1.4.6. dubbo特性
- 如果抛出异常,dubbo会连续执行三次,如果三次都失败就会放弃。抛出异常,待用户处理。