基於Java得黑馬頭條專案------day05

程式設計師DD發表於2020-11-12

第五章的內容主要涉及到圖片上傳,用的是fastDFS這個分散式檔案儲存系統用了很多在其他專案裡面,所以在搭建的時候沒有講搭建過程,所以如果沒有這個fastDFS做這個專案的這個步驟會比較吃力

下面就是fastDFS的介面的編寫,還是簡單的老三樣實在沒什麼寫的了,就是簡單的複製貼上,瞬間感覺程式設計簡單了很多。

首先是搭建後臺的前端服務,在搭建的時候一定要先把他包裡的這個node_modules這個給刪除了,自己在執行npm install, npm run dev, 之後才可以正常的執行這個前端的功能

這裡面有個預設的使用者名稱和密碼,賬號是zhangsan 密碼是123,在ap_user這個庫裡面存者的可以自己看看有沒有沒有的話新增一個,他也沒有做加密的處理,很簡單的

下面的介面開發是內容管理裡面的素材管理裡面下的檔案上傳的這個介面,這個介面鋪墊了很多東西,其實就是個API的呼叫,搭建環節久不在贅述了,太簡單了實在

圖片上傳介面:

直接上檔案上傳的介面實現,找裡面的程式碼直接複製久行

 

  public ResponseResult uploadPicture(MultipartFile multipartFile) {
        //獲取當前登入使用者
        WmUser wmUser = WmThreadLocalUtils.getUser();
        if(wmUser==null){
            return ResponseResult.errorResult(AppHttpCodeEnum.NEED_LOGIN);
        }
        //驗證引數
        if(multipartFile==null){
            return ResponseResult.errorResult(AppHttpCodeEnum.PARAM_INVALID);
        }
        //上傳圖片到fastdfs
        String originalFilename = multipartFile.getOriginalFilename();//aa.jpg
        String extName = originalFilename.substring(originalFilename.lastIndexOf(".")+1);
        if(!extName.matches("(gif|png|jpg|jpeg)")){
            return ResponseResult.errorResult(AppHttpCodeEnum.PARAM_IMAGE_FORMAT_ERROR);
        }
        String fileId = null;
        try {
            fileId = fastDfsClient.uploadFile(multipartFile.getBytes(), extName);
        } catch (Exception e) {
            e.printStackTrace();
            log.error("user {} upload file {} to fastDfs error,error info:n", wmUser.getId(),originalFilename,e.getMessage());
            return ResponseResult.errorResult(AppHttpCodeEnum.SERVER_ERROR);
        }
        //上傳成功後,儲存一條資料wm_material
        WmMaterial wmMaterial = new WmMaterial();
        wmMaterial.setCreatedTime(new Date());
        wmMaterial.setType((short)0);
        wmMaterial.setUrl(fileId);
        wmMaterial.setIsCollection((short)0);
        wmMaterial.setUserId(wmUser.getId());
        wmMaterialMapper.insert(wmMaterial);
        wmMaterial.setUrl(fileServerUrl+fileId);
        return ResponseResult.okResult(wmMaterial);
    }

需要改的地方就是Fastdfs的IP地址需要改成虛擬機器的地址,如果沒有虛擬機器的同學這個步驟久沒辦法做了

進行圖片上傳測試,Controller接收到圖片上傳的請求

前端頁面渲染圖片成功

資料庫裡面的資料儲存成功

