[{"id":"53ae7f99-150b-4b50-9f72-02f7f2ea5efe","tags":[{"product":null,"links":null,"id":"c3c0ef13-c7a9-4649-9fcb-23b3abec175d","name":"New","color":"Red","productId":"c15646e4-63d8-4965-8d62-7549a2986e99"}]},{"id":"e371599e-67ae-4635-802b-0ada531e5b5b","tags":[{"product":null,"links":null,"id":"2f377cfe-f512-431a-895b-f89af32041ce","name":"Upd","color":"Blue","productId":"c15646e4-63d8-4965-8d62-7549a2986e99"}]},{"id":"f309ec90-559b-42bf-955b-492431019196","tags":[{"product":null,"links":null,"id":"c3c0ef13-c7a9-4649-9fcb-23b3abec175d","name":"New","color":"Red","productId":"c15646e4-63d8-4965-8d62-7549a2986e99"}]},{"id":"28d36d47-c582-4210-a848-5ba48491bb80","tags":[{"product":null,"links":null,"id":"2f377cfe-f512-431a-895b-f89af32041ce","name":"Upd","color":"Blue","productId":"c15646e4-63d8-4965-8d62-7549a2986e99"}]},{"id":"9d13df60-758a-4cc3-9cda-8d6234e00821","tags":[{"product":null,"links":null,"id":"2f377cfe-f512-431a-895b-f89af32041ce","name":"Upd","color":"Blue","productId":"c15646e4-63d8-4965-8d62-7549a2986e99"}]},{"id":"2e473c2c-8b35-40de-bdce-f21478f434bc","tags":[{"product":null,"links":null,"id":"c3c0ef13-c7a9-4649-9fcb-23b3abec175d","name":"New","color":"Red","productId":"c15646e4-63d8-4965-8d62-7549a2986e99"}]},{"id":"e19a99e0-5b6f-4c8b-b872-47b3e78011bf","tags":[{"product":null,"links":null,"id":"2f377cfe-f512-431a-895b-f89af32041ce","name":"Upd","color":"Blue","productId":"c15646e4-63d8-4965-8d62-7549a2986e99"}]},{"id":"2f718a98-6d54-4dc1-89c3-6b87cfabd16b","tags":[{"product":null,"links":null,"id":"2f377cfe-f512-431a-895b-f89af32041ce","name":"Upd","color":"Blue","productId":"c15646e4-63d8-4965-8d62-7549a2986e99"}]},{"id":"df066912-4ce1-4484-b00c-86b34a6e977b","tags":[{"product":null,"links":null,"id":"2f377cfe-f512-431a-895b-f89af32041ce","name":"Upd","color":"Blue","productId":"c15646e4-63d8-4965-8d62-7549a2986e99"}]},{"id":"1fcab497-8c1f-413e-bce0-f3ae72229e85","tags":[{"product":null,"links":null,"id":"2f377cfe-f512-431a-895b-f89af32041ce","name":"Upd","color":"Blue","productId":"c15646e4-63d8-4965-8d62-7549a2986e99"}]},{"id":"3d90b977-451c-42ce-a26a-1e32c1082471","tags":[{"product":null,"links":null,"id":"c3c0ef13-c7a9-4649-9fcb-23b3abec175d","name":"New","color":"Red","productId":"c15646e4-63d8-4965-8d62-7549a2986e99"}]},{"id":"6433ad22-3173-436a-8ff9-355a17142bc5","tags":[{"product":null,"links":null,"id":"2f377cfe-f512-431a-895b-f89af32041ce","name":"Upd","color":"Blue","productId":"c15646e4-63d8-4965-8d62-7549a2986e99"}]},{"id":"e82311a5-f99e-4075-8710-9a76a2da67a7","tags":[{"product":null,"links":null,"id":"c3c0ef13-c7a9-4649-9fcb-23b3abec175d","name":"New","color":"Red","productId":"c15646e4-63d8-4965-8d62-7549a2986e99"}]},{"id":"7bebaae0-d5e2-4db3-ab34-644272d2aed6","tags":[{"product":null,"links":null,"id":"2f377cfe-f512-431a-895b-f89af32041ce","name":"Upd","color":"Blue","productId":"c15646e4-63d8-4965-8d62-7549a2986e99"}]},{"id":"2c77a1e3-7af7-4dca-88aa-ee59b41d7896","tags":[{"product":null,"links":null,"id":"2f377cfe-f512-431a-895b-f89af32041ce","name":"Upd","color":"Blue","productId":"c15646e4-63d8-4965-8d62-7549a2986e99"}]},{"id":"5a3f52b5-5b23-473e-bdbc-906381b9a948","tags":[{"product":null,"links":null,"id":"c3c0ef13-c7a9-4649-9fcb-23b3abec175d","name":"New","color":"Red","productId":"c15646e4-63d8-4965-8d62-7549a2986e99"}]},{"id":"299d63a8-7f0b-46a4-a152-9a7ca85a2170","tags":[{"product":null,"links":null,"id":"c3c0ef13-c7a9-4649-9fcb-23b3abec175d","name":"New","color":"Red","productId":"c15646e4-63d8-4965-8d62-7549a2986e99"}]},{"id":"906b4555-b1b6-4ddb-a290-c13cb8a153a0","tags":[{"product":null,"links":null,"id":"2f377cfe-f512-431a-895b-f89af32041ce","name":"Upd","color":"Blue","productId":"c15646e4-63d8-4965-8d62-7549a2986e99"}]},{"id":"efa3eb50-4277-46ee-b451-c5096e889fff","tags":[{"product":null,"links":null,"id":"2f377cfe-f512-431a-895b-f89af32041ce","name":"Upd","color":"Blue","productId":"c15646e4-63d8-4965-8d62-7549a2986e99"}]},{"id":"1d9b7a41-588f-47d1-bb81-f46146e062fb","tags":[{"product":null,"links":null,"id":"2f377cfe-f512-431a-895b-f89af32041ce","name":"Upd","color":"Blue","productId":"c15646e4-63d8-4965-8d62-7549a2986e99"}]},{"id":"c1687a0f-e3a0-4074-996c-94cbacf49f29","tags":[{"product":null,"links":null,"id":"2f377cfe-f512-431a-895b-f89af32041ce","name":"Upd","color":"Blue","productId":"c15646e4-63d8-4965-8d62-7549a2986e99"}]},{"id":"269fc082-c3b5-4208-a987-c1a3c1dee620","tags":[{"product":null,"links":null,"id":"2f377cfe-f512-431a-895b-f89af32041ce","name":"Upd","color":"Blue","productId":"c15646e4-63d8-4965-8d62-7549a2986e99"}]},{"id":"cb76b7de-9b29-4d6b-b644-de3c3c0a1262","tags":[{"product":null,"links":null,"id":"2f377cfe-f512-431a-895b-f89af32041ce","name":"Upd","color":"Blue","productId":"c15646e4-63d8-4965-8d62-7549a2986e99"}]},{"id":"4dc9d5da-9bf3-4baf-9fae-6b34511062a4","tags":[{"product":null,"links":null,"id":"c3c0ef13-c7a9-4649-9fcb-23b3abec175d","name":"New","color":"Red","productId":"c15646e4-63d8-4965-8d62-7549a2986e99"}]},{"id":"e4e74cf8-8702-45a6-a536-86d03b66af49","tags":[{"product":null,"links":null,"id":"2f377cfe-f512-431a-895b-f89af32041ce","name":"Upd","color":"Blue","productId":"c15646e4-63d8-4965-8d62-7549a2986e99"}]},{"id":"abe88d62-9eb6-4113-89f3-abb0cff27c3a","tags":[{"product":null,"links":null,"id":"2f377cfe-f512-431a-895b-f89af32041ce","name":"Upd","color":"Blue","productId":"c15646e4-63d8-4965-8d62-7549a2986e99"}]},{"id":"f3751417-d894-4cf1-8a8c-c2e7391dd4b1","tags":[{"product":null,"links":null,"id":"2f377cfe-f512-431a-895b-f89af32041ce","name":"Upd","color":"Blue","productId":"c15646e4-63d8-4965-8d62-7549a2986e99"}]},{"id":"49ae1d04-aba0-4311-8548-df297a5aedc0","tags":[{"product":null,"links":null,"id":"2f377cfe-f512-431a-895b-f89af32041ce","name":"Upd","color":"Blue","productId":"c15646e4-63d8-4965-8d62-7549a2986e99"}]},{"id":"861d71ff-44db-4563-a24c-e1a389708c19","tags":[{"product":null,"links":null,"id":"c3c0ef13-c7a9-4649-9fcb-23b3abec175d","name":"New","color":"Red","productId":"c15646e4-63d8-4965-8d62-7549a2986e99"}]},{"id":"2f6715bc-8b05-4653-8ec5-0dd835dc6035","tags":[{"product":null,"links":null,"id":"2f377cfe-f512-431a-895b-f89af32041ce","name":"Upd","color":"Blue","productId":"c15646e4-63d8-4965-8d62-7549a2986e99"}]},{"id":"d2f5c978-f4e4-4c18-ab43-e8fbbc6ad92b","tags":[{"product":null,"links":null,"id":"c3c0ef13-c7a9-4649-9fcb-23b3abec175d","name":"New","color":"Red","productId":"c15646e4-63d8-4965-8d62-7549a2986e99"}]},{"id":"e183d612-0813-4e0f-b217-308d71c14637","tags":[{"product":null,"links":null,"id":"c3c0ef13-c7a9-4649-9fcb-23b3abec175d","name":"New","color":"Red","productId":"c15646e4-63d8-4965-8d62-7549a2986e99"}]},{"id":"f8f319ea-ec97-4d69-a862-c6a17191f0f7","tags":[{"product":null,"links":null,"id":"c3c0ef13-c7a9-4649-9fcb-23b3abec175d","name":"New","color":"Red","productId":"c15646e4-63d8-4965-8d62-7549a2986e99"}]},{"id":"d895fc4b-55bb-46ee-bd74-7a0abb51650c","tags":[{"product":null,"links":null,"id":"c3c0ef13-c7a9-4649-9fcb-23b3abec175d","name":"New","color":"Red","productId":"c15646e4-63d8-4965-8d62-7549a2986e99"}]},{"id":"680fba3c-ad50-41a6-bc56-acd4f229de8f","tags":[{"product":null,"links":null,"id":"c3c0ef13-c7a9-4649-9fcb-23b3abec175d","name":"New","color":"Red","productId":"c15646e4-63d8-4965-8d62-7549a2986e99"}]},{"id":"1234e85c-d175-4f94-ac83-b53b5e3596d2","tags":[{"product":null,"links":null,"id":"c3c0ef13-c7a9-4649-9fcb-23b3abec175d","name":"New","color":"Red","productId":"c15646e4-63d8-4965-8d62-7549a2986e99"}]},{"id":"8fb554aa-3192-402b-9d6b-1ec2b4b99ea0","tags":[{"product":null,"links":null,"id":"c3c0ef13-c7a9-4649-9fcb-23b3abec175d","name":"New","color":"Red","productId":"c15646e4-63d8-4965-8d62-7549a2986e99"}]},{"id":"aff9d5e3-7e18-4287-892f-8d7844e9ddf2","tags":[{"product":null,"links":null,"id":"2f377cfe-f512-431a-895b-f89af32041ce","name":"Upd","color":"Blue","productId":"c15646e4-63d8-4965-8d62-7549a2986e99"}]},{"id":"6a23926e-a2ac-4c07-ba79-2f7751f098ee","tags":[{"product":null,"links":null,"id":"2f377cfe-f512-431a-895b-f89af32041ce","name":"Upd","color":"Blue","productId":"c15646e4-63d8-4965-8d62-7549a2986e99"}]},{"id":"51c9c955-8c66-45d8-bb0c-718aee1073da","tags":[{"product":null,"links":null,"id":"c3c0ef13-c7a9-4649-9fcb-23b3abec175d","name":"New","color":"Red","productId":"c15646e4-63d8-4965-8d62-7549a2986e99"}]},{"id":"6174a29f-1d15-4a80-a860-d28fdecca505","tags":[{"product":null,"links":null,"id":"2f377cfe-f512-431a-895b-f89af32041ce","name":"Upd","color":"Blue","productId":"c15646e4-63d8-4965-8d62-7549a2986e99"}]},{"id":"51709a04-b2cd-4465-b2a2-da7beb2e4f15","tags":[{"product":null,"links":null,"id":"c3c0ef13-c7a9-4649-9fcb-23b3abec175d","name":"New","color":"Red","productId":"c15646e4-63d8-4965-8d62-7549a2986e99"}]},{"id":"897b8725-abb5-428a-bd7a-a610fae8e28c","tags":[{"product":null,"links":null,"id":"c3c0ef13-c7a9-4649-9fcb-23b3abec175d","name":"New","color":"Red","productId":"c15646e4-63d8-4965-8d62-7549a2986e99"}]},{"id":"c00c0609-ac23-4859-8442-be43ed745ad3","tags":[{"product":null,"links":null,"id":"c3c0ef13-c7a9-4649-9fcb-23b3abec175d","name":"New","color":"Red","productId":"c15646e4-63d8-4965-8d62-7549a2986e99"}]},{"id":"0996d76b-b253-49a7-9ea8-89d81ce0d42f","tags":[{"product":null,"links":null,"id":"c3c0ef13-c7a9-4649-9fcb-23b3abec175d","name":"New","color":"Red","productId":"c15646e4-63d8-4965-8d62-7549a2986e99"}]},{"id":"3c007776-7473-4203-8cc1-9ed79bb512df","tags":[{"product":null,"links":null,"id":"2f377cfe-f512-431a-895b-f89af32041ce","name":"Upd","color":"Blue","productId":"c15646e4-63d8-4965-8d62-7549a2986e99"}]},{"id":"4bb1ced3-7a10-4719-854b-513729b31e53","tags":[{"product":null,"links":null,"id":"2f377cfe-f512-431a-895b-f89af32041ce","name":"Upd","color":"Blue","productId":"c15646e4-63d8-4965-8d62-7549a2986e99"}]},{"id":"53155f14-d53e-4d53-a087-0a32d9b088e8","tags":[{"product":null,"links":null,"id":"2f377cfe-f512-431a-895b-f89af32041ce","name":"Upd","color":"Blue","productId":"c15646e4-63d8-4965-8d62-7549a2986e99"}]},{"id":"279e57c0-0954-49d6-9076-2133a204e24f","tags":[{"product":null,"links":null,"id":"c3c0ef13-c7a9-4649-9fcb-23b3abec175d","name":"New","color":"Red","productId":"c15646e4-63d8-4965-8d62-7549a2986e99"}]},{"id":"e9c38f09-cfd3-4a78-b2cf-412e3c1b5945","tags":[{"product":null,"links":null,"id":"2f377cfe-f512-431a-895b-f89af32041ce","name":"Upd","color":"Blue","productId":"c15646e4-63d8-4965-8d62-7549a2986e99"}]},{"id":"754efafe-744e-452e-9e46-833c9b36c763","tags":[{"product":null,"links":null,"id":"2f377cfe-f512-431a-895b-f89af32041ce","name":"Upd","color":"Blue","productId":"c15646e4-63d8-4965-8d62-7549a2986e99"}]},{"id":"be5fe8a1-1660-4dc4-b7fb-ceb038047086","tags":[{"product":null,"links":null,"id":"2f377cfe-f512-431a-895b-f89af32041ce","name":"Upd","color":"Blue","productId":"c15646e4-63d8-4965-8d62-7549a2986e99"}]}]
        
