关于java:JTday07

1、京淘商品后盾实现

1.1 京淘后盾表设计

1.2 筹备POJO对象

package com.jt.pojo;
import com.baomidou.mybatisplus.annotation.TableId;
import com.baomidou.mybatisplus.annotation.TableName;
import lombok.Data;
import lombok.experimental.Accessors;
@Data
@TableName("tb_item_desc")
@Accessors(chain = true)
public class ItemDesc extends BasePojo{         //代表商品的详情信息
 @TableId
 private Long itemId;        //商品ID号   不须要主键自增   要求与商品表的数据统一
 private String itemDesc;    //商品详情信息
}

1.3 富文本编辑器介绍

KindEditor是一套开源的HTML可视化编辑器,次要用于让用户在网站上取得所见即所得编辑成果,兼容IE、Firefox、Chrome、Safari、Opera等支流浏览器。

<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<link href="/js/kindeditor-4.1.10/themes/default/default.css" type="text/css" rel="stylesheet">
<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>
<script type="text/javascript" charset="utf-8" src="/js/jquery-easyui-1.4.1/jquery.min.js"></script>

<script type="text/javascript">
    $(function(){
        KindEditor.ready(function(){
            KindEditor.create("#editor")
        })
    })
</script>
</head>
<body>
<h1>富文本编辑器</h1>
<textarea style="width:700px;height:350px" id="editor"></textarea>
</body>
</html>

1.4 重构商品新增操作

1.4.1 编辑ItemController

@RequestMapping("/save")
    public SysResult saveItem(Item item, ItemDesc itemDesc){

        itemService.saveItem(item,itemDesc);
        return SysResult.success();
        /*try {
            itemService.saveItem(item);
            return SysResult.success();
        }catch (Exception e){
            e.printStackTrace();
            return SysResult.fail();
        }*/
    }

1.4.2 编辑ItemServiceImpl

 @Override
 @Transactional             //管制事务
 public void saveItem(Item item, ItemDesc itemDesc) {
 //1、入库商品信息
 item.setStatus(1);         //默认是失常状态
 itemMapper.insert(item);   //执行数据库入库操作,动静生成ID
 //如何实现主键自增的回显性能? 能够通过标签的配置实现,然而MP曾经实现该性能
 //手动须要配置回显信息
 // 实现主键自增的回显
 //    <insert id="" keyProperty="id" keyColumn="id" useGeneratedKeys="true">
 //    </insert>
 //2、入库详情信息 如何保障item与itemDesc主键信息统一?
 itemDesc.setItemId(item.getId());
      itemDescMapper.insert(itemDesc);
   }

1.5 商品详情回显

1.5.1 页面剖析

$.getJSON('/item/query/item/desc/'+data.id,function(_data){
   if(_data.status == 200){
      //UM.getEditor('itemeEditDescEditor').setContent(_data.data.itemDesc, false);
 itemEditEditor.html(_data.data.itemDesc);
   }
});

1.5.2 编辑ItemController

/*
 需要:依据商品ID,查问商品的详情信息
 url地址:
 参数:    商品ID号
 返回值:SysResult对象
 */@RequestMapping("query/item/desc/{itemId}")
public SysResult findItemDescItem(@PathVariable Long itemId){
   ItemDesc itemDesc=itemService.findItemDescById(itemId);
   return SysResult.success(itemDesc);
}

1.5.3 编辑ItemServiceImpl

@Override
    public ItemDesc findItemDescById(Long itemId) {

        return itemDescMapper.selectById(itemId);
    }

1.5.4 页面成果展示

1.6 重构商品批改

1.6.1 编辑ItemController

/**
     * 实现商品批改操作
     * 1.url地址: /item/update
     * 2.申请参数: form表单提交
     * 3.返回值:  SysResult对象
     */
    @RequestMapping("/update")
    public SysResult updateItem(Item item,ItemDesc itemDesc){

        itemService.updateItem(item,itemDesc);
        return SysResult.success();
    }

1.6.2 编辑ItemServiceImpl

//个别更新操作都是依据主键更新
    //Sql: update tb_item set titel=#{xxxx},xx,x,x,x,x, where id=#{xxx}
    @Override
    @Transactional
    public void updateItem(Item item, ItemDesc itemDesc) {
        //依据对象中不为null的元素充当set条件
        itemMapper.updateById(item);
        itemDesc.setItemId(item.getId());
        itemDescMapper.updateById(itemDesc);
    }

1.7 重构商品删除

1.7.1 编辑ItemServiceImpl

//批量删除操作
    @Override
    @Transactional
    public void deleteItems(Long[] ids) {
        List<Long> longList = Arrays.asList(ids);
        //itemMapper.deleteBatchIds(longList);

        //手动的删除数据
        itemMapper.deleteItems(ids);
        itemDescMapper.deleteBatchIds(longList);
    }

2、实现文件上传操作

2.1 入门案例

2.1.1 编辑页面

<body>
    <h1>实现文件长传</h1>
    <!--enctype="开启多媒体标签"  -->
    <form action="http://localhost:8091/file" method="post" 
    enctype="multipart/form-data">
        <input name="fileImage" type="file" />
        <input type="submit" value="提交"/>
    </form>
</body>

2.1.2 编辑FileController(文件上传案例)

