mirror of
https://github.com/alam00000/bentopdf.git
synced 2026-11-05 20:02:47 +01:00
140 lines
4.7 KiB
Markdown
140 lines
4.7 KiB
Markdown
# Implementeren op Netlify
|
|
|
|
[Netlify](https://netlify.com) biedt uitstekende hosting voor statische sites met een royale gratis laag.
|
|
|
|
## Implementeren met één klik
|
|
|
|
[](https://app.netlify.com/start/deploy?repository=https://github.com/alam00000/bentopdf)
|
|
|
|
## Handmatig implementeren
|
|
|
|
### Stap 1: Repository koppelen
|
|
|
|
1. Log in bij [Netlify](https://app.netlify.com)
|
|
2. Klik op "Add new site" → "Import an existing project"
|
|
3. Koppel je GitHub-account
|
|
4. Selecteer je BentoPDF-fork
|
|
|
|
### Stap 2: Buildinstellingen configureren
|
|
|
|
| Instelling | Waarde |
|
|
| ----------------- | --------------- |
|
|
| Build command | `npm run build` |
|
|
| Publish directory | `dist` |
|
|
| Node version | 18+ |
|
|
|
|
### Stap 3: Implementeren
|
|
|
|
Klik op "Deploy site" en wacht tot de build klaar is.
|
|
|
|
## Configuratiebestand
|
|
|
|
Maak `netlify.toml` aan in de hoofdmap van je project:
|
|
|
|
```toml
|
|
[build]
|
|
command = "npm run build"
|
|
publish = "dist"
|
|
|
|
[build.environment]
|
|
NODE_VERSION = "18"
|
|
|
|
# Required security headers for SharedArrayBuffer (used by LibreOffice WASM)
|
|
[[headers]]
|
|
for = "/*"
|
|
[headers.values]
|
|
Cross-Origin-Embedder-Policy = "require-corp"
|
|
Cross-Origin-Opener-Policy = "same-origin"
|
|
Cross-Origin-Resource-Policy = "cross-origin"
|
|
|
|
# Pre-compressed LibreOffice WASM binary - must be served with Content-Encoding
|
|
[[headers]]
|
|
for = "/libreoffice-wasm/soffice.wasm.gz"
|
|
[headers.values]
|
|
Content-Type = "application/wasm"
|
|
Content-Encoding = "gzip"
|
|
Cache-Control = "public, max-age=31536000, immutable"
|
|
|
|
# Pre-compressed LibreOffice WASM data - must be served with Content-Encoding
|
|
[[headers]]
|
|
for = "/libreoffice-wasm/soffice.data.gz"
|
|
[headers.values]
|
|
Content-Type = "application/octet-stream"
|
|
Content-Encoding = "gzip"
|
|
Cache-Control = "public, max-age=31536000, immutable"
|
|
|
|
# Cache other WASM files
|
|
[[headers]]
|
|
for = "*.wasm"
|
|
[headers.values]
|
|
Cache-Control = "public, max-age=31536000, immutable"
|
|
Content-Type = "application/wasm"
|
|
|
|
# SPA routing
|
|
[[redirects]]
|
|
from = "/*"
|
|
to = "/index.html"
|
|
status = 200
|
|
```
|
|
|
|
::: warning Belangrijk
|
|
De headers `Cross-Origin-Embedder-Policy` en `Cross-Origin-Opener-Policy` zijn vereist voor conversies van Word/ODT/Excel/PowerPoint naar PDF. Zonder deze headers is `SharedArrayBuffer` niet beschikbaar en kan de LibreOffice WASM-engine niet worden geïnitialiseerd.
|
|
|
|
De `Content-Encoding: gzip`-headers op de bestanden `.wasm.gz` en `.data.gz` zorgen ervoor dat de browser ze automatisch decomprimeert. Zonder deze headers ontvangt de browser ruwe gzip-bytes en mislukt de WASM-compilatie.
|
|
:::
|
|
|
|
## Omgevingsvariabelen
|
|
|
|
Stel deze in via Site settings → Environment variables:
|
|
|
|
| Variabele | Beschrijving |
|
|
| ----------------------- | ------------------------------------------------------------------------ |
|
|
| `SIMPLE_MODE` | Stel in op `true` voor een minimale build |
|
|
| `VITE_BRAND_NAME` | Eigen merknaam (vervangt "BentoPDF") |
|
|
| `VITE_BRAND_LOGO` | Logopad relatief ten opzichte van `public/` (bijv. `images/my-logo.svg`) |
|
|
| `VITE_FOOTER_TEXT` | Eigen footer-/copyrighttekst |
|
|
| `VITE_DEFAULT_LANGUAGE` | Standaardtaal van de interface (bijv. `fr`, `de`, `es`) |
|
|
|
|
## Eigen domein
|
|
|
|
1. Ga naar Site settings → Domain management
|
|
2. Klik op "Add custom domain"
|
|
3. Volg de DNS-configuratie-instructies
|
|
|
|
## Grote media
|
|
|
|
Overweeg voor grote WASM-bestanden [Netlify Large Media](https://docs.netlify.com/large-media/overview/) in te schakelen:
|
|
|
|
```bash
|
|
netlify lm:setup
|
|
git lfs track "*.wasm"
|
|
```
|
|
|
|
## Probleemoplossing
|
|
|
|
### Word/ODT/Excel naar PDF blijft hangen op 55%
|
|
|
|
Als documentconversies blijven hangen op 55%, open dan de DevTools-console en controleer:
|
|
|
|
```js
|
|
console.log(window.crossOriginIsolated); // should be true
|
|
console.log(typeof SharedArrayBuffer); // should be "function"
|
|
```
|
|
|
|
Als `crossOriginIsolated` `false` is, worden de COEP/COOP-headers uit je `netlify.toml` niet toegepast. Zorg dat het bestand in de hoofdmap van je project staat en implementeer opnieuw.
|
|
|
|
Als je `expected magic word 00 61 73 6d, found 1f 8b 08 08` in de console ziet, ontbreken bij de `.wasm.gz`-bestanden de `Content-Encoding: gzip`-headers. Zorg dat de `[[headers]]`-blokken voor `soffice.wasm.gz` en `soffice.data.gz` in je `netlify.toml` staan.
|
|
|
|
### Build mislukt
|
|
|
|
Controleer de compatibiliteit van de Node-versie:
|
|
|
|
```toml
|
|
[build.environment]
|
|
NODE_VERSION = "20"
|
|
```
|
|
|
|
### Trage eerste lading
|
|
|
|
Schakel assetoptimalisatie in via Site settings → Build & deploy → Asset optimization.
|