(Showing Draft Content)

Getting Started

System Requirements

SpreadJS widget requires one of the following browsers:

  • Microsoft IE9+

  • Mozilla FireFox

  • Safari

  • Google Chrome

The browser must support HTML5.

The client-side Excel import and export requires IE10+.

Note: SpreadJS also supports Windows 11 and Windows Server 2022.

Download and Installation

Using Bundles

  • Download the ZIP file (SpreadJS.xxxx.zip) and the save it to a temporary directory on your system, and then unzip the files to a directory.

The default SpreadJS folders (Windows only):

Install Directory

Files

Description

\SpreadJS.xxxx

LICENSE

SPREADJS_EULA

Main directory for product

\SpreadJS.xxxx\css

gc.spread.sheets.x.x.x.css

gc.spread.sheets.excel2013darkGray.xxxx.css

gc.spread.sheets.excel2013lightGray.xxxx.css

gc.spread.sheets.excel2013white.xxxx.css

gc.spread.sheets.excel2016black.xxxx.css

gc.spread.sheets.excel2016colorful.xxxx.css

gc.spread.sheets.excel2016darkGray.xxxx.css

CSS files

\SpreadJS.xxxx\definition

GC.spread.sheets.d.ts

gc.spread.excelio.d.ts

TypeScript API definition file

