zoukankan      html  css  js  c++  java
  • HTML5 通过 FileReader 实现文件上传

    概述

    在页面中上传时,之前一般都是需要使用form表单进行上传。html5 中提供了FileReader 可以将文件转换成Base64编码字符串,因此就可以直接使用

    AJAX实现文件上传。

    实现代码

    1.前端JS代码

    var url= /*[[@{/sys/upload}]]*/ ;
        function uploadFile(){
            var file = document.getElementById("file").files[0];
            var reader = new FileReader();
            reader.readAsDataURL(file);
            reader.onload = function(e){ 
                // ajax 上传图片
                $.post(url, { data: e.target.result},function(ret){
                   console.info(ret);
                },'json');
            } 
        }

    2.后端代码

    @RequestMapping("/sys/upload")
        public JSONObject upload(HttpServletRequest request) {
            JSONObject json=new JSONObject();
            String data=request.getParameter("data");
            
            int  idx=data.indexOf(",");
            String fileBase64=data.substring(idx+1);
            byte[] fileBytes= Base64.decodeBase64(fileBase64);
            
            writeByte("d:\file.jar", fileBytes);
            
            json.put("success", true);
           
            return json;
        }

    在后端代码接收的是base64 编码,转换成bytes后写入文件。

  • 相关阅读:
    DelphiXE
    Delphi_检查exe文件是否是"随机基址"
    Delphi_按字节比较两个文件
    HTTP 头部
    NumberFormat usage
    tomcat 配置
    android 与JS之间的交互
    离线安装SDK
    Android SDK更新 Connection to http://dl-ssl.google.com refused
    自定义圆形图片
  • 原文地址:https://www.cnblogs.com/yg_zhang/p/9997395.html
Copyright © 2011-2022 走看看