springmvc上传

上传原理图

 

pom.xml

    <dependency>
      <groupId>commons-fileupload</groupId>
      <artifactId>commons-fileupload</artifactId>
      <version>1.3.1</version>
    </dependency>
    <dependency>
      <groupId>commons-io</groupId>
      <artifactId>commons-io</artifactId>
      <version>2.4</version>
    </dependency>
      

    <dependency>
      <groupId>com.fasterxml.jackson.core</groupId>
      <artifactId>jackson-databind</artifactId>
      <version>2.10.0</version>
    </dependency>
    <!-- https://mvnrepository.com/artifact/com.fasterxml.jackson.core/jackson-core -->
    <dependency>
      <groupId>com.fasterxml.jackson.core</groupId>
      <artifactId>jackson-core</artifactId>
      <version>2.10.0</version>
    </dependency>
    <!-- https://mvnrepository.com/artifact/com.fasterxml.jackson.core/jackson-annotations -->
    <dependency>
      <groupId>com.fasterxml.jackson.core</groupId>
      <artifactId>jackson-annotations</artifactId>
      <version>2.10.0</version>
    </dependency>

springmvc.xml

<?xml version="1.0" encoding="UTF-8"?>
<beans xmlns="http://www.springframework.org/schema/beans"
       xmlns:mvc="http://www.springframework.org/schema/mvc"
       xmlns:context="http://www.springframework.org/schema/context"
       xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
       xsi:schemaLocation="
        http://www.springframework.org/schema/beans
        http://www.springframework.org/schema/beans/spring-beans.xsd
        http://www.springframework.org/schema/mvc
        http://www.springframework.org/schema/mvc/spring-mvc.xsd
        http://www.springframework.org/schema/context
        http://www.springframework.org/schema/context/spring-context.xsd">

    <!-- 开启注解扫描 -->
    <context:component-scan base-package="com.long123"/>

    <!-- 视图解析器对象 -->
    <bean id="internalResourceViewResolver" class="org.springframework.web.servlet.view.InternalResourceViewResolver">
        <property name="prefix" value="/WEB-INF/pages/"/>
        <property name="suffix" value=".jsp"/>
    </bean>

    <bean id="multipartResolver" class="org.springframework.web.multipart.commons.CommonsMultipartResolver">
        <property name="maxInMemorySize" value="1000000000"></property>
    </bean>

    <!-- 配置静态文件放行 -->
    <mvc:default-servlet-handler />
    <!-- 开启SpringMVC框架注解的支持 -->
    <mvc:annotation-driven />

</beans>

html 上传

<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
    <title>Title</title>
</head>
<body>

    <h1>上传文件</h1>
    <h3>传统上传</h3>
    <form action="user/uploadFile" method="post" enctype="multipart/form-data">
        选择文件:<input type="file" name="upload">
        <input type="submit" value="load">
    </form>
    <br/>
    <h3>springmvc上传</h3>
    <form action="user/uploadFile2" method="post" enctype="multipart/form-data">
        选择文件:<input type="file" name="upload">
        <input type="submit" value="load">
    </form>
    <br/>
    <h3>springmvc跨服务器上传</h3>
    <form action="user/uploadFile3" method="post" enctype="multipart/form-data">
        选择文件:<input type="file" name="upload">
        <input type="submit" value="load">
    </form>
</body>
</html>

Contorller

package com.long123.Controller;

import com.sun.jersey.api.client.Client;
import com.sun.jersey.api.client.WebResource;
import org.apache.commons.fileupload.FileItem;
import org.apache.commons.fileupload.disk.DiskFileItemFactory;
import org.apache.commons.fileupload.servlet.ServletFileUpload;
import org.springframework.stereotype.Controller;
import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.bind.annotation.ResponseBody;
import org.springframework.web.multipart.MultipartFile;

import javax.servlet.http.HttpServletRequest;
import java.io.File;
import java.util.HashMap;
import java.util.List;
import java.util.Map;

@Controller
@RequestMapping("/user")
public class UserController {
    @RequestMapping("/uploadFile")
    public String uploadFile(HttpServletRequest request) throws Exception {
        // 获取要上传的文件目录
        String realPath = request.getSession().getServletContext().getRealPath("/upload");
        System.out.println(realPath);
        // 创建文件对象
        File file = new File(realPath);
        if (!file.exists()){
            // 路径不存在,创建
            file.mkdirs();
        }
        // 创建磁盘文件项工厂
        DiskFileItemFactory factory = new DiskFileItemFactory();
        ServletFileUpload fileUpload = new ServletFileUpload(factory);
        // 解析request对象
        List<FileItem> items = fileUpload.parseRequest(request);
        // 遍历
        for (FileItem fileItem:items) {
            // 判断文件项是上传的文件还是普通字段
            if (fileItem.isFormField()) {

            }else {
                // 上传文件项
                // 获取文件上传的名称
                String fileName = fileItem.getName();
                // 上传文件
                fileItem.write(new File(file,fileName));
                // 删除临时文件
                fileItem.delete();
            }
        }
        return "success";
    }
    @RequestMapping("/uploadFile2")
    public String uploadFile2(HttpServletRequest request, MultipartFile upload) throws Exception {
        // 获取要上传的文件目录
        String realPath = request.getSession().getServletContext().getRealPath("/upload");
        System.out.println(realPath);
        // 创建文件对象
        File file = new File(realPath);
        if (!file.exists()){
            // 路径不存在,创建
            file.mkdirs();
        }

        // 获取文件上传的名称
        String fileName = upload.getOriginalFilename();
        // 上传文件
        upload.transferTo(new File(file,fileName));
        return "success";
    }