\SpreadJS.xxxx\samples


Sample pages for the widget

\SpreadJS.xxxx\scripts

gc.spread.sheets.all.xxxx.min.js

Minimized js file for widget which includes all functions without plugins

\SpreadJS.xxxx\scripts\modules

gc.data.xxxx.min.js

gc.spread.calcengine.xxxx.min.js

gc.spread.calcengine.advancedfunctions.xxxx.min.js

gc.spread.calcengine.basicfunctions.xxxx.min.js

gc.spread.common.xxxx.min.js

gc.spread.sheets.automerge.xxxx.min.js

gc.spread.sheets.bindings.xxxx.min.js

gc.spread.sheets.calcengine.xxxx.min.js

gc.spread.sheets.cellstate.xxxx.min.js

gc.spread.sheets.celltypes.xxxx.min.js

gc.spread.sheets.comments.xxxx.min.js

gc.spread.sheets.components.xxxx.min.js

gc.spread.sheets.conditionalformatting.xxxx.min.js

gc.spread.sheets.contextmenu.xxxx.min.js

gc.spread.sheets.core.xxxx.min.js

gc.spread.sheets.datavalidation.xxxx.min.js

gc.spread.sheets.dragmerge.xxxx.min.js

gc.spread.sheets.fill.xxxx.min.js

