¿Cómo usar ProxyPass para servir archivos estáticos a través de Express?

Estoy usando Apache con mod_proxy para servir a mi aplicación Node con Express,

 ProxyPass /nodeapp http://localhost:3000/ ProxyPassReverse /nodeapp http://localhost:3000/ 

pero los JS y CSS estáticos se solicitan desde el lugar equivocado.

Por ejemplo, quiero que el CSS de

 http://homepage/nodeapp/css 

Pero se está solicitando a

 http://homepage/css 

Resolví este problema en mi entorno utilizando la etiqueta HTML “Base” en el index.html de mi aplicación, y luego me aseguré de que todos los enlaces dentro de mi aplicación fueran relativos. Esto ayudará a asegurar que el navegador solicite la ruta apropiada.

Vale la pena señalar que, dado que mi aplicación es un SPA (aplicación de una sola página), todos los activos funcionan todo el tiempo, ya que la navegación real está siempre en la raíz.

En su caso, la etiqueta (dentro del elemento ) podría tener el siguiente aspecto:

  

Mi correspondiente configuración de Apache es simplista:

  ProxyPass http://127.0.0.1:9000 ProxyPassReverse http://127.0.0.1:9000 # other Apache directives here  

Resulta que mi aplicación utiliza AngularJS, y puedo acceder a la “raíz” de la aplicación utilizando el carácter #. Por ejemplo, si quisiera ir a /settings (que sería /nodeapp/settings en producción) especificaría #settings como href para cualquier enlace dado. Su millaje puede variar, y ciertamente vale la pena ver https://docs.angularjs.org/guide/ $ location si está usando AngularJS y html5Mode configuración html5Mode para ver qué funciona mejor para su implementación.

No tuve que enseñar a Express sobre su punto de assembly, ya que el navegador está solicitando los recursos apropiados utilizando la etiqueta ProxyPass/ProxyPassReverse arriba, y las ProxyPass/ProxyPassReverse Apache ProxyPass/ProxyPassReverse adecuadamente antes de entregarlo a Express.

Aunque no tuve que tocar el enrutador de Express (según lo descrito anteriormente), aún puede ser útil comprender lo siguiente. Si está utilizando Express 4.x, “montar” una aplicación Express es supuestamente más fácil que en versiones anteriores de Express. Hay algunos buenos ejemplos aquí: https://github.com/visionmedia/express/wiki/New-features-in-4.x

Desde esa página:

Imagina un ejemplo de rutas / people.js en tu proyecto.

 var people = express.Router(); people.use(function(req, res, next) { }); people.get('/', function(req, res, next) { }); module.exports.people = people; 

Puede montarlo en la ruta / personas para que cualquier solicitud a / personas / * se enrute al enrutador de personas.

 app.use('/people', require('./routes/people').people); 

Esa página también lo dirige a la API del enrutador Express 4.x: http://expressjs.com/4x/api.html#router

Sin embargo, esta técnica generalmente no debería ser necesaria si está utilizando ProxyPass de Apache para volver a escribir las solicitudes de entrada.

Si su aplicación no es un SPA, puede encontrar suerte al reescribir el contenido sobre la marcha usando mod_proxy_html . Tuve un éxito limitado con esto, pero a AngularJS no le gustó mucho. Sin embargo, creo que podría ser una buena opción para diferentes aplicaciones.

Si elige utilizar mod_proxy_html , puede consultar la pregunta y respuesta de StackOverflow aquí para obtener más información: ProxyHTML para volver a escribir la URL