NW.js

可以在入口点 HTML 页面的 SCRIPT 标记中引用 SheetJS 独立脚本。

¥The SheetJS Standalone scripts can be referenced in a SCRIPT tag from the entry point HTML page.

"完整示例" 创建一个应用，如下图所示：

¥The "Complete Example" creates an app that looks like the screenshots below:

Windows	macOS	Linux

集成详情

¥Integration Details

NW.js 提供了读写文件的解决方案。

¥NW.js provides solutions for reading and writing files.

读取文件

¥Reading Files

浏览器中的标准 HTML5 FileReader 技术适用于 NW.js！

¥The standard HTML5 FileReader techniques from the browser apply to NW.js!

NW.js 处理将文件拖到应用窗口中的操作系统细节。拖放片段适用于页面上的 DIV 元素。

¥NW.js handles the OS minutiae for dragging files into app windows. The drag and drop snippet apply to DIV elements on the page.

同样，文件输入元素自动映射到标准 Web API。

¥Similarly, file input elements automatically map to standard Web APIs.

例如，假设页面上有一个文件输入元素：

¥For example, assuming a file input element on the page:

<input type="file" name="xlfile" id="xlf" />

事件处理程序将像处理 Web 事件一样处理该事件：

¥The event handler would process the event as if it were a web event:

async function handleFile(e) {
  const file = e.target.files[0];
  const data = await file.arrayBuffer();
  /* data is an ArrayBuffer */
  const workbook = XLSX.read(data);

  /* DO SOMETHING WITH workbook HERE */
}
document.getElementById("xlf").addEventListener("change", handleFile, false);

写入文件

¥Writing Files

具有 nwsaveas 属性的文件输入元素显示用于保存文件的 UI。标准技巧是生成一个隐藏文件输入 DOM 元素并对其进行 "click"。由于 NW.js 在 fs 包中不存在 writeFileSync，因此需要手动步骤：

¥File input elements with the attribute nwsaveas show UI for saving a file. The standard trick is to generate a hidden file input DOM element and "click" it. Since NW.js does not present a writeFileSync in the fs package, a manual step is required:

/* pre-build the hidden nwsaveas input element */
var input = document.createElement('input');
input.style.display = 'none';
input.setAttribute('nwsaveas', 'SheetJSNWDemo.xlsx');
input.setAttribute('type', 'file');
document.body.appendChild(input);

/* show a message if the save is canceled */
input.addEventListener('cancel',function(){ alert("Save was canceled!"); });

/* write to a file on the 'change' event */
input.addEventListener('change',function(e){
  /* the `value` is the path that the program will write */
  var filename = this.value;

  /* use XLSX.write with type "buffer" to generate a buffer" */
  var wbout = XLSX.write(workbook, {type:'buffer', bookType:"xlsx"});
  require("fs").writeFile(filename, wbout, function(err) {
    if(!err) return alert("Saved to " + filename);
    alert("Error: " + (err.message || err));
  });
});

input.click();

完整示例

¥Complete Example

测试部署

本 demo 在以下环境下进行了测试：

¥This demo was tested in the following environments:

操作系统和版本	架构	NW.js	日期	注意
macOS 14.3.1	`darwin-x64`	`0.85.0`	2024-03-12
macOS 14.5	`darwin-arm`	`0.88.0`	2024-05-28
Windows 10	`win10-x64`	`0.83.0`	2024-03-04
视窗 11	`win11-arm`	`0.88.0`	2024-05-28
Linux（全息操作系统）	`linux-x64`	`0.89.0`	2024-07-07
Linux（Debian）	`linux-arm`	`0.60.0`	2024-05-23	非官方版本 [^1]

创建项目文件夹：

¥Create a project folder:

mkdir sheetjs-nwjs
cd sheetjs-nwjs

创建指定入口点的 package.json 文件：

¥Create a package.json file that specifies the entry point:

package.json
{
  "name": "sheetjs-nwjs",
  "author": "sheetjs",
  "version": "0.0.0",
  "main": "index.html",
  "dependencies": {
    "nw": "0.89.0",
    "xlsx": "https://cdn.sheetjs.com/xlsx-0.20.3/xlsx-0.20.3.tgz"
  }
}

将 index.html 下载到同一文件夹中。

¥Download index.html into the same folder.

右键单击该链接并选择 "保存链接为..."。左键单击该链接将尝试在浏览器中加载该页面。目标是保存文件内容。

¥Right-click the link and select "Save Link As...". Left-clicking the link will try to load the page in your browser. The goal is to save the file contents.

在终端窗口中，可以使用以下命令执行下载：

¥In the terminal window, the download can be performed with:

curl -LO https://xlsx.nodejs.cn/nwjs/index.html

安装依赖：

¥Install dependencies:

npm i

要验证应用是否有效，请在测试环境中运行：

¥To verify the app works, run in the test environment:

npx nw .

启动时，应用将获取并解析 https://xlsx.nodejs.cn/pres.numbers 。

¥On launch, the app will fetch and parse https://xlsx.nodejs.cn/pres.numbers .

使用文件输入元素，可以从文件系统中选择一个文件，然后表格将使用所选文件的内容刷新。

¥Using the file input element, a file can be selected from the filesystem and the table will refresh with the contents of the selected file.

单击 "导出数据！" 并将生成的文件保存到 SheetJSNWDemo.xlsx。此文件可以在 Excel 或其他电子表格编辑器中打开。

¥Click "Export Data!" and save the generated file to SheetJSNWDemo.xlsx. This file can be opened in Excel or another spreadsheet editor.

要构建独立应用，请运行构建器：

¥To build a standalone app, run the builder:

npx -p nw-builder nwbuild --mode=build --version=0.89.0 --glob=false --outDir=../out ./

这将在 ..\out\ 文件夹中生成独立应用。

¥This will generate the standalone app in the ..\out\ folder.

启动生成的应用：

¥Launch the generated application:

架构	命令
`linux-x64`	`../out/sheetjs-nwjs`

[^1]: nw60-arm64_2022-01-08 发布包括 nw 的 ARM64 版本。

¥The nw60-arm64_2022-01-08 release included an ARM64 version of nw.

集成详情​

读取文件​

写入文件​

完整示例​

集成详情

读取文件

写入文件

完整示例