Hola, he creado un proyecto en React que consume una API de nodejs y express. Todo funciona muy bien en local pero al subirla a producción sucede que la pagina abre correctamente y se puede usar sin recargarla pero al recargar la página en cualquier ruta que no sea la principal (/) Link: https://frases-app-dan.herokuapp.com , muestra este error:
Cannot GET /auth/login
Cannot GET /my-account
pueden probar entrando y recargando la página
No sé cuál sea el problema, en diferentes hostings sucede lo mismo, en local va perfecto al 100%
AppRouter.js
export const AppRouter = () => {
const { checking, uid} = useSelector(state => state.auth);
const dispatch = useDispatch();
//cada vez que se cargue el componente se ejecutará el dispatch que verificara si el token es válido o no
useEffect(() => {
dispatch( startChecking() );
}, [dispatch])
//mientras verifica el token muestra un spinner de carga
if( checking ) {
return(
<div className="flexible">
<div className="sk-chase">
<div className="sk-chase-dot"></div>
<div className="sk-chase-dot"></div>
<div className="sk-chase-dot"></div>
<div className="sk-chase-dot"></div>
<div className="sk-chase-dot"></div>
<div className="sk-chase-dot"></div>
</div>
</div>
)
}
return (
<Router>
<Switch>
<PublicRoute
isAuthenticated={!!uid}
path="/auth"
component={ AuthRouter }
/>
<PrivateRoute
isAuthenticated={!!uid}
exact
path="/"
component={ HomeScreen }
/>
<PrivateRoute
isAuthenticated={!!uid}
exact
path="/my-account"
component={ MyAccount }
/>
<Redirect to="/auth/login" />
</Switch>
<Footer />
</Router>
)
}
index.js (Node + express)
const express = require('express');
const path = require('path');
//dotenv para usar variables de entorno
require('dotenv').config();
const cors = require('cors');
const { dbConnection } = require('./database/config');
//crear servidor de express
const app = express();
//Base de datos
dbConnection();
//CORS
app.use(cors());
//Directorio Público
app.use( express.static('public') );
//lectura y paseo del body
app.use( express.json() );
//****RUTAS****
//auth // crear, login, renew
app.use( '/api/auth', require('./routes/auth') );
//phrases: crear, leer, actualizar, borrar
app.use( '/api/phrases', require('./routes/phrases') );
//Escuchar peticiones
app.listen( process.env.PORT, () => {
console.log(`Servidor coriendo en puerto ${ process.env.PORT }`)
} )
Agradecería ayuda!