Déployer sur Hostinger

Hostinger est un hébergeur mutualisé très répandu. Ce guide explique comment déployer BentoPDF sur l'hébergement mutualisé de Hostinger.

Prérequis

Offre d'hébergement Hostinger avec accès au gestionnaire de fichiers
Node.js installé en local pour la compilation

Étape 1 : compiler le projet

bash

git clone https://github.com/alam00000/bentopdf.git
cd bentopdf
npm install
npm run build

Les fichiers compilés se trouvent dans le dossier dist.

Étape 2 : téléverser sur Hostinger

Déploiement à la racine du domaine

Connectez-vous à votre compte Hostinger
Allez dans File Manager → public_html
Supprimez tous les fichiers existants (faites une sauvegarde si nécessaire)
Téléversez tout le contenu de votre dossier local dist dans public_html

Déploiement dans un sous-répertoire

Si vous déployez dans un sous-répertoire (p. ex. yourdomain.com/pdf-tools/) :

Compilez avec la bonne URL de base :

bash

BASE_URL=/pdf-tools/ npm run build

Créez le dossier dans Hostinger :
- Allez dans File Manager → public_html
- Créez un nouveau dossier : pdf-tools
Téléversez tout le contenu de dist dans public_html/pdf-tools/

Étape 3 : créer le fichier .htaccess

Créez un fichier .htaccess à la racine de votre dossier de déploiement (public_html ou public_html/pdf-tools/) :

Important

Pour un déploiement dans un sous-répertoire, remplacez RewriteBase / par RewriteBase /pdf-tools/ (ou le nom de votre dossier).

apache

RewriteEngine On
RewriteBase /

# ============================================
# 1. SECURITY HEADERS (CRITICAL FOR WASM)
# ============================================
<IfModule mod_headers.c>
    Header always set X-Frame-Options "SAMEORIGIN"
    Header always set X-Content-Type-Options "nosniff"
    Header always set X-XSS-Protection "1; mode=block"
    Header always set Referrer-Policy "strict-origin-when-cross-origin"
    Header always set Permissions-Policy "geolocation=(), microphone=(), camera=()"

    # REQUIRED for soffice.js (SharedArrayBuffer)
    Header always set Cross-Origin-Opener-Policy "same-origin"
    Header always set Cross-Origin-Embedder-Policy "require-corp"
</IfModule>

# ============================================
# 2. BROWSER CACHING
# ============================================
<IfModule mod_expires.c>
    ExpiresActive On
    ExpiresByType image/jpeg "access plus 1 year"
    ExpiresByType image/png "access plus 1 year"
    ExpiresByType image/gif "access plus 1 year"
    ExpiresByType image/webp "access plus 1 year"
    ExpiresByType image/svg+xml "access plus 1 year"
    ExpiresByType image/x-icon "access plus 1 year"
    ExpiresByType font/woff2 "access plus 1 year"
    ExpiresByType font/woff "access plus 1 year"
    ExpiresByType font/ttf "access plus 1 year"
    ExpiresByType text/css "access plus 1 month"
    ExpiresByType application/javascript "access plus 1 month"
    ExpiresByType application/wasm "access plus 1 year"
    ExpiresByType application/gzip "access plus 1 year"
    ExpiresByType text/html "access plus 0 seconds"
</IfModule>

# ============================================
# 3. COMPRESSION (STANDARD)
# ============================================
# Prevent server from double-compressing files
SetEnvIfNoCase Request_URI "\.gz$" no-gzip
SetEnvIfNoCase Request_URI "\.br$" no-gzip
SetEnvIfNoCase Request_URI "\.wasm$" no-gzip

<IfModule mod_deflate.c>
    AddOutputFilterByType DEFLATE text/plain
    AddOutputFilterByType DEFLATE text/html
    AddOutputFilterByType DEFLATE text/xml
    AddOutputFilterByType DEFLATE text/css
    AddOutputFilterByType DEFLATE application/xml
    AddOutputFilterByType DEFLATE application/xhtml+xml
    AddOutputFilterByType DEFLATE application/rss+xml
    AddOutputFilterByType DEFLATE application/javascript
    AddOutputFilterByType DEFLATE application/x-javascript
    AddOutputFilterByType DEFLATE application/json
    AddOutputFilterByType DEFLATE image/svg+xml
    AddOutputFilterByType DEFLATE font/woff
    AddOutputFilterByType DEFLATE font/ttf
</IfModule>

# ============================================
# 4. MIME TYPES & SPECIAL FILE HANDLING
# ============================================
AddType application/javascript .js .mjs
AddType application/wasm .wasm
AddType font/woff2 .woff2
AddType font/woff .woff
AddType image/webp .webp

# Handle soffice.wasm.gz correctly
<FilesMatch "soffice\.wasm\.gz$">
    ForceType application/wasm
    Header set Content-Encoding "gzip"
    Header set Cross-Origin-Resource-Policy "cross-origin"
    Header append Vary Accept-Encoding
</FilesMatch>

# Handle data.gz
<FilesMatch "soffice\.data\.gz$">
    ForceType application/octet-stream
    Header set Content-Encoding "gzip"
    Header append Vary Accept-Encoding
</FilesMatch>

# ============================================
# 5. REDIRECTS & ROUTING
# ============================================
# Canonical WWW (update domain as needed)
RewriteCond %{HTTP_HOST} ^bentopdf\.com [NC]
RewriteRule ^(.*)$ https://www.bentopdf.com/$1 [L,R=301]

# Force HTTPS
RewriteCond %{HTTPS} off
RewriteRule ^(.*)$ https://%{HTTP_HOST}%{REQUEST_URI} [L,R=301]

