2023-06-06 10:01:12 +00:00
|
|
|
---
|
2024-05-28 05:20:05 +00:00
|
|
|
title: Sheets with Deno Deploy
|
|
|
|
sidebar_label: Deno Deploy
|
2023-06-06 10:01:12 +00:00
|
|
|
pagination_prev: demos/local/index
|
|
|
|
pagination_next: demos/extensions/index
|
|
|
|
---
|
|
|
|
|
|
|
|
import current from '/version.js';
|
|
|
|
import CodeBlock from '@theme/CodeBlock';
|
|
|
|
|
2023-10-19 05:23:55 +00:00
|
|
|
[Deno Deploy](https://dash.deno.com/) offers distributed "Serverless Functions"
|
|
|
|
powered by Deno.
|
2023-06-06 10:01:12 +00:00
|
|
|
|
2023-10-19 05:23:55 +00:00
|
|
|
[SheetJS](https://sheetjs.com) is a JavaScript library for reading and writing
|
|
|
|
data from spreadsheets.
|
2023-06-06 10:01:12 +00:00
|
|
|
|
2023-10-19 05:23:55 +00:00
|
|
|
This demo covers integration details. We'll explore how to load and use SheetJS
|
|
|
|
scripts in Deno Deploy functions.
|
2023-06-06 10:01:12 +00:00
|
|
|
|
2023-11-30 07:10:37 +00:00
|
|
|
The ["Demo"](#demo) section builds a sample service that converts XLSX and other
|
|
|
|
types of spreadsheets to HTML tables and CSV rows.
|
2023-06-06 10:01:12 +00:00
|
|
|
|
2023-10-19 05:23:55 +00:00
|
|
|
:::caution pass
|
|
|
|
|
|
|
|
When the demo was last tested, Deno Deploy required a GitHub account.
|
2023-06-06 10:01:12 +00:00
|
|
|
|
|
|
|
:::
|
|
|
|
|
2023-11-30 07:10:37 +00:00
|
|
|
:::note Tested Deployments
|
2023-06-06 10:01:12 +00:00
|
|
|
|
2024-05-28 05:20:05 +00:00
|
|
|
This demo was last tested by SheetJS users on 2024 May 26.
|
2023-06-06 10:01:12 +00:00
|
|
|
|
|
|
|
:::
|
|
|
|
|
2023-10-19 05:23:55 +00:00
|
|
|
## Integration Details
|
|
|
|
|
2024-03-18 08:24:41 +00:00
|
|
|
The [SheetJS Deno module](/docs/getting-started/installation/deno) can be
|
2023-10-19 05:23:55 +00:00
|
|
|
imported from Deno Deploy server scripts.
|
|
|
|
|
|
|
|
### Supported Frameworks
|
|
|
|
|
2024-04-14 07:40:38 +00:00
|
|
|
:::danger pass
|
2023-10-19 05:23:55 +00:00
|
|
|
|
|
|
|
Deno Deploy does not offer any sort of temporary file access in functions.
|
|
|
|
|
|
|
|
This breaks web frameworks that use the filesystem in body parsing.
|
|
|
|
|
|
|
|
:::
|
2023-06-06 10:01:12 +00:00
|
|
|
|
|
|
|
When the demo was last tested, the `drash` server framework used an in-memory
|
|
|
|
approach for parsing POST request bodies.
|
|
|
|
|
2023-10-19 05:23:55 +00:00
|
|
|
The [Drash demo](/docs/demos/net/server/drash) covers the framework in detail.
|
|
|
|
|
2023-06-06 10:01:12 +00:00
|
|
|
### Parsing Data
|
|
|
|
|
|
|
|
When files are submitted via HTTP POST, the `bodyParam` method can fetch data.
|
|
|
|
The `content` property of the returned object can be parsed with `XLSX.read`.
|
|
|
|
|
|
|
|
The following example assumes the file is submitted at field name `file`:
|
|
|
|
|
|
|
|
<CodeBlock language="ts">{`\
|
|
|
|
// @deno-types="https://cdn.sheetjs.com/xlsx-${current}/package/types/index.d.ts"
|
|
|
|
import { read, utils } from 'https://cdn.sheetjs.com/xlsx-${current}/package/xlsx.mjs';
|
2023-10-19 05:23:55 +00:00
|
|
|
import * as Drash from "https://cdn.jsdelivr.net/gh/drashland/drash@v2.8.1/mod.ts";
|
2023-06-06 10:01:12 +00:00
|
|
|
\n\
|
|
|
|
class SheetJSResource extends Drash.Resource {
|
|
|
|
public paths = ["/"];
|
|
|
|
\n\
|
|
|
|
public POST(request: Drash.Request, response: Drash.Response) {
|
|
|
|
// highlight-start
|
|
|
|
/* get data from body */
|
|
|
|
const file = request.bodyParam<Drash.Types.BodyFile>("file");
|
|
|
|
/* parse */
|
|
|
|
var wb = read(file.content, {type: "buffer", dense: true});
|
|
|
|
// highlight-end
|
|
|
|
/* generate HTML from first worksheet */
|
|
|
|
return response.html(utils.sheet_to_html(wb.Sheets[wb.SheetNames[0]]));
|
|
|
|
}
|
|
|
|
}`}
|
|
|
|
</CodeBlock>
|
|
|
|
|
|
|
|
## Demo
|
|
|
|
|
2023-10-19 05:23:55 +00:00
|
|
|
0) Create a new GitHub account or sign into an existing account.
|
2023-06-06 10:01:12 +00:00
|
|
|
|
2023-10-19 05:23:55 +00:00
|
|
|
1) Open the [main Deno Deploy portal](https://dash.deno.com/) in a browser.
|
2023-06-06 10:01:12 +00:00
|
|
|
|
2023-10-19 05:23:55 +00:00
|
|
|
2) If the account never signed into Deno Deploy, click "Continue with Github".
|
2023-06-06 10:01:12 +00:00
|
|
|
|
2024-05-28 05:20:05 +00:00
|
|
|
In the next screen, review the prompt and click "Authorize Deno Deploy".
|
|
|
|
|
|
|
|
If a welcome screen is displayed, click "I know what I'm doing".
|
2023-06-06 10:01:12 +00:00
|
|
|
|
2023-10-19 05:23:55 +00:00
|
|
|
3) Click "New Playground" to create a new Playground.
|
2023-06-06 10:01:12 +00:00
|
|
|
|
2023-10-19 05:23:55 +00:00
|
|
|
4) Download [`s2c.ts`](pathname:///deno/s2c.ts).
|
2023-06-06 10:01:12 +00:00
|
|
|
|
2023-10-19 05:23:55 +00:00
|
|
|
5) Open `s2c.ts` with a text editor and copy the contents of the source file
|
|
|
|
into the playground editor (left pane in the browser).
|
|
|
|
|
|
|
|
6) Click "Save and Deploy". When the demo was last tested, it was a blue button.
|
2023-06-06 10:01:12 +00:00
|
|
|
|
|
|
|
### Testing
|
|
|
|
|
2023-10-19 05:23:55 +00:00
|
|
|
7) Wait until the server is deployed. When it is deployed, the right panel will
|
|
|
|
show "SheetJS Spreadsheet Conversion Service":
|
|
|
|
|
|
|
|
> ![Screenshot](pathname:///deno/sshot.png)
|
|
|
|
|
2024-04-26 04:16:13 +00:00
|
|
|
8) Download the test file https://docs.sheetjs.com/pres.xlsx
|
2023-06-06 10:01:12 +00:00
|
|
|
|
2023-10-19 05:23:55 +00:00
|
|
|
9) In the browser window, click "Choose File" and select the downloaded file.
|
2023-06-06 10:01:12 +00:00
|
|
|
|
2023-10-19 05:23:55 +00:00
|
|
|
10) Click "Submit". The right panel will show the contents in a HTML TABLE.
|
2023-06-06 10:01:12 +00:00
|
|
|
|
2024-04-26 04:16:13 +00:00
|
|
|
11) Open a terminal window and download https://docs.sheetjs.com/pres.numbers:
|
2023-06-06 10:01:12 +00:00
|
|
|
|
|
|
|
```bash
|
2024-04-26 04:16:13 +00:00
|
|
|
curl -LO https://docs.sheetjs.com/pres.numbers
|
2023-06-06 10:01:12 +00:00
|
|
|
```
|
|
|
|
|
2023-10-19 05:23:55 +00:00
|
|
|
12) Copy the first `curl` line from the page and run in the terminal. For
|
2023-06-06 10:01:12 +00:00
|
|
|
example, if the deployment is `clean-badger-69`, the command would be
|
|
|
|
|
|
|
|
```bash
|
|
|
|
curl -X POST -F"file=@pres.numbers" https://clean-badger-69.deno.dev/
|
|
|
|
```
|
|
|
|
|
|
|
|
The output will be an HTML table
|
|
|
|
|
2023-10-19 05:23:55 +00:00
|
|
|
13) Copy the second `curl` line from the page and run in the terminal. For
|
2023-06-06 10:01:12 +00:00
|
|
|
example, if the deployment is `clean-badger-69`, the command would be
|
|
|
|
|
|
|
|
```bash
|
|
|
|
curl -X POST -F"file=@pres.numbers" -F"type=csv" https://clean-badger-69.deno.dev/
|
|
|
|
```
|
|
|
|
|
|
|
|
The output will be CSV.
|