下面的就是圖片刪除的介面地址:

 @Override
    public ResponseResult delPicture(WmMaterialDto dto) {
        WmUser user = WmThreadLocalUtils.getUser();
        if(dto==null || dto.getId() ==null){
            return ResponseResult.errorResult(AppHttpCodeEnum.PARAM_INVALID);
        }

        //刪除fastdfs中的圖片 先去判斷當前圖片有沒有關聯
        WmMaterial wmMaterial = wmMaterialMapper.selectByPrimaryKey(dto.getId());
        if(wmMaterial==null){
            return ResponseResult.errorResult(AppHttpCodeEnum.PARAM_INVALID);
        }
        int count = wmNewsMaterialMapper.countByMid(wmMaterial.getId());
        if(count > 0){
            return ResponseResult.errorResult(AppHttpCodeEnum.PARAM_INVALID,"當前圖片被引用");
        }
        String fileId = wmMaterial.getUrl().replace(fileServerUrl,"");
        try {
            fastDfsClient.delFile(fileId);
        } catch (Exception e) {
            e.printStackTrace();
            log.error("user {} delete file {} from fastDfs error,error info :n",user.getId(),fileId,e.getMessage());
            return ResponseResult.errorResult(AppHttpCodeEnum.SERVER_ERROR);
        }
        //刪除 wm_material表中的資料
        wmMaterialMapper.deleteByPrimaryKey(dto.getId());
        return ResponseResult.okResult(AppHttpCodeEnum.SUCCESS);
    }

這個刪除的介面也是很簡單的一個方法久實現了,非常簡單,就是查詢,然後判斷,然後刪除

查詢素材列表的介面資訊,

介面資訊情況如下

    @Override
    public ResponseResult findList(WmMaterialListDto dto) {
        //驗證引數
        dto.checkParam();
        //獲取使用者
        Long uid = WmThreadLocalUtils.getUser().getId();
        //查詢
        List<WmMaterial> datas = wmMaterialMapper.findListByUidAndStatus(dto, uid);
        datas = datas.stream().map((item)->{
            item.setUrl(fileServerUrl+item.getUrl());
            return item;
        }).collect(Collectors.toList());
        int total = wmMaterialMapper.countListByUidAndStatus(dto, uid);
        //返回
        Map<String,Object> resDatas = new HashMap<>();
        resDatas.put("curPage",dto.getPage());
        resDatas.put("size",dto.getSize());
        resDatas.put("list",datas);
        resDatas.put("total",total);
        return ResponseResult.okResult(resDatas);
        
    }

下面是測試資訊:查詢素材列表成功

下面是刪除的介面

刪除成功:

最後是收藏和取消收藏的介面資訊

收藏和取消收藏的介面資訊:久一行程式碼解決

  @Override
    public ResponseResult changeUserMaterialStatus(WmMaterialDto dto, Short type) {
        if(dto ==null || dto.getId()==null){
            return ResponseResult.errorResult(AppHttpCodeEnum.PARAM_INVALID);
        }
        //獲取使用者資訊
        WmUser user = WmThreadLocalUtils.getUser();
        wmMaterialMapper.updateStatusByUidAndId(dto.getId(),user.getId(),type);
        return ResponseResult.okResult(AppHttpCodeEnum.SUCCESS);
    }

 

前端頁測試

收藏頁顯示了兩個圖片資訊收藏成功:

接下來的介面就是文章資訊管理的功能,也是文章管理模組的對應的介面的開發

文章管理主要文章釋出和儲存草稿介面的定義入下所示

程式碼

   public ResponseResult saveNews(WmNewsDto dto, Short type) {
  //      如果使用者傳遞引數為空或文章內容為空返回PARAM_REQUIRE錯誤
        if(dto==null || StringUtils.isEmpty(dto.getContent())){
            return ResponseResult.errorResult(AppHttpCodeEnum.PARAM_INVALID);
        }
        //如果使用者本次為修改操作那麼先刪除資料庫關聯資料
        if(dto.getId()!=null){
            wmNewsMaterialMapper.delByNewsId(dto.getId());
        }
        //將使用者提交的文章內容解析轉為Map結構的資料
        String content = dto.getContent();
        Map<String,Object> materials;
        try {
            List<Map> list = objectMapper.readValue(content, List.class);
            //抽取資訊
            Map<String,Object> extractInfo = extractUrlInfo(list);
            //圖片map資訊
            materials = (Map<String, Object>) extractInfo.get("materials");
            //圖片數量
            int countImageNum = (int) extractInfo.get("countImageNum");
            //儲存或修改文章的資料
            WmNews wmNews = new WmNews();
            BeanUtils.copyProperties(dto,wmNews);
            if(dto.getType().equals(WmMediaConstans.WM_NEWS_TYPE_AUTO)){
                saveWmNews(wmNews,countImageNum,type);
            }else{
                saveWmNews(wmNews,dto.getType(),type);
            }
            //儲存內容中的圖片和當前文章的關係
            if(materials.keySet().size()!=0){
                ResponseResult responseResult = saveRelationInfoForContent(materials,wmNews.getId());
                if(responseResult!=null){
                    return responseResult;
                }
            }
            //儲存封面圖片和當前文章的關係
            ResponseResult responseResult = coverIamgesRelation(dto,materials,wmNews,countImageNum);
            //流程處理完成返回處理結果

        } catch (IOException e) {
            e.printStackTrace();
        }

        return null;
    }