# Remove trailing slash (except for language root directories)
RewriteCond %{REQUEST_FILENAME} !-d
RewriteCond %{REQUEST_URI} !^/(de|es|zh|zh-TW|vi|it|id|tr|fr|pt)/$
RewriteCond %{REQUEST_URI} (.+)/$
RewriteRule ^ %1 [R=301,L]

# Existing files/dirs - serve directly
RewriteCond %{REQUEST_FILENAME} -f [OR]
RewriteCond %{REQUEST_FILENAME} -d
RewriteRule ^ - [L]

# ============================================
# 5.1. LANGUAGE ROUTES
# ============================================
# Supported languages: de, es, zh, zh-TW, vi, it, id, tr, fr, pt
# English has no prefix - served from root

# English prefix redirects to root (for SEO consistency)
RewriteRule ^en/?$ / [R=301,L]
RewriteRule ^en/(.+)$ /$1 [R=301,L]

# Language prefix root (e.g., /de/ -> /de/index.html)
RewriteCond %{DOCUMENT_ROOT}/$1/index.html -f
RewriteRule ^(de|es|zh|zh-TW|vi|it|id|tr|fr|pt)/?$ /$1/index.html [L]

# Language prefix with path (e.g., /de/merge-pdf -> /de/merge-pdf.html)
RewriteCond %{DOCUMENT_ROOT}/$1/$2.html -f
RewriteRule ^(de|es|zh|zh-TW|vi|it|id|tr|fr|pt)/([^/]+)/?$ /$1/$2.html [L]

# ============================================
# 5.5. DOCS ROUTING (VitePress)
# ============================================
RewriteCond %{REQUEST_URI} ^/docs
RewriteCond %{REQUEST_FILENAME} !-f
RewriteCond %{REQUEST_FILENAME}\.html -f
RewriteRule ^(.*)$ $1.html [L]

# ============================================
# 6. ADD .HTML EXTENSION IF FILE EXISTS (ROOT LEVEL ONLY)
# ============================================
RewriteCond %{REQUEST_FILENAME} !-f
RewriteCond %{REQUEST_FILENAME} !-d
RewriteCond %{REQUEST_FILENAME}.html -f
RewriteRule ^([^/]+)$ $1.html [L]

# ============================================
# 7. ERROR PAGES
# ============================================
ErrorDocument 404 /404.html

Exemple de .htaccess pour un sous-répertoire

Pour yourdomain.com/pdf-tools/, modifiez ces lignes :

apache

RewriteBase /pdf-tools/

# ... (same content as above, but update paths) ...

# Language prefix root
RewriteCond %{DOCUMENT_ROOT}/pdf-tools/$1/index.html -f
RewriteRule ^(de|es|zh|zh-TW|vi|it|id|tr|fr|pt)/?$ /pdf-tools/$1/index.html [L]

# Language prefix with path
RewriteCond %{DOCUMENT_ROOT}/pdf-tools/$1/$2.html -f
RewriteRule ^(de|es|zh|zh-TW|vi|it|id|tr|fr|pt)/([^/]+)/?$ /pdf-tools/$1/$2.html [L]

# Root level .html extension
RewriteCond %{REQUEST_FILENAME} !-f
RewriteCond %{REQUEST_FILENAME} !-d
RewriteCond %{REQUEST_FILENAME}.html -f
RewriteRule ^([^/]+)$ $1.html [L]

ErrorDocument 404 /pdf-tools/404.html

Dépannage

Les fichiers WASM ne se chargent pas

Vérifiez que les types MIME sont correctement définis dans .htaccess :

apache

AddType application/wasm .wasm

Les outils LibreOffice ne fonctionnent pas

Les en-têtes de sécurité sont essentiels pour SharedArrayBuffer :

apache

Header always set Cross-Origin-Opener-Policy "same-origin"
Header always set Cross-Origin-Embedder-Policy "require-corp"

Si les en-têtes ne sont pas appliqués, contactez le support Hostinger pour activer mod_headers.

Erreurs 404 lors de l'actualisation de la page

Assurez-vous que la règle d'extension .html et les routes de langue sont correctement configurées. BentoPDF utilise des fichiers HTML statiques, pas un routage SPA :

apache

# Language routes serve actual files from language directories
RewriteCond %{DOCUMENT_ROOT}/$1/$2.html -f
RewriteRule ^(de|es|zh|zh-TW|vi|it|id|tr|fr|pt)/([^/]+)/?$ /$1/$2.html [L]

# Root level pages
RewriteCond %{REQUEST_FILENAME}.html -f
RewriteRule ^([^/]+)$ $1.html [L]

Limites de téléversement

Hostinger peut imposer des limites de taille de fichier. Téléversez les fichiers WASM séparément si le téléversement groupé échoue.

Déployer sur Hostinger ​

Prérequis ​

Étape 1 : compiler le projet ​

Étape 2 : téléverser sur Hostinger ​

Déploiement à la racine du domaine ​

Déploiement dans un sous-répertoire ​

Étape 3 : créer le fichier .htaccess ​

Exemple de .htaccess pour un sous-répertoire ​

Dépannage ​

Les fichiers WASM ne se chargent pas ​

Les outils LibreOffice ne fonctionnent pas ​

Erreurs 404 lors de l'actualisation de la page ​

Limites de téléversement ​

Déployer sur Hostinger

Prérequis

Étape 1 : compiler le projet

Étape 2 : téléverser sur Hostinger

Déploiement à la racine du domaine

Déploiement dans un sous-répertoire

Étape 3 : créer le fichier .htaccess

Exemple de .htaccess pour un sous-répertoire

Dépannage

Les fichiers WASM ne se chargent pas

Les outils LibreOffice ne fonctionnent pas

Erreurs 404 lors de l'actualisation de la page

Limites de téléversement