docs.sheetjs.com/docz/docs/03-demos/30-cloud/19-deno.md

139 lines
4.1 KiB
Markdown
Raw Permalink Normal View History

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
:::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.