关于Springboot+bootstraps的文件上传和解析xml(二)

本文介绍了使用Springboot结合Bootstraps进行文件上传的步骤,包括前端js函数、控制器层的方法调用、根据返回类型跳转HTML页面、相关JS操作以及上传接口URL的执行实例。同时,也涉及到XML的解析过程。

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

1.首先在前端js页面有一个函数:

function xmlUpload(id){
    layer.open({
        type : 2,
        title : '上传',
        maxmin : true,
        shadeClose : false, // 点击遮罩关闭层
        area : [ '600px', '300px' ],
        content : '/dim/dimFault/import/'+id // iframeurl
    });
}

<了解Layui.layer这个弹层组件>

2:跳转到controller层中执行方法:

/**
 * xml故障上传
 */
@GetMapping("/import/{id}")
@RequiresPermissions("dim:dimFault:import")
String importHtml(@PathVariable("id") String id,Model model){
   model.addAttribute("id", id);
   return "dim/dimFault/import";
}

3:根据方法中的返回类型,跳转到html中去

<!DOCTYPE html>
<html>
<meta charset="utf-8">
<head th:include="include :: header"></head>
<body class="gray-bg">
<div class="wrapper wrapper-content ">
  <div class="row">
    <div class="col-sm-12">
      <div class="ibox float-e-margins">
        <div class="ibox-content">
          <form class="form-horizontal m-t" id="signupForm" enctype="multipart/form-data">
            <div class="form-group">
              <label class="col-sm-3 control-label">文件:</label>
              <div class="col-sm-8">
                <input id="file" name="file" class="form-control" type="file">
              </div>
            </div>
            <input id="id" name="id" th:value="${id}" class="form-control" type="hidden">
            <div class="form-group">
              <div class="col-sm-8 col-sm-offset-3">
                <button type="submit" class="btn btn-primary" id="commitButton">提交</button>
              </div>
            </div>
          </form>
        </div>
      </div>
    </div>
  </div>
</div>
<div th:include="include::footer"></div>
<link href="/css/layui.css" rel="stylesheet">
<script src="/js/layui.js"></script>
<script type="text/javascript" src="/js/appjs/dim/dimFault/import.js">
</script>
</body>
</html>

4:则会有相对应的js页面:

$().ready(function () {
    validateRule();
});

$.validator.setDefaults({
  submitHandler: function () {
    save();//设置默认方法 ajax
  }
});

layui.use('upload', function () {
    var upload = layui.upload;
    //执行实例
    var uploadInst = upload.render({
        elem: '#file', //绑定元素
        url: '/common/sysFile/faultImport', //上传接口
        size: 20000,
        auto: false,
        accept: 'file',
        exts:"xml",
        bindAction: '#commitButton',
        done: function (r) {//上传完毕回调
            $.ajax({
                cache : true,
                type : "POST",
                url : "/dim/dimProtocol/updateProtocolId",
                data : {
                    protocolId:$("#id").val()
                },// 你的formid
                async : false,
                error : function(request) {
                    parent.layer.alert("Connection error");
                },
                success : function(data) {
                    if (data.code == 0) {
                        parent.layer.msg("操作成功");
                        parent.reLoad();
                        var index = parent.layer.getFrameIndex(window.name); // 获取窗口索引
                        parent.layer.close(index);

                    } else {
                        parent.layer.alert(data.msg)
                    }
                }
            });
        },
        error: function (r) {
        }
    });
});

function validateRule() {
    var icon = "<i class='fa fa-times-circle'></i> ";
    $("#signupForm").validate({
        rules: {
            name: {
                required: true
            }
        },
        messages: {
            name: {
                required: icon + "请输入姓名"
            }
        }
    })
}

function save() {
}

<里面的参数字段具体参照jQuery和Layui>

<一般一个请求包含:请求前的验证,请求的传输,请求的关闭>

5:在执行实例中有上传接口url

/故障明细解析
@ResponseBody
@PostMapping("/faultImport")
R faultImport(@RequestParam("file") MultipartFile file, HttpServletRequest request) throws MalformedURLException {
  String fileName = file.getOriginalFilename();
  fileName = fileName.substring(0,fileName.lastIndexOf("."))+System.currentTimeMillis()+fileName.substring(fileName.lastIndexOf("."),fileName.length());
  SAXReader reader = new SAXReader();
  try {
    FileUtil.uploadFile(file.getBytes(), bootdoConfig.getUploadPath()+"xml/", fileName);
    //删除9999协议
    dimFaultService.deleteByProtocolId(9999);
    // 通过reader对象的read方法加载books.xml文件,获取docuemnt对象。
    Document document = reader.read(new File(bootdoConfig.getUploadPath()+"xml/"+fileName));
    // 通过document对象获取根节点faultStore
    Element faultStore = document.getRootElement();
    // 通过element对象的elementIterator方法获取迭代器
    Iterator it = faultStore.elementIterator();
    while (it.hasNext()) {
      Element fault = (Element) it.next();
      //解析子节点的信息
      Iterator itt = fault.elementIterator();
      while (itt.hasNext()) {
        Element faultChild = (Element) itt.next();
        if("Fault".equals(faultChild.getName())){
          List list = faultChild.attributes();
          DimFaultDO dimFault = new DimFaultDO();
          for(int i=0;i<list.size();i++){
            Attribute item = (Attribute)list.get(i);
            if(i==0){
              dimFault.setFaultCode(item.getValue());
            }else if(i==1){
              dimFault.setFaultPortno(item.getValue());
            }else if(i==2){
              dimFault.setFaultPorttype(item.getValue());
            }else if(i==3){
              dimFault.setFaultBitoffset(item.getValue());
            }else if(i==4){
              dimFault.setFaultName(item.getValue());
            }else if(i==5){
              dimFault.setFaultSystem(item.getValue());
            }else if(i==7){
              dimFault.setFaultDesc(item.getValue());
            }else if(i==8){
              dimFault.setFaultDeal(item.getValue());
            }
            dimFault.setProtocolId("9999");
          }
          dimFaultService.save(dimFault);
        }
      }
    }
  } catch (Exception e) {
    return R.error();
  }
  return R.ok();
}
里面的内容为解析xml文件的内容并传输到相对应的数据库中,其中的逻辑让我明天好好研究下


评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值