gc.spread.sheets.filter.xxxx.min.js

gc.spread.sheets.floatingobjects.xxxx.min.js

gc.spread.sheets.formulatextbox.xxxx.min.js

gc.spread.sheets.hyperlink.xxxx.min.js

gc.spread.sheets.inputmask.xxxx.min.js

gc.spread.sheets.namebox.xxxx.min.js

gc.spread.sheets.outlinecolumn.xxxx.min.js

gc.spread.sheets.outlines.xxxx.min.js

gc.spread.sheets.search.xxxx.min.js

gc.spread.sheets.spacing.xxxx.min.js

gc.spread.sheets.sparklines.xxxx.min.js

gc.spread.sheets.statusbar.xxxx.min.js

gc.spread.sheets.tables.xxxx.min.js

gc.spread.sheets.touch.xxxx.min.js

Modules js files

\SpreadJS.xxxx\scripts\interop

gc.spread.excelio.xxxx.min.js

Client-side Excel import and export support files

\SpreadJS.xxxx\scripts\interop\angularjs

gc.spread.sheets.angularjs.xxxxx.min.js

AngularJS support files

\SpreadJS.xxxx\scripts\interop\angular

gc.spread.sheets.angular.xxxxx.min.js

Angular support files

\SpreadJS.xxxx\scripts\interop\react

