Clark.Pan 发表于 2020-6-28 09:30:24

GCExcel与SpreadJS通过ssjson交互

GCExcel曾经是纯服务器端独立操作Excel的控件,但随着GCExcel越来越多被人熟知,也衍生出了一些综合的需求。其中前后端交互就是其中最常见的一种。既然是操作Excel那么,前端的表格展示对于SpreadJS控件来说是当然不让的。今天就讲一下GCExcel如何与前端的SpreadJS进行交互。首先,交互方式:
SpreadJS可以将前端表格转换成json格式文件(ssjson),也可以转换成xlsx格式的文件(Excel)。但是由于SpreadJS中存在很多独特的定制设置,这些设置Excel本身是不支持的,所以导出Excel无法继承这些设置。所以导出ssjson就成了更好的选择。而GCExcel是可以直接读取导出的ssjson。此处注意导出的ssjson内的格式顺序不能发生变化。并且支持的SpreadJS版本必须是V12以上。
接下来,如何进行交互:
首先,SpreadJS支持toJSON序列化,通过该方法可以将页面上整个workbook序列化成json,在序列化的过程中可以设置对应options来做一些特殊设置,然后通过JSON.stringify将json转换成对应的json字符串。
var serializationOption = {
       ignoreStyle: true, // indicate to ignore the style when convert workbook to json, default value is false
       ignoreFormula: true, // indicate to ignore the formula when convert workbook to json, default value is false
       rowHeadersAsFrozenColumns: true, // indicate to treat the row headers as frozen columns when convert workbook to json, default value is false
       columnHeadersAsFrozenRows: true // indicate to treat the column headers as frozen rows when convert workbook to json, default value is false
    }var jsonstr = JSON.stringify(spread.toJSON(serializationOption)); 之后发送请求将得到的字符串传到服务器端,这里注意前后端的编码格式保持一致,避免出现转译现象。
接下来,服务器端先初始化workbook实例,然后通过workbook下的fromjson来导入对应的json字符串
Workbook workbook = new Workbook();
workbook.fromJson(jsonstr);反向操作也是一样。
前端发送请求至服务器端,服务器端用toJSON方法将workbook序列化成json字符串,然后将字符串返回。
String jsonStr = workbook.toJson();
前端接收返回后的请求后,用JSON.parse将返回的json字符串转换成json对象。
var ssjson = JSON.parse(jsonStr);最后通过spread.fromJSON方法将json反序列化到页面上进行展示,反序列化的同时可以通过相关的options进行差异化设置
var jsonOptions = {
       ignoreFormula: true, // indicate to ignore style when convert json to workbook, default value is false
       ignoreStyle: true, // indicate to ignore the formula when convert json to workbook, default value is false
       frozenColumnsAsRowHeaders: true, // indicate to treat the frozen columns as row headers when convert json to workbook, default value is false
       frozenRowsAsColumnHeaders: true, // indicate to treat the frozen rows as column headers when convert json to workbook, default value is false
       doNotRecalculateAfterLoad: true //indicate to forbid recalculate after load the json, default value is false
    }
spread.fromJSON(ssjson, jsonOptions);通过ssjson作为前后端之间的桥梁,GCExcel可以与SpreadJS完美的结合在一起组成全栈的解决方案。例如当表格包含着大量公式计算的时候就可以让GCExcel在服务端进行公式计算,减轻前端压力。之后前端fromjson的时候通过ignoreFormula的设置来忽略公式,然后只将计算结果呈现在前端页面上进行展示。类似这样的场景在日后的生产开发中将越来越常见。



页: [1]
查看完整版本: GCExcel与SpreadJS通过ssjson交互