Sto utilizzando React e React Router nella mia applicazione web a pagina singola. Dato che sto facendo rendering lato client, mi piacerebbe servire tutti i miei file statici (HTML, CSS, JS) con un CDN. Sto usando Amazon S3 per ospitare i file e Amazon CloudFront come CDN.React Router + AWS Backend, how to SEO
Quando l'utente richiede /css/styles.css, il file esiste in modo che S3 lo serva. Quando l'utente richiede/foo/bar, questo è un URL dinamico in modo che S3 aggiunga un hashbang:/#!/Foo/bar. Questo servirà index.html. Sul mio lato client rimuovo l'hashbang, quindi i miei URL sono belli.
Questo funziona perfettamente per il 100% dei miei utenti.
- Tutti i file statici sono serviti attraverso una CDN
- un URL dinamico sarà indirizzato a/#!/{...} che serve index.html (la mia applicazione singola pagina)
- mio lato client rimuove il hashbang modo gli URL sono abbastanza nuovo
il problema
il problema è che Google non esegue la scansione il mio sito web. Ecco perché:
- Google richiede/
- vedono un sacco di link, per esempio a/foo/bar
- Google richieste/foo/bar
- Ottengono reindirizzati a/#!/foo/bar (302 Found)
- Essi rimuovere il hashbang e richiesta/
Perché l'hashbang viene rimosso? La mia app funziona perfettamente per il 100% dei miei utenti, quindi perché è necessario riprogettarlo in modo tale che Google possa eseguirne la scansione correttamente? E 'il 2016, basta seguire il hashbang ...
</rant >
sto facendo qualcosa di sbagliato? C'è un modo migliore per far sì che S3 funzioni index.html quando non riconosce il percorso?
Configurare un server di nodi per gestire questi percorsi non è la soluzione corretta poiché ciò vanifica l'intero scopo di avere un CDN.
In this thread Michael Jackson, il principale contributore di React Router, afferma "Per fortuna hashbang non è più in uso diffuso." Come cambieresti il mio set up per non usare l'hashbang?
Questo è quello che ho finito per fare, un po 'hacky ma funziona. Grazie per aver postato !!! –