gc.spread.sheets.react.xxxxx.min.js

React support file

\SpreadJS.xxxx\scripts\interop\vuejs

gc.spread.sheets.vue.xxxxx.min.js

Vue support file

\SpreadJS.xxxx\scripts\resources

ja\gc.spread.sheets.resources.ja.xxxxx.min.js

zh\gc.spread.sheets.resources.zh.xxxx.min.js

ko\gc.spread.sheets.resources.ko.xxxx.min.js

Japanese, Chinese, and Korean resource files

\SpreadJS.xxxx\scripts\plugins

gc.spread.pivot.pivottables.xxxx.min.js

gc.spread.sheets.barcode.xxxx.min.js

gc.spread.sheets.charts.xxxx.min.js

gc.spread.sheets.legacycharts.xxxx.min.js

gc.spread.sheets.formulapanel.xxxx.min.js

gc.spread.sheets.pdf.xxxx.min.js

gc.spread.sheets.print.xxxx.min.js

gc.spread.sheets.shapes.xxxx.min.js

gc.spread.sheets.tablesheet.xxxx.min.js

gc.spread.report.reportsheet.xxxx.min.js

gc.spread.sheets.ganttsheet.xxxx.min.js

gc.spread.calcengine.languagepackages.xxxx.min.js

gc.spread.sheets.io.xxxx.min.js

