polotno-node 2.12.16 → 2.12.18
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +126 -21
- package/dist/assets/{html2canvas.esm-CBrSDip1.js → html2canvas.esm-BfxBtG_O.js} +1 -1
- package/dist/assets/index-Cn3AfcuE.js +627 -0
- package/dist/assets/index.es-DBuDDb35.js +18 -0
- package/dist/index.html +1 -1
- package/index.js +1 -1
- package/package.json +8 -8
- package/dist/assets/index-CuX31qNv.js +0 -620
- package/dist/assets/index.es-Uuln-F6j.js +0 -18
package/README.md
CHANGED
|
@@ -461,10 +461,12 @@ How to create a configuration layer with a dependency on `chronium` ?
|
|
|
461
461
|
|
|
462
462
|
1. Create a `.zip` file from a chronium project. For example:
|
|
463
463
|
|
|
464
|
-
```
|
|
464
|
+
```shell
|
|
465
465
|
mkdir chronium-112 && cd chronium-112
|
|
466
|
+
|
|
466
467
|
npm init -y
|
|
467
468
|
npm install @sparticuz/chromium@112.0
|
|
469
|
+
|
|
468
470
|
zip -r chronium.zip ./*
|
|
469
471
|
```
|
|
470
472
|
|
|
@@ -477,19 +479,26 @@ zip -r chronium.zip ./*
|
|
|
477
479
|
|
|
478
480
|
How to run the full example with aws-cli ?
|
|
479
481
|
|
|
480
|
-
|
|
482
|
+
### 1. Create a Lambda configuration layer
|
|
481
483
|
|
|
482
|
-
|
|
484
|
+
Create a Lambda configuration layer, and upload a **.zip** archive which stores a **chronium** npm or git package.
|
|
485
|
+
|
|
486
|
+
```shell
|
|
483
487
|
export CH_VERSION=112.0
|
|
484
488
|
export BUCKET=example-bucket
|
|
485
489
|
export AWS_ACC_ID=000000000000
|
|
486
|
-
|
|
490
|
+
|
|
491
|
+
# create a chronium project for Layer
|
|
487
492
|
mkdir chronium-layer
|
|
488
493
|
cd chronium-layer
|
|
489
494
|
npm init -y
|
|
490
495
|
npm install @sparticuz/chromium@${CH_VERSION}
|
|
491
496
|
zip -r chronium.zip ./*
|
|
497
|
+
|
|
498
|
+
# upload a Layer to S3
|
|
492
499
|
aws s3 cp chronium.zip s3://${BUCKET}/lambda-layers/chronium-${CH_VERSION}.zip
|
|
500
|
+
|
|
501
|
+
# publish a Layer so it can be used in Lambda
|
|
493
502
|
aws lambda publish-layer-version \
|
|
494
503
|
--layer-name chronium-polotno \
|
|
495
504
|
--content "S3Bucket=${BUCKET},S3Key=lambda-layers/chronium-{CH_VERSION}.zip" \
|
|
@@ -498,18 +507,25 @@ aws lambda publish-layer-version \
|
|
|
498
507
|
--compatible-runtimes nodejs18.x
|
|
499
508
|
```
|
|
500
509
|
|
|
501
|
-
|
|
502
|
-
|
|
503
|
-
```
|
|
504
|
-
|
|
510
|
+
### 2. Create a JS file for a Lambda's handler
|
|
511
|
+
#### Init a node project
|
|
512
|
+
```shell
|
|
513
|
+
# create a folder
|
|
505
514
|
mkdir handler && cd handler
|
|
506
|
-
|
|
515
|
+
|
|
516
|
+
# init a node project
|
|
507
517
|
npm init -y
|
|
508
|
-
|
|
518
|
+
|
|
519
|
+
# install dependencies
|
|
509
520
|
npm install --save polotno-node puppeteer-core@19.8.0
|
|
510
|
-
|
|
521
|
+
```
|
|
522
|
+
|
|
523
|
+
#### Create a handler
|
|
524
|
+
```shell
|
|
525
|
+
# create a file handler
|
|
511
526
|
touch index.mjs
|
|
512
|
-
|
|
527
|
+
|
|
528
|
+
# add code example
|
|
513
529
|
echo "
|
|
514
530
|
import chromium from "@sparticuz/chromium";
|
|
515
531
|
import puppeteer from "puppeteer-core";
|
|
@@ -544,18 +560,64 @@ export const handler = () => {
|
|
|
544
560
|
}
|
|
545
561
|
};
|
|
546
562
|
" >> index.mjs
|
|
547
|
-
|
|
563
|
+
```
|
|
564
|
+
|
|
565
|
+
<details>
|
|
566
|
+
<summary>Highlighted code example from the command above:</summary>
|
|
567
|
+
|
|
568
|
+
```js
|
|
569
|
+
import chromium from "@sparticuz/chromium";
|
|
570
|
+
import puppeteer from "puppeteer-core";
|
|
571
|
+
import { createInstance } from "polotno-node";
|
|
572
|
+
export const handler = () => {
|
|
573
|
+
const browser = await puppeteer.launch({
|
|
574
|
+
args: [
|
|
575
|
+
...chromium.args,
|
|
576
|
+
"--no-sandbox",
|
|
577
|
+
"--hide-scrollbars",
|
|
578
|
+
"--disable-web-security",
|
|
579
|
+
"--allow-file-access-from-files",
|
|
580
|
+
"--disable-dev-shm-usage",
|
|
581
|
+
],
|
|
582
|
+
defaultViewport: chromium.defaultViewport,
|
|
583
|
+
executablePath: await chromium.executablePath(),
|
|
584
|
+
headless: true,
|
|
585
|
+
ignoreHTTPSErrors: true,
|
|
586
|
+
});
|
|
587
|
+
const polotnoInstance = await createInstance({
|
|
588
|
+
key: process.env.POLOTNO_API_KEY,
|
|
589
|
+
browser,
|
|
590
|
+
});
|
|
591
|
+
const body = polotnoInstance.jsonToImageBase64(event.json)
|
|
592
|
+
|
|
593
|
+
return {
|
|
594
|
+
StatusCode: 200,
|
|
595
|
+
headers: {
|
|
596
|
+
'Content-Type': 'image/png'
|
|
597
|
+
},
|
|
598
|
+
body,
|
|
599
|
+
}
|
|
600
|
+
};
|
|
601
|
+
```
|
|
602
|
+
</details>
|
|
603
|
+
|
|
604
|
+
#### Create file with variables
|
|
605
|
+
```shell
|
|
548
606
|
echo '{
|
|
549
607
|
"Variables": {
|
|
550
608
|
"POLOTNO_API_KEY": "your-api-key"
|
|
551
609
|
}
|
|
552
610
|
}
|
|
553
611
|
' >> vars.json
|
|
554
|
-
|
|
612
|
+
|
|
613
|
+
# archive the folder
|
|
555
614
|
zip -r index.zip ./*
|
|
556
|
-
|
|
615
|
+
|
|
616
|
+
# copy to S3
|
|
557
617
|
aws s3 cp index.zip s3://${BUCKET}/polotno-handler.zip
|
|
558
|
-
|
|
618
|
+
```
|
|
619
|
+
#### Crete a trust policy
|
|
620
|
+
```shell
|
|
559
621
|
echo '{
|
|
560
622
|
"Version": "2012-10-17",
|
|
561
623
|
"Statement": [
|
|
@@ -569,7 +631,11 @@ echo '{
|
|
|
569
631
|
]
|
|
570
632
|
}
|
|
571
633
|
' >> trustPolicy.json
|
|
572
|
-
|
|
634
|
+
```
|
|
635
|
+
|
|
636
|
+
#### Create roles and policies in AWS
|
|
637
|
+
|
|
638
|
+
```shell
|
|
573
639
|
aws iam create-role --role-name lambda-polotno-role --assume-role-policy-document file://trustPolicy.json
|
|
574
640
|
aws iam attach-role-policy --role-name lambda-polotno-role --policy-arn arn:aws:iam::aws:policy/service-role/AWSLambdaBasicExecutionRole
|
|
575
641
|
aws lambda create-function --function-name lambda-polotno \
|
|
@@ -585,6 +651,42 @@ aws lambda create-function --function-name lambda-polotno \
|
|
|
585
651
|
aws lambda invoke --function-name lambda-polotno --cli-binary-format raw-in-base64-out --payload file://polotno-project-json.json image
|
|
586
652
|
```
|
|
587
653
|
|
|
654
|
+
### AWS Lambda fonts issue
|
|
655
|
+
|
|
656
|
+
If you have faced an issue `Timeout for loading font <font name>`, please proceed to the next solution.
|
|
657
|
+
|
|
658
|
+
Lambda functions does not include any fonts by default, so we need to provide basic fonts (Arial and Times or their analogs) to make sure Polotno fonts functionality is working correctly.
|
|
659
|
+
|
|
660
|
+
1. Create a `fonts` folder in the root of your handler project.
|
|
661
|
+
```shell
|
|
662
|
+
mkdir fonts
|
|
663
|
+
```
|
|
664
|
+
2. Put the `Arial.ttf` and `Times.ttf` files into the `fonts` folder. You can get them from your system fonts folder.
|
|
665
|
+
3. Usage of fonts analogues is also possible:
|
|
666
|
+
1. If you don't want to use system Arial and Times fonts, you can use [Liberation Fonts](https://github.com/liberationfonts/liberation-fonts) as free alternative. Download fonts from repository. Put `LiberationMono-Regular.ttf` and `LiberationSans-Regular.ttf` inside `fonts` folder.
|
|
667
|
+
2. Create file `fonts.conf` inside `fonts` folder. It should contain the following lines:
|
|
668
|
+
```xml
|
|
669
|
+
<?xml version="1.0"?>
|
|
670
|
+
<!DOCTYPE fontconfig SYSTEM "fonts.dtd">
|
|
671
|
+
<fontconfig>
|
|
672
|
+
<alias>
|
|
673
|
+
<family>Arial</family>
|
|
674
|
+
<prefer>
|
|
675
|
+
<family>Liberation Sans</family>
|
|
676
|
+
</prefer>
|
|
677
|
+
</alias>
|
|
678
|
+
<alias>
|
|
679
|
+
<family>Times New Roman</family>
|
|
680
|
+
<prefer>
|
|
681
|
+
<family>Liberation Serif</family>
|
|
682
|
+
</prefer>
|
|
683
|
+
</alias>
|
|
684
|
+
|
|
685
|
+
<dir>/var/task/fonts</dir>
|
|
686
|
+
</fontconfig>
|
|
687
|
+
```
|
|
688
|
+
3. Upload your Lambda function as usual, fonts will be loaded automatically.
|
|
689
|
+
|
|
588
690
|
## Troubleshooting
|
|
589
691
|
|
|
590
692
|
If you have an error like this
|
|
@@ -598,9 +700,12 @@ Unhandled Promise Rejection {"errorType":"Runtime.UnhandledPromiseRejection","er
|
|
|
598
700
|
It may mean that Polotno Client Editor was not loaded in `puppeteer` instance. It is possible that you are missing required files in `node_modules` folder. I got this error when I was trying to run `polotno-node` on Vercel. To fix the issue you need to add this config into `vercel.json`:
|
|
599
701
|
|
|
600
702
|
```json
|
|
601
|
-
|
|
602
|
-
"
|
|
603
|
-
"
|
|
604
|
-
|
|
703
|
+
{
|
|
704
|
+
"functions": {
|
|
705
|
+
"api/render.js": {
|
|
706
|
+
// remember to replace this line with your function name
|
|
707
|
+
"includeFiles": "node_modules/polotno-node/\*\*"
|
|
708
|
+
}
|
|
709
|
+
}
|
|
605
710
|
}
|
|
606
711
|
```
|