Come hostare una web app Strapi + Next.js su Cloudways
Come impostare il vostro file htaccess per ospitare Strapi e Next.js sulla vostra applicazione Cloudways.
Enrico Monzeglio
Per chi utilizza l'Hosting cloud gestito Cloudways può capitare di trovarsi in difficoltà e ricevere molti errori quando si sviluppa un applicativo web che sfrutta diverse porte indirizzate al localhost (che successivamente potremo tranquillamente mappare su un dominio a nostra scelta).
Ecco come si può risolvere con delle modifiche al file .htaccess nel caso per esempio di un backend Strapi headless CMS e un frontend Next.js (React Framework).
DirectoryIndex disabled
RewriteEngine On
# Se la richiesta inizia con "/admin/", "/api/" o "/uploads/" etc..., reindirizza a http://127.0.0.1:1337/
RewriteCond %{REQUEST_URI} ^/(admin|api|uploads|upload|i18n|content-manager|seo|sitemap|content-type-builder|_health|users-permissions)/
RewriteRule ^(.*)$ http://127.0.0.1:1337/$1 [P,L]
# Se la richiesta è una POST su "/upload", reindirizza a http://127.0.0.1:1337/upload
RewriteCond %{REQUEST_METHOD} =POST
RewriteCond %{REQUEST_URI} ^/upload
RewriteRule ^(.*)$ http://127.0.0.1:1337/$1 [P,L]
# Se la richiesta è una GET su "/sitemap", reindirizza a http://127.0.0.1:1337/sitemap
RewriteCond %{REQUEST_METHOD} =GET
RewriteCond %{REQUEST_URI} ^/sitemap
RewriteRule ^(.*)$ http://127.0.0.1:1337/$1 [P,L]
# Se la richiesta è una HEAD su "/_health", reindirizza a http://127.0.0.1:1337/_health
RewriteCond %{REQUEST_METHOD} =HEAD
RewriteCond %{REQUEST_URI} ^/_health
RewriteRule ^(.*)$ http://127.0.0.1:1337/$1 [P,L]
# Altrimenti se non inizia con "/admin/", "/api/" o "/uploads/" etc... reindirizza a http://127.0.0.1:3000/
RewriteCond %{REQUEST_URI} !^/(admin|api|uploads|upload|i18n|content-manager|seo|sitemap|content-type-builder|_health|users-permissions)/
RewriteRule ^(.*)$ http://127.0.0.1:3000/$1 [P,L]Una spiegazione più dettagliata:
DirectoryIndex disabled: Questa riga disabilita la gestione predefinita di Apache dei file di indice per le directory. RewriteEngine On: Abilita il motore di riscrittura delle URL di Apache.
Le righe successive utilizzano il modulo mod_rewrite di Apache per reindirizzare le richieste in base ad alcuni criteri:
RewriteCond %{REQUEST_URI} ^/(admin|api|uploads|upload|i18n|content-manager|seo|sitemap|content-type-builder|_health|users-permissions)/: Questa condizione corrisponde alle richieste che iniziano con uno dei percorsi specificati tra parentesi.
RewriteRule ^(.*)$ http://127.0.0.1:1337/$1 [P,L]: Questa regola reindirizza le richieste che soddisfano la condizione precedente a http://127.0.0.1:1337/, che è il server locale in cui viene eseguita l'applicazione Strapi.
Le successive righe con RewriteCond e RewriteRule seguono un modello simile, ma reindirizzano richieste con metodi HTTP specifici (GET, POST, HEAD) e percorsi specifici a diverse porte del server locale (http://127.0.0.1:1337/ o http://127.0.0.1:3000/).
L'ultima riga di reindirizzamento è una regola generale che reindirizza tutte le altre richieste non corrispondenti ai percorsi specificati precedentemente a http://127.0.0.1:3000/, la porta del server locale dove viene eseguito il framework Next.js.
Hai ulteriori domande o chieste sull'approccio Headless CMS? Non esitare a contattare la nostra Web Agency a Milano per sviluppare la tua web app!