LayUI upload 控件上传提示 404 找不到后台请求方法。

1.本次上传文件Excel批量导入文件。

上传页面layui写法,弹框页面如图。

<li class="layui-timeline-item">
    <i class="layui-icon layui-timeline-axis"></i>
    <div class="layui-timeline-content layui-text">
        <h3 class="layui-timeline-title">3、选择并上传</h3>
        <p>根据下载/导出的模板，编辑人员信息</p><br/>
        <div class="layui-upload">
            <button type="button" class="layui-btn layui-btn-sm layui-btn-normal" id="test10">选择人员</button>
            <button type="button"  class="layui-btn layui-btn-sm" id="test100">开始上传</button>
        </div>
    </div>
</li>

2.接下来完成js方法。

top.$("#addAndEdit_class #exp_people_btn").off("click");
top.$("#addAndEdit_class #exp_people_btn").on("click", function () {		
    var expUserWindow = top.layer.open({
        type: 1,
        title: '导入人员',
        maxmin: true,
        area: ['750px', '400px'],
        content: $("#addAll2").html(),
        btn: ['确定', '取消'],
        yes: function () { // 确定按钮点击事件
            top.layer.close(expUserWindow);
            $("#addAll2").hide();							
            return false;
        },
        cancel: function () { // 右上角关闭回调
            top.layer.close(expUserWindow);
            $("#addAll2").hide();
        },
        btn2: function () {
            top.layer.close(expUserWindow);
            $("#addAll2").hide();
        },
        success: function (layero, index) { // 弹框弹出成功后的回调
            window.parent.reRenderForm();
            top.layui.use('upload', function(){
            var $ = top.layui.jquery,upload = top.layui.upload;  

                //选完文件后不自动上传 
                        upload.render({
                        elem: '#test10'
                        ,url: "${pageContext.request.contextPath}/customer/importCustomers"
                        ,accept: 'file' //普通文件
                        ,auto: false
                        ,field:'filess'
                        ,exts: 'xls' 
                        ,bindAction: '#test100' 
                        ,done: function(res){
                            console.log(res)
                            openPopup(res);
                        }
                        ,before: function(){
                            var index = top.layer.load(0, {shade: false}); //0代表加载的风格，支持0-2
                            //loading层
                            index = top.layer.load(1, {
                                shade: [0.5,'#ccc'],//0.1透明度的白色背景
                            });
                            setTimeout(function () {
                                top.layer.close(index)
                            }, 2000)
                        }
                    });
                
                });					
            }
    });
})

3.完成java后台请求接口。
注意因为upload控件返回必须是json数据所以要加上    @ResponseBody  注解

/**
* Customers Excle 批量导入
* @param file
* @return
* @throws Exception
*/
@RequestMapping(value="/importCustomers",method = {RequestMethod.POST})
@ResponseBody
public Map<String,Object> importEmpls(@RequestParam(value = "filess", required = true) MultipartFile[] file) throws Exception{
    PageData pageData = getPageData();
    pageData.put("filess",file);
    pageData.put("createId", getCreateID());
    pageData.put("createTime", getCreateTime());
    Map<String,Object> map= kpxCustomerService.importCustomers(pageData);
    logger.debug(map.toString());
    return map;
}

4.如果不加上注解，实际上后台已经接受到请求，而浏览器则是报错404找不到。

5.加上注解之后则是正常的，点击上传显示正在上传，到最后的完成上传。