Desplegar en Hostinger

Hostinger es un proveedor de alojamiento compartido muy popular. Esta guía explica cómo desplegar BentoPDF en el alojamiento compartido de Hostinger.

Requisitos previos

Plan de alojamiento de Hostinger con acceso al administrador de archivos
Node.js instalado localmente para compilar

Paso 1: Compilar el proyecto

bash

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

Los archivos compilados estarán en la carpeta dist.

Paso 2: Subir a Hostinger

Despliegue en el dominio raíz

Inicia sesión en tu cuenta de Hostinger
Ve a File Manager → public_html
Elimina los archivos existentes (haz una copia de seguridad si hace falta)
Sube todo el contenido de tu carpeta local dist a public_html

Despliegue en un subdirectorio

Si despliegas en un subdirectorio (p. ej., yourdomain.com/pdf-tools/):

Compila con la URL base correcta:

bash

BASE_URL=/pdf-tools/ npm run build

Crea la carpeta en Hostinger:
- Ve a File Manager → public_html
- Crea una carpeta nueva: pdf-tools
Sube todo el contenido de dist a public_html/pdf-tools/

Paso 3: Crear el archivo .htaccess

Crea un archivo .htaccess en la raíz de tu carpeta de despliegue (public_html o public_html/pdf-tools/):

Importante

Para el despliegue en un subdirectorio, cambia RewriteBase / por RewriteBase /pdf-tools/ (o el nombre de tu carpeta).

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

Ejemplo de .htaccess para un subdirectorio

Para yourdomain.com/pdf-tools/, actualiza estas líneas:

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

Solución de problemas

Los archivos WASM no se cargan

Asegúrate de que los tipos MIME estén bien definidos en .htaccess:

apache

AddType application/wasm .wasm

Las herramientas de LibreOffice no funcionan

Las cabeceras de seguridad son críticas para SharedArrayBuffer:

apache

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

Si las cabeceras no se aplican, contacta con el soporte de Hostinger para que habiliten mod_headers.

Errores 404 al recargar la página

Asegúrate de que la regla de la extensión .html y las rutas de idioma estén bien configuradas. BentoPDF usa archivos HTML estáticos, no enrutamiento 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]

Límites de subida de archivos

Hostinger puede tener límites de tamaño de archivo. Sube los archivos WASM por separado si falla la subida en bloque.

Desplegar en Hostinger ​

Requisitos previos ​

Paso 1: Compilar el proyecto ​

Paso 2: Subir a Hostinger ​

Despliegue en el dominio raíz ​

Despliegue en un subdirectorio ​

Paso 3: Crear el archivo .htaccess ​

Ejemplo de .htaccess para un subdirectorio ​

Solución de problemas ​

Los archivos WASM no se cargan ​

Las herramientas de LibreOffice no funcionan ​

Errores 404 al recargar la página ​

Límites de subida de archivos ​

Desplegar en Hostinger

Requisitos previos

Paso 1: Compilar el proyecto

Paso 2: Subir a Hostinger

Despliegue en el dominio raíz

Despliegue en un subdirectorio

Paso 3: Crear el archivo .htaccess

Ejemplo de .htaccess para un subdirectorio

Solución de problemas

Los archivos WASM no se cargan

Las herramientas de LibreOffice no funcionan

Errores 404 al recargar la página

Límites de subida de archivos