    /**
     * 跨服务器上传
     * @param upload
     * @return
     * @throws Exception
     */
    @RequestMapping("/uploadFile3")
    public String uploadFile3(MultipartFile upload) throws Exception {

        // 图片服务器路径
        String path = "http://localhost:9090/upload/";
        // 获取文件上传的名称
        String fileName = upload.getOriginalFilename();

        //创建客户端对象
        Client client = Client.create();
        // 连接图片服务器
        WebResource webResource = client.resource(path+fileName);
        // 上传文件
        webResource.put(upload.getBytes());
        return "success";
    }
}

layui 上传

<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
    <meta charset="utf-8">
    <title>文件上传</title>
    <link rel="stylesheet" href="${pageContext.request.contextPath}/resources/layui/css/layui.css">
</head>
<body>
<fieldset class="layui-elem-field layui-field-title" style="margin-top: 30px;">
    <legend>常规使用:普通图片上传</legend>
</fieldset>

<div class="layui-upload">
    <button type="button" class="layui-btn" id="test1">上传图片</button>
    <div class="layui-upload-list">
        <img class="layui-upload-img" id="demo1">
        <p id="demoText"></p>
    </div>
</div>


<fieldset class="layui-elem-field layui-field-title" style="margin-top: 30px;">
    <legend>选完文件后不自动上传</legend>
</fieldset>

<div class="layui-upload">
    <button type="button" class="layui-btn layui-btn-normal" id="test8">选择文件</button>
    <button type="button" class="layui-btn" id="test9">开始上传</button>
</div>

<script src="${pageContext.request.contextPath}/resources/layui/layui.js"></script>
<script>
    //一般直接写在一个js文件中
    layui.use(['jquery','upload'], function(){
        var $ = layui.jquery;
        var upload = layui.upload;
        //普通图片上传
        var uploadInst = upload.render({
            elem: '#test1'
            ,url: 'user/uploadFile22'
            ,accept:'images'  // 上传的文件类型
            ,acceptMime: 'image/*'  //打开选择框显示所有图片类型
            ,auto:true // 是否自动上传
            ,field:'upload'  // 表单的name 值  MultipartFile upload
            ,before: function(obj){
                //预读本地文件示例,不支持ie8
                obj.preview(function(index, file, result){
                    $('#demo1').attr('src', result); //图片链接(base64)
                });
            }
            ,done: function(res){
                alert(res)
                //如果上传失败
                if(res.code > 0){
                    return layer.msg('上传失败');
                }
                //上传成功
                return layer.msg('上传成功');
            }
            ,error: function(){
                //演示失败状态,并实现重传
                var demoText = $('#demoText');
                demoText.html('<span style="color: #FF5722;">上传失败</span> <a class="layui-btn layui-btn-xs demo-reload">重试</a>');
                demoText.find('.demo-reload').on('click', function(){
                    uploadInst.upload();
                });
            }
        });

        //选完文件后不自动上传
        upload.render({
            elem: '#test8'
            ,url: 'user/uploadFile22'
            ,auto: false
            //,multiple: true
            ,bindAction: '#test9'  //指向一个按钮触发上传
            ,field:'upload'  // 表单的name 值  MultipartFile upload
            ,done: function(res){
                //如果上传失败
                if(res.code > 0){
                    return layer.msg('上传失败');
                }
                //上传成功
                return layer.msg('上传成功');
            },
            error: function() {
                //演示失败状,
                return layer.msg('上传错误,请重试');
            }
        });

    });
</script>
</body>
</html>

Controller

package com.long123.Controller;

import com.sun.jersey.api.client.Client;
import com.sun.jersey.api.client.WebResource;
import org.apache.commons.fileupload.FileItem;
import org.apache.commons.fileupload.disk.DiskFileItemFactory;
import org.apache.commons.fileupload.servlet.ServletFileUpload;
import org.springframework.stereotype.Controller;
import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.bind.annotation.ResponseBody;
import org.springframework.web.multipart.MultipartFile;

import javax.servlet.http.HttpServletRequest;
import java.io.File;
import java.util.HashMap;
import java.util.List;
import java.util.Map;

@Controller
@RequestMapping("/user")
public class UserController {
    @RequestMapping("/uploadFile22")
    @ResponseBody
    public Map<String,Object> uploadFile22(HttpServletRequest request, MultipartFile upload) throws Exception {
        // 获取要上传的文件目录
        String realPath = request.getSession().getServletContext().getRealPath("/upload");
        System.out.println(realPath);
        // 创建文件对象
        File file = new File(realPath);
        if (!file.exists()){
            // 路径不存在,创建
            file.mkdirs();
        }

        // 获取文件上传的名称
        String fileName = upload.getOriginalFilename();
        // 上传文件
        upload.transferTo(new File(file,fileName));

        Map<String,Object> map = new HashMap<String, Object>();
        map.put("code",0);
        map.put("msg","");
        Map<String,Object> data = new HashMap<String, Object>();
        data.put("src",realPath+"/"+fileName);
        map.put("data",data);

        // 返回json 对象
        return map;
    }
}

 

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值