docs.sheetjs.com/docz/docs/03-demos/32-extensions/04-gsheet.md

224 lines
5.8 KiB
Markdown
Raw Permalink Normal View History

2023-04-18 04:46:43 +00:00
---
title: Google Sheets
pagination_prev: demos/cloud/index
pagination_next: demos/bigdata/index
2024-05-04 16:15:00 +00:00
sidebar_custom_props:
summary: Enhance data import functionality from Google Sheets
2023-04-18 04:46:43 +00:00
---
2023-04-27 09:12:19 +00:00
import current from '/version.js';
import CodeBlock from '@theme/CodeBlock';
2023-09-18 06:44:33 +00:00
:::note pass
2023-04-18 04:46:43 +00:00
This demo focuses on Google Apps Script custom functions. For external data
processing, [the "Google Sheets" cloud data demo](/docs/demos/cloud/gsheet)
covers the API for NodeJS scripts
:::
2023-09-22 06:32:55 +00:00
The [SheetJS Standalone scripts](/docs/getting-started/installation/standalone)
can be uploaded into an Apps Script project. Once uploaded, the `XLSX` variable
is available to other scripts in the project.
2023-04-18 04:46:43 +00:00
Google Sheets currently does not provide support for working with Apple Numbers
files and some legacy file formats. SheetJS fills the gap.
The [Complete Demo](#complete-demo) defines a `SHEETJS` function that fetches a
remote file, parses the contents, and writes data to the sheet:
![Screenshot of final result](pathname:///gsheet/udf.png)
2024-03-12 06:47:52 +00:00
:::note Tested Deployments
2023-04-18 04:46:43 +00:00
2024-03-12 06:47:52 +00:00
This demo was last tested on 2024 March 11.
2023-04-18 04:46:43 +00:00
:::
## Integration Details
### Adding the script
The `clasp` command line tool can be used to upload the standalone script:
2023-04-27 09:12:19 +00:00
<CodeBlock language="bash">{`\
2023-04-18 04:46:43 +00:00
npx @google/clasp clone SCRIPT_ID
2023-04-27 09:12:19 +00:00
curl -LO https://cdn.sheetjs.com/xlsx-${current}/package/dist/xlsx.full.min.js
npx @google/clasp push`}
</CodeBlock>
2023-04-18 04:46:43 +00:00
Once uploaded, the script `xlsx.full.min.gs` will be added to the project.
The [Complete Demo](#complete-demo) includes more detailed setup instructions.
### Fetching data
`UrlFetchApp.fetch` performs a network request and returns a `HTTPResponse`:
```js
2024-04-26 04:16:13 +00:00
const response = UrlFetchApp.fetch("https://docs.sheetjs.com/pres.numbers");
2023-04-18 04:46:43 +00:00
```
`HTTPResponse#getContent` returns the file data as an array of *signed* bytes:
```js
const content = response.getContent();
```
The `"array"` type for `XLSX.read` expects an array of *unsigned* bytes.
Fortunately, the content can be corrected with bitwise operations:
```js
for(var i = 0; i < content.length; ++i) content[i] &= 0xFF;
const wb = XLSX.read(content, { type: "array" });
```
### Returning data
`XLSX.utils.sheet_to_json` with the option `header: 1` returns arrays of arrays
that play nice with Google Sheets:
```js
const first_worksheet = wb.Sheets[wb.SheetNames[0]];
const aoa = XLSX.utils.sheet_to_json(first_worksheet, {header: 1});
```
## Complete Demo
This demo creates a function `SHEETJS(url)` that fetches the specified URL,
extracts data from the first worksheet, and writes the data
### Initial Setup
0) Sign into a Google account (or create a new one)
1) In a terminal window, run
```bash
npx @google/clasp login
```
A browser window should direct to an account selection page. Select the account
from the previous step. In the next page, there will be a title like
> clasp The Apps Script CLI wants to access your Google Account
At the bottom of the screen, click "Allow".
The terminal window should now state
```
Authorization successful.
```
### Creating a Sheet
2) Sign into Google Sheets with the same account and create a new blank sheet
3) Open up the apps script window (Extensions > Apps Script)
4) Click the gear icon (Project Settings) and copy the Script ID
### Cloning the Apps Script
5) In the terminal window, create a new folder for your project:
```bash
mkdir SheetJSGAS
cd SheetJSGAS
```
6) Clone the Apps Script project. The official command is:
```bash
npx @google/clasp clone PASTE_YOUR_ID_HERE
```
Type `npx @google/clasp clone ` in the terminal with a trailing space (do not
press Enter yet!), then copy the Script ID from the Apps Script settings page
and paste in the terminal. Press Enter after pasting the ID.
### Adding the SheetJS Library
2023-09-22 06:32:55 +00:00
7) Download the SheetJS Standalone script and move to the project directory:
<ul>
<li><a href={`https://cdn.sheetjs.com/xlsx-${current}/package/dist/xlsx.full.min.js`}>xlsx.full.min.js</a></li>
</ul>
2023-04-18 04:46:43 +00:00
2023-05-07 13:58:36 +00:00
<CodeBlock language="bash">{`\
2023-04-27 09:12:19 +00:00
curl -LO https://cdn.sheetjs.com/xlsx-${current}/package/dist/xlsx.full.min.js`}
2023-05-07 13:58:36 +00:00
</CodeBlock>
2023-04-18 04:46:43 +00:00
8) Push the project to Apps Script:
```bash
npx @google/clasp push
```
2023-09-18 06:44:33 +00:00
:::caution pass
2023-04-18 04:46:43 +00:00
2023-09-17 04:57:06 +00:00
If the Google Apps Script API is not enabled, the command will display an object
with `code: 403` and an error message about the Apps Script API:
2023-04-18 04:46:43 +00:00
2023-09-17 04:57:06 +00:00
```js
{ // ...
code: 403,
errors: [
{
message: 'User has not enabled the Apps Script API. Enable it by ...',
domain: 'global',
reason: 'forbidden'
}
]
}
```
2023-04-18 04:46:43 +00:00
The message includes a URL (`https://script.google.com/home/usersettings` when
2023-09-17 04:57:06 +00:00
the demo was last tested). Visit that URL.
If the Google Apps Script API is "Off", click on "Google Apps Script API" and
click on the slider to enable the API.
2023-04-18 04:46:43 +00:00
After enabling the API, run `npx @google/clasp push` again.
:::
9) Reopen the Google Sheet and Apps Script editor (Extensions > Apps Script).
In the Files listing, there should be a new entry `xlsx.full.min.gs`
### Creating a Custom Function
10) In Apps Script editor, select `Code.gs` and erase the code in the editor.
Replace with the following function:
```js title="Code.gs"
function SHEETJS(url) {
/* fetch data */
2024-04-26 04:16:13 +00:00
const res = UrlFetchApp.fetch(url || "https://docs.sheetjs.com/pres.numbers");
2023-04-18 04:46:43 +00:00
const content = res.getContent();
/* fix data */
for(var i = 0; i < content.length; ++i) content[i] &= 0xFF;
/* parse */
const wb = XLSX.read(content, {type: "array"});
/* generate array of arrays from worksheet */
const ws = wb.Sheets[wb.SheetNames[0]];
const aoa = XLSX.utils.sheet_to_json(ws, {header: 1});
return aoa;
}
```
2023-09-17 04:57:06 +00:00
Click the "Save Project" icon (💾) to save the project.
2023-04-18 04:46:43 +00:00
11) In the Google Sheets window, select cell A1 and enter the formula
```
2024-04-26 04:16:13 +00:00
=SHEETJS("https://docs.sheetjs.com/pres.numbers")
2023-04-18 04:46:43 +00:00
```
The file will be fetched and the contents will be written to the sheet.