上传用户logo功能

最新推荐文章于 2022-10-24 12:32:25 发布

原创最新推荐文章于 2022-10-24 12:32:25 发布 · 341 阅读

0 ·

CC 4.0 BY-SA版权

javaweb 专栏收录该内容

17 篇文章

订阅专栏

本文主要介绍了如何在后台实现用户上传Logo的功能。通过后台controller方法处理用户的上传请求，确保文件上传的安全性和有效性。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

重要代码如下：

                    //用户权限的判断，不用管
 <c:set var="isShow" value="${sessionScope.userSession.type==0  || customer == null }" />
                                        <c:if test="${isShow == false && sessionScope.userSession.type!=1 }">
                                        //logo上传的路径
                                            <input name="filePath" type="hidden" id="filePath" value="${customerProperty.logo}"/>  //customerProperty是从一个后台controller调用service查询数据库的方法，查询出的集合值，通过jstl <c:forEach>标签遍历出来的var变量
                                        <div class="form-group">
                                            <label class="control-label col-md-3">LOGO

                                        </label>


                                        <div class="col-md-4">
                                        //这块儿做上传后的logo实时显示。
                                            <img src="${customerProperty.logo}"
                                                 id="showLogo" />

                                        </div>
                                    </div>



                                    <div class="form-group">
                                        <label class="control-label col-md-3">上传LOGO
                                        </label>
                                        <div class="col-md-4">
                                            <input type="file" class="form-control fileChange"
                                                   //onchange事件
                                                   onchange="saveCustomerPropertyLogo(this)" accept="image/png,image/jpg,image/jpeg,image/gif"    //用户可上传logo的文件类型限制
                                                   id="uploadFile" />
                                        </div>
                                    </div>

                                    </c:if>




 var res = null;
    /**
     *  上传logo   通过ajax往后台controller方法传值
     */
    function saveCustomerPropertyLogo(obj){

        var cid = $('input[name="id"]').val();
        var formData = new FormData();

        formData.append("cid",cid);                     //当前客户cid
        formData.append("file", $(obj).get(0).files[0]);  //当前客户所上传logo

            $.ajax({
                url: "customer/uploadLogo.smk",
                type: "POST",
                data: formData,
                async:false,
                processData: false,
                contentType: false,
                success: function (data) {
                    res = JSON.parse(data)
                    if( res.status == 200){
                      $('input[name="filePath"]').val(res.data);
                      $("#showLogo").attr('src',"upload/"+res.data)
                    }else{
                        msgModal("上传失败！！")
                    }
                    if (res.nologin === true) {
                        msgModal('登录超时,请点击确定重新登录', 'login/logout.smk');
                    }
                },
                error: function (data) {
                    alert("上传出错，请稍后再试(#^.^#)");

                }

            })

    }

后台controller方法

   /**
     * 接收用户上传logo
     * @param uploadFile
     * @param cid
     * @return
     */
    @RequestMapping(value = "uploadLogo", method = RequestMethod.POST)
    public @ResponseBody
    ResponseResult uploadLogo(@RequestParam(value = "file") MultipartFile uploadFile,
                              @RequestParam(value = "cid") String cid) {
        ResponseResult responseResult = new ResponseResult();
        responseResult.setStatus(500);
        /* 获取上传logo类型 */
        String fileType = uploadFile.getContentType();
        String fileName = uploadFile.getOriginalFilename().substring(uploadFile.getOriginalFilename().indexOf("."),
                uploadFile.getOriginalFilename().length());
        /* 校验用户上传logo类型 */
        if (fileType.endsWith("png") || fileType.endsWith("jpg") || fileType.endsWith("jpeg") || fileType.endsWith("gif")) {
            /* 上传logo时间 */
            String curTime = BaseUtils.getNow(BaseUtils.getConfigValue("template.datetime_format_full"));
            /* logo保存地址 */
            String logoPath = "logoupload/" + cid + "/" + curTime + fileName;
            /* 文件下载地址 */
            String uploadBasePath = BaseUtils.getConfigValue("upload.base.path");
            /* 保存用户上传logo文件 */
            boolean saveStatus = BaseUtils.saveFile(uploadFile, uploadBasePath + logoPath);
            if (saveStatus) {
                responseResult.setStatus(200);
                responseResult.setData(logoPath);
            }
        }
        return responseResult;
        
        
    }