请选择 进入手机版 | 继续访问电脑版
 找回密码
 立即注册

QQ登录

只需一步,快速开始

Clark.Pan 讲师达人认证 悬赏达人认证 SpreadJS 开发认证

超级版主

200

主题

9896

帖子

1万

积分

超级版主

Rank: 8Rank: 8

积分
15516

讲师达人悬赏达人微信认证勋章SpreadJS 认证SpreadJS 高级认证元老葡萄

Clark.Pan 讲师达人认证 悬赏达人认证 SpreadJS 开发认证
超级版主   /  发表于:2017-5-18 15:06  /   查看:22642  /  回复:31
本帖最后由 ClarkPan 于 2019-1-20 22:56 编辑

本demo通过SpreadJS的前端导出导出与JAVA后端结合,实现分从服务器端导入Excel与导出Excel保存至服务器端这两个功能:

从服务器端导入Excel:
这部分使用纯前端实现。然后下载到前端直接打开,核心代码如下:
  1. var excelIo = new GC.Spread.Excel.IO();
  2.     var excelFilePath = 'resources/Excel/importExcel.xlsx';
  3.     var xhr = new XMLHttpRequest();
  4.     xhr.open('GET', excelFilePath, true);
  5.     xhr.responseType = 'blob';   
  6.     xhr.onload = function(e) {
  7.       if (this.status == 200) {
  8.         // get binary data as a response
  9.         var blob = this.response;
  10.         // convert Excel to JSON
  11.         excelIo.open(blob, function (json) {
  12.             var workbookObj = json;
  13.             spread.fromJSON(workbookObj);
  14.         }, function (e) {
  15.             // process error
  16.             alert(e.errorMessage);
  17.         }, {});
  18.       }
  19.     };
  20.      
  21.     xhr.send();
复制代码

导出Excel保存至服务器端:
这部分使用前端导出功能与后端java结合的方式来实现,首先通过前端Excel导出,生成导出文件,然后通过formdata来承载导出文件,之后通过ajax将formdata传至后端java。后端java使用文件操作将文件保存至服务器端。
这里有以下需要注意的地方:
formdata没有办法改变enctype,而我们需要的用entype为multipart/form-data类型的form来承载导出文件。这里需要在jsp页面上创建一个空的form,并将其entype设置为multipart/form-data:
  1. <form name="myform" id="myform" enctype="multipart/form-data" method="post"></form>
复制代码
之后js中只需要初始化一个该form的formdata实例即可:
  1. var fd = new FormData(document.forms.namedItem("myform"));
复制代码
全部代码已经上传附件,可以下载进行参考。

SpreadJS_Demo3.zip

1.78 MB, 下载次数: 1563

31 个回复

倒序浏览
o0chen
注册会员   /  发表于:2017-6-16 16:30:09
沙发
代码不全??
回复 使用道具 举报
Clark.Pan讲师达人认证 悬赏达人认证 SpreadJS 开发认证
超级版主   /  发表于:2017-6-16 16:49:34
板凳
本帖最后由 ClarkPan 于 2017-6-16 16:51 编辑

附件是一个maven工程。需要您使用IDE进行导入,另外不明白您说得代码不全的意思, 您那边断定代码不全的原因是什么?
回复 使用道具 举报
o0chen
注册会员   /  发表于:2017-6-16 17:24:57
地板
我以为用的是java代码后端实现的。。。。这个excelIO.js需要另外购买吗?
回复 使用道具 举报
Clark.Pan讲师达人认证 悬赏达人认证 SpreadJS 开发认证
超级版主   /  发表于:2017-6-16 17:42:17
5#
o0chen 发表于 2017-6-16 17:24
我以为用的是java代码后端实现的。。。。这个excelIO.js需要另外购买吗?

这个是spreadjs产品包中就包含的,我们的在线导入导出功能就是使用的该js。
回复 使用道具 举报
小雷
注册会员   /  发表于:2018-7-12 11:10:56
6#
resource.prooerties文件找不到?
回复 使用道具 举报
Clark.Pan讲师达人认证 悬赏达人认证 SpreadJS 开发认证
超级版主   /  发表于:2018-7-16 09:50:38
7#
小雷 发表于 2018-7-12 11:10
resource.prooerties文件找不到?

这个是Spring MVC里面的一个设置,将配置中关于resource.prooerties的设置删掉就可以了
回复 使用道具 举报
tong123456
中级会员   /  发表于:2019-2-14 13:22:00
8#
有没有c# 版
回复 使用道具 举报
dexteryao讲师达人认证 悬赏达人认证 SpreadJS 开发认证
超级版主   /  发表于:2019-2-14 16:57:23
9#

服务端只需要接受post回来的stream即可,将stream 保存为xlsx 文件。
回复 使用道具 举报
Clark.Pan讲师达人认证 悬赏达人认证 SpreadJS 开发认证
超级版主   /  发表于:2019-2-19 18:14:41
10#

没有,不过原理是一样的,导入都是通过XMLHttpRequest去请求服务器端的Excel
导出就是将前端生成的blob流传递给后端并转存成xlsx格式的文件
回复 使用道具 举报
1234下一页
您需要登录后才可以回帖 登录 | 立即注册
返回顶部