0

Actualmente estoy montando una aplicación SPA, donde quiero manejar todas las rutas con AngularJS y que las rutas de Express solo sean para API, el problema que tengo es que si configuro las rutas de Angular por ejemplo:

http://localhost:3001/login

Por AngularJS (Angular 1) con una redirección le llego, pero si estoy parada en esa ruta y recargo (F5) el servidor dice que no existe esa ruta, y es claro porque no existe esa ruta en la configuración de rutas de express, ahora mi duda es ¿como configuro para que angular sea el que maneja todas las rutas? e incluso si le doy F5 en una vista pueda continuar en ella, ¿existe alguna forma de configurar express para que las ruta las maneje el frontend y el backend solo maneje las rutas para peticiones, osea que sea netamente como API REST.

Ante todo muchas gracias de ante mano.

Saludos.

2 respuestas 2

0

En una aplicación SPA, las rutas son manejadas en el cliente no en el servidor. Si haces una recarga o tipeas directamente en la barra de direcciones, lo que pasará, obviamente, es que se hará una petición GET al servidor, devolviéndote un 404.

Las rutas para la API deben ir primero, luego, rediriges toda petición entrante al index.html de tu aplicación:

API router

const router = express.Router();
router
  .get('/users', UserController.index)
  ...

export default router;

App

app.use(express.static(join(__dirname, 'public')));
app.use('/api', apiRoutes);

app.get('*', (req, res) => {
  res.type('html');
  res.sendFile(RUTA_A_index.html);
});

Ahora cuando recargues la página se te enviará como respuesta el index.html y AngularJS se encargará de renderizar la vista correcta de acuerdo a la URL.

4
  • Excelente voy a hacer la prueba, muchas gracias de verdad. Commented el 18 abr. 2017 a las 22:34
  • Otra duda es como es la divicion de las carpetas actualmente lo tengo así, pero tengo varios detalles. Commented el 18 abr. 2017 a las 22:35
  • Lo dejo como un comentario. Commented el 18 abr. 2017 a las 22:37
  • Perdón como una repuesta. Commented el 18 abr. 2017 a las 22:49
0
Proyecto
|_server.js
|_public
  |_app
    |_index.hmtl
    |_module.js
    |_funcionalidad-1
      |_ruute.js
      |_module.js
      |_funcionalidad.css
      |_funcionalidad.hmlt
    |_funcionalidad-2
    :
  |_assent
|_package.json
|_bower.json
|_gulp.js

¿Donde coloco la parte de backend de la rutas y toda la funcionalidades? Tengo tambien un problema que cuando entro al servidor en la ruta http://localhost:3001/ no se me ve nada, pero si accedo a http://localhost:3001/app/ si funciona, no entiendo muy bien porque pasa eso.

Si me pudieran ayudar en eso se los agradecería muchísimo.

Muchas gracias.

Tu Respuesta

By clicking “Publica tu respuesta”, you agree to our terms of service and acknowledge you have read our privacy policy.

¿No es la respuesta que buscas? Examina otras preguntas con la etiqueta o formula tu propia pregunta.