淘淘商城项目：Day3
Day3
淘淘商城第三天的内容主要是实现商品添加功能。主要功能分为以下几个部分：
1）商品类目选择；
2）图片服务器搭建；
3）图片上传功能；
4）富文本编辑器的使用以及商品添加功能的实现。
1、商品类目选择。
该部分需要显示商品的树状图，这部分教程视频出现卡顿看不见代码编写，所以主要参考网上资料，不是特别理解。不过还是实现了功能。
2、图片服务器的搭建。
该部分实现方式是CentOs6.5 + Nginx + vsftpd。在系统中安装CentOs6.5系统的虚拟机，然后搭建Nginx的http服务以及vsftpd的ftp文件上传服务，并且在OS宿主系统中使用FileZilla软件测试ftp上传文件的功能。主要参考了http://blog.csdn.net/yx0628/article/details/53148451以及http://blog.csdn.net/vchen_hao/article/details/53925082等博客进行安装。
3、图片上传功能的实现。
第一步，导入common-fileupload的依赖。
commons-fileupload
commons-fileupload
@Service
public class PictureServiceImpl implements PictureService {
@Value("${FTP_ADDRESS}")
private String FTP_ADDRESS;
@Value("${FTP_PORT}")
private Integer FTP_PORT;
@Value("${FTP_USERNAME}")
private String FTP_USERNAME;
@Value("${FTP_PASSWORD}")
private String FTP_PASSWORD;
@Value("${FTP_BASE_PATH}")
private String FTP_BASE_PATH;
@Value("${IMAGE_BASE_URL}")
private String IMAGE_BASE_URL;
@Override
public Map uploadPicture(MultipartFile uploadFile) {
Map resultMap = new HashMap<>();
try {
String oldname = uploadFile.getOriginalFilename();
//UUID.randomUUID();
//图片名字生成
String newname = IDUtils.genImageName();
newname = newname + oldname.substring(oldname.lastIndexOf("."));//添加后缀，如jpg
//图片上传
String imagepath = new DateTime().toString("/yyyy/MM/dd");
boolean result = FtpUtil.uploadFile(FTP_ADDRESS, FTP_PORT, FTP_USERNAME, FTP_PASSWORD,FTP_BASE_PATH,
imagepath, newname, uploadFile.getInputStream());
if(!result) {
resultMap.put("error", 1);
resultMap.put("message", "文件上传失败");
return resultMap;
}
resultMap.put("error", 0);
resultMap.put("url", IMAGE_BASE_URL + imagepath + "/" + newname);
return resultMap;
}catch(Exception e) {
resultMap.put("error", 1);
resultMap.put("message", "文件发生异常");
return resultMap;
}
}
}2）图片名字生成使用IDUtils工具类，其实就是上传时间（毫秒级）加上0-999之间的一个随机数。
第四步，Controller层的实现。
@Controller
public class PictureController {
@Autowired
private PictureService pictureService;
@RequestMapping("/pic/upload")
@ResponseBody
public String pictureUpload(MultipartFile uploadFile) {
Map result = pictureService.uploadPicture(uploadFile);
String json = JsonUtils.objectToJson(result);
return json;
}
}4、新增商品实现。
1）Dao层，直接使用逆向工程生成的代码。
2）Service层，实现补全item的信息（前端只提交了部分信息，还有上传日期、商品id等信息需要补全）并将商品添加到数据库的功能，返回添加结果。
3）Controller层，使用TbItem接收前端发来的信息，此处注意TbItem的属性值需要和jsp中属性值的id对应上，这样controller可以将内容对应上。然后直接调用Service层方法，将新的商品信息添加到数据库，最后返回添加结果（添加成功）。
心得：熟悉了开发过程。首先分析前端页面向后端传输什么值，触发的URL访问路径，以及需要接收的值（一般是一定格式的JSON数据）。后端通常可以用POJO接收前端传来的数据，好处是封装数据，操作方便。然后找到对应的controller层（@RequestMapping（“URL”））调用service方法进行处理之后，返回处理消息（通常为json消息，@ResponseBody）。json消息可以返回POJO、MAP和String类型的数据，后端会把消息转化称JSON格式的数据，这样前端就能接收到值，得到反馈。