gc.spread.sheets.slicers.xxxx.min.js

Plugins files

Install SpreadJS Designer

  1. Save the downloaded ZIP file (SpreadJSDesigner.zip) to a temporary directory on your system, and then unzip the files to a directory.

  2. Run the setup file for your environment.

  3. Run the designer, select the lock icon, and enter your license key to unlock the SpreadJS Designer.

Platform

Setup

Windows

SpreadJS-Designer.x.x.x.exe

Mac

SpreadJS-Designer.x.x.x.dmg

Linux

SpreadJS-Designer.x.x.x.AppImage

The default SpreadJS designer folder:

Install Directory

Description

%Program Files (x86)%\MESCIUS\SpreadJS Designer\x.x.x

Designer directory for product

Refer to Trial Version and Licensing Information for licensing information.

Using NPM

To install SpreadJS packages using NPM, you must install Node.js and the npm command line interface using a Node installer or a Node version manager.

To learn how to get started with Node.js and npm command line interface, see npm Docs.

You can download the SpreadJS packages from NPM:

Package

Purpose

Spreadsheet

Spreadsheet package

SpreadJS Designer

Spreadsheet designer component

Shape Plugin

Shape add-on for SpreadJS

TableSheet Plugin

TableSheet add-on for SpreadJS

Client-side Excel IO

SpreadJS package for Excel I/O operations

SpreadJS CalcEngine

Calculation engine support for SpreadJS

Chart Plugin

Chart add-on for SpreadJS

BarCode Plugin

Barcode support for SpreadJS

Pivot Plugin

Pivot support for SpreadJS

PDF Plugin

PDF export support for SpreadJS

Print Plugin

Print support for SpreadJS

SpreadJS IO Plugin

Support for I/O operations in SpreadJS

SpreadJS React

SpreadJS Designer Component for React framework

SpreadJS Vue

SpreadJS Designer Wrapper Components for Vue framework

SpreadJS Angular

SpreadJS Wrapper Components for Angular framework

Content Security Policy (CSP)

A CSP is a security policy implemented through headers or meta elements to regulate and authorize content loading on your website.

To establish a CSP Directive Reference, you have the option of either configuring HTTP response headers on the server or setting meta elements in the HTML header element. By doing this, you can create a set of rules that determine what content is permitted or prohibited. These rules enhance the security of your website against content injection and cross-site scripting (XSS) attacks.

SpreadJS, as an embedded control, must adhere to CSP guidelines by ensuring that the code remains free from any potential attack sites. So, include specific rules to increase the security of SpreadJS as mentioned below.

// No Eval rule in TSLINT
eval("alert('XSS!')");

// No Implied Eval rule in TSLINT
setTimeout("alert('Hi!');", 100);
setInterval("alert('Hi!');", 100);
execScript("alert('Hi!')");
window.setTimeout("count = 5", 10);
window.setInterval("foo = bar", 10);

// No New Function rule in TSLINT
new Function("alert('XSS!')")();

Note that the import and export APIs use web worker to zip or unzip the files and the users must set the correct CSP rule to avoid errors.

For example, consider the following CSP Rule:

<meta http-equiv="Content-Security-Policy" content="worker-src 'self' blob: 'unsafe-inline' 'unsafe-eval' data:">

This CSP rule allows the loading of web workers from the same origin and the use of blob URIs for web workers where:

  • worker-src 'self': Restricts the loading of web workers to the same origin as the document.

  • blob:: Allows the use of blob URIs for web workers.

  • 'unsafe-inline': Allows the execution of inline scripts.

  • 'unsafe-eval': Allows the use of eval() and similar JavaScript functions that execute code passed as strings.

  • data:: Allows the use of data URIs.