您现在的位置:首页 >> 前端 >> 内容

前端上传pdf文件到阿里云服务器的实现方法

时间:2018/6/2 13:49:37 点击:

  核心提示:一 需求上传pdf文件到阿里云服务器二 代码html:span style=font-family:SimHei;p class=modal-body form id=uploadReportForm...

一 需求

上传pdf文件到阿里云服务器

二 代码

html:

<span style="font-family:SimHei;"><p class="modal-body">  
     <form id="uploadReportForm" action="" class="form-horizontal" enctype ="multipart/form-data">  
           <input type="file" id="reportFilePDF" name="reportFilePDF" accept="application/pdf"/>  
           <input type="hidden" id="uploadReportBookingId" name="bookingId"/>  
     </form>  
 </p>  
 <p class="modal-footer left">  
      <a href="###" class="btn btn btn-primary btn-primary-outline btnOK" id="reportModalOk">确认</a>  
      <a href="###" class="btn btn-default btn-primary-outline" data-dismiss="modal">取消</a>  
 </p></span>  

jquery:

<span style="font-family:SimHei;">$('#reportModalOk').on("click",function () {  
            if($("#reportFilePDF").val()==""||$("#reportFilePDF").val()==null) {  
                toastr.warning("请选择需要上传的PDF文件");  
                return;  
            }else {  
                var url = "";  
                var formData = new FormData($("#uploadReportForm")[0]);  
                //ajax  
            }  
        })</span>  

java:

 @RequestMapping("/..")  
 @ResponseBody  
 public RspResult uploadReportByBookingId(@RequestParam("reportFilePDF") MultipartFile reportFilePDF, HttpServletRequest request, HttpServletResponse response){  
            String aaa = request.getParameter("id");//获取其他参数  
     。。。//上传  
 }  

三 总结

其实有个几个坑:

1 后台接收不到值

 controller接受的参数名和<input type = "file" name = "name"> name 要一样 

2 org.thymeleaf.exceptions.TemplateInputException 异常

controller添加 @ResponseBody 返回json格式

希望可以帮助到需要的人,虽然简单,但是也有不少坑。全站工程师是未来的趋势,后台既要有扎实的基本功,前端常用功能也要会,玩弄各种插件,跑的贼溜;运维也要会,熟练常用llinux命令;只有打好了基本功,才能研究更深的技术。

作者:网络 来源:u014425865