package com.jt.controller;
import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.bind.annotation.RestController;
import org.springframework.web.multipart.MultipartFile;
import java.io.File;
import java.io.IOException;
@RestController
public class FileController {
    /*
 url地址:http://localhost:80/file
 步骤:
 1、获取图片的名称
 2、筹备文件上传门路
 3、拼接文件上传的门路
 4、实现文件上传
 */
 @RequestMapping("/file")
    public String file(MultipartFile fileImage) throws IOException {
        //1、获取图片名称
 String name=fileImage.getOriginalFilename();        //专门获取图片名称
 //2、筹备文件上传目录
 String dir="E:/neweclipse/javafour/images";
        //3、利用对象封装门路
 File dirFile=new File(dir);
        if (!dirFile.exists()){
            //如果不存在,则应该创立目录
 dirFile.mkdirs();                               //创立多级目录
 }
        //4、实现文件上传
 File file=new File(dir+"/"+name);
        fileImage.transferTo(file);
        return "操作胜利!!!";
    }
}

2.2 封装文件上传VO对象-imageVO

package com.jt.vo;

import lombok.AllArgsConstructor;
import lombok.Data;
import lombok.NoArgsConstructor;
import lombok.experimental.Accessors;

@Data
@Accessors(chain = true)
@NoArgsConstructor
@AllArgsConstructor
public class ImageVO {
    // {"error":0,"url":"图片的保留门路","width":图片的宽度,"height":图片的高度}
    private Integer error;  //错误信息   0 失常  1 失败
    private String  url;    //图片网址
    private Integer width;  //宽度
    private Integer height; //高度

    //筹备API 简化用户操作
    public static ImageVO fail(){

        return new ImageVO(1, null, null, null);
    }

    public static ImageVO success(String url,Integer width,Integer height){

        return new ImageVO(0,url, width, height);
    }

}

2.3 实现文件上传

2.3.1 页面url剖析


获取参数名称

2.3.2 编辑FileController

@Autowired
    private FileService fileService;
    /**
     * 业务需要: 实现文件上传
     *  1.url地址: http://localhost:8091/pic/upload?dir=image
     *  2.申请参数: uploadFile
     *  3.返回值后果: ImageVO
     */
    @RequestMapping("/pic/upload")
    public ImageVO upload(MultipartFile uploadFile) throws IOException {

        return fileService.upload(uploadFile);
    }

2.3.3 编辑FileServiceImpl

package com.jt.service;
import com.jt.vo.ImageVO;
import org.springframework.stereotype.Service;
import org.springframework.web.multipart.MultipartFile;
import javax.imageio.ImageIO;
import java.awt.image.BufferedImage;
import java.io.File;
import java.io.IOException;
import java.text.SimpleDateFormat;
import java.util.Date;
import java.util.HashSet;
import java.util.Set;
import java.util.UUID;
@Service
public class FileServiceImpl implements FileService {
    //定义文件存储的根目录
 private String fileLocalDir="E:/neweclipse/javafour/images";
    private static Set<String> typeSet=new HashSet<>();
    static{
        typeSet.add(".jpg");
        typeSet.add(".png");
        typeSet.add(".gif");
    }
    /*
 注意事项:
 1、校验是否为图片类型             依据后缀.jpg|.png|jpeg|git
 2、校验是否为恶意程序             宽度、高度
 3、采纳分目录的形式进行数据的存储 1、hash形式 2、工夫单位yyyy/MM/dd/HH
 4、避免文件重名...                UUID.jpg
 */ //String[] typeArray={"",""}
 @Override
 public ImageVO upload(MultipartFile uploadFile) {
        //1、获取图片文件名称
 String fileName=uploadFile.getOriginalFilename();
        fileName=fileName.toLowerCase();             //转小写
 int index=fileName.lastIndexOf(".");    //截取.的地位
 //2、获取图片的类型(后缀)
 String fileType=fileName.substring(index);
        if (!typeSet.contains(fileType)){
            return ImageVO.fail();          //结束任务
 }
        //问题二:避免恶意程序的攻打 图片  宽度和高度
 try {
            //获取图片对象类型
 BufferedImage bufferedImage=ImageIO.read(uploadFile.getInputStream());
            int width=bufferedImage.getWidth();
            int height=bufferedImage.getHeight();
            if (width==00||height==0){
                return ImageVO.fail();
            }
            /*
 三:分目录存储 以工夫为维度截串 /yyyy/MM/dd/ */ String dateDir=new SimpleDateFormat("/yyyy/MM/dd/").format(new Date());//格式化工夫
 String fireDir=fileLocalDir+dateDir;
            File imageFileDir=new File(fireDir);
            if (!imageFileDir.exists()){
                //动静生成文件目录
 imageFileDir.mkdirs();
            }
            /*
 四:避免文件重名,动静生成文件名称uuid.jpg
 uuid    32位16进制数
 */ String uuid= UUID.randomUUID().toString().replace("-","");
            String realFileName=uuid+fileType;
            //fireDir/uuid.jpg
 File realFile=new File(fireDir+realFileName);
            uploadFile.transferTo(realFile);
            //如果程序一切正常
 String url="https://img14.360buyimg.com/n0/jfs/t1/131263/12/14456/317758/5fa140b6E51e62e38/efeded24003dd05a.jpg";
            return ImageVO.success(url,width,height);
        } catch (IOException e) {
            //将咱们查看异样,转化为运行时异样
 e.printStackTrace();
            //throw new RuntimeException(e);
 return ImageVO.fail();
        }
    }
}

2.3.4 页面成果展示

评论

发表回复

您的邮箱地址不会被公开。 必填项已用 * 标注

这个站点使用 Akismet 来减少垃圾评论。了解你的评论数据如何被处理