列表查詢正常

儲存文章成功

文章列表介面:

內容介面分頁查詢成功

分頁查詢介面資訊:

  @Override
    public ResponseResult listByUser(WmNewsPageReqDto dto) {
        if(dto==null){
            return ResponseResult.errorResult(AppHttpCodeEnum.PARAM_INVALID);
        }
        dto.checkParam();
        Long uid = WmThreadLocalUtils.getUser().getId();
        List<WmNews> datas = wmNewsMapper.selectBySelective(dto, uid);
        int total = wmNewsMapper.countSelectBySelective(dto, uid);
        PageResponseResult responseResult = new PageResponseResult(dto.getPage(),dto.getSize(),total);
        responseResult.setData(datas);
        responseResult.setHost(fileServerUrl);
        return responseResult;
    }

在進行分頁查詢得時候回出現一個欄位找不到吧wmNewsMapper裡面得enable屬性欄位刪除即可

 

修改稽核狀態介面資訊

 

    @Override
    public ResponseResult findWmNewsById(WmNewsDto dto) {
        if(dto == null || dto.getId()==null){
            return ResponseResult.errorResult(AppHttpCodeEnum.PARAM_REQUIRE,"文章ID不可缺少");
        }
        WmNews wmNews = wmNewsMapper.selectNewsDetailByPrimaryKey(dto.getId());
        if(wmNews==null){
            return ResponseResult.errorResult(AppHttpCodeEnum.DATA_NOT_EXIST,"文章不存在");
        }
        ResponseResult responseResult = ResponseResult.okResult(wmNews);
        responseResult.setHost(fileServerUrl);
        return responseResult;
    }

刪除文章介面

    public ResponseResult delNews(WmNewsDto dto) {
        if(dto ==null || dto.getId()==null){
            return ResponseResult.errorResult(AppHttpCodeEnum.PARAM_INVALID);
        }
        //查詢文章
        WmNews wmNews = wmNewsMapper.selectNewsDetailByPrimaryKey(dto.getId());
        //文章是否存在
        if(wmNews==null){
            return ResponseResult.errorResult(AppHttpCodeEnum.DATA_NOT_EXIST,"文章不存在");
        }
        //當前文章是否稽核通過  app
        if(WmMediaConstans.WM_NEWS_AUTHED_STATUS.equals(wmNews.getStatus())||WmMediaConstans.WM_NEWS_PUBLISH_STATUS.equals(wmNews.getStatus())){
            return ResponseResult.errorResult(AppHttpCodeEnum.PARAM_INVALID,"當前文章已通過稽核不可刪除");
        }
        //刪除文章與素材的關係
        wmNewsMaterialMapper.delByNewsId(wmNews.getId());
        //刪除文章
        wmNewsMapper.deleteByPrimaryKey(wmNews.getId());
        return ResponseResult.okResult(AppHttpCodeEnum.SUCCESS);
    }

以上就是黑馬頭條得文章釋出相關得介面資訊,基本都可以實現,沒有什麼難度,就是在進fastDFS進行檔案儲存得時候需要有一個圖片伺服器才可以,不然後面得文章內容都無法操作,如果有得話,基本就沒問題了

相關文章