Using apache as foward (not serving files)

apache/Dockerfile

@@ -1,2 +1,2 @@
 FROM httpd:2.4
-COPY ./my-httpd.conf /usr/local/apache2/conf/httpd.conf
+COPY ./httpd-citizen.conf /usr/local/apache2/conf/httpd.conf

apache/httpd-citizen.conf

@@ -2,20 +2,20 @@
 # This is the main Apache HTTP server configuration file.  It contains the
 # configuration directives that give the server its instructions.
 # See <URL:http://httpd.apache.org/docs/2.4/> for detailed information.
-# In particular, see 
+# In particular, see
 # <URL:http://httpd.apache.org/docs/2.4/mod/directives.html>
 # for a discussion of each configuration directive.
 #
 # Do NOT simply read the instructions in here without understanding
 # what they do.  They're here only as hints or reminders.  If you are unsure
-# consult the online docs. You have been warned.  
+# consult the online docs. You have been warned.
 #
 # Configuration and logfile names: If the filenames you specify for many
 # of the server's control files begin with "/" (or "drive:/" for Win32), the
 # server will use that explicit path.  If the filenames do *not* begin
 # with "/", the value of ServerRoot is prepended -- so "logs/access_log"
 # with ServerRoot set to "/usr/local/apache2" will be interpreted by the
-# server as "/usr/local/apache2/logs/access_log", whereas "/logs/access_log" 
+# server as "/usr/local/apache2/logs/access_log", whereas "/logs/access_log"
 # will be interpreted as '/logs/access_log'.
 
 #
@@ -45,7 +45,7 @@ ServerRoot "/usr/local/apache2"
 # ports, instead of the default. See also the <VirtualHost>
 # directive.
 #
-# Change this to Listen on specific IP addresses as shown below to 
+# Change this to Listen on specific IP addresses as shown below to
 # prevent Apache from glomming onto all bound IP addresses.
 #
 #Listen 12.34.56.78:80
@@ -140,11 +140,9 @@ LoadModule setenvif_module modules/mod_setenvif.so
 LoadModule version_module modules/mod_version.so
 #LoadModule remoteip_module modules/mod_remoteip.so
 LoadModule proxy_module modules/mod_proxy.so
-#MOD MARC
 #LoadModule proxy_connect_module modules/mod_proxy_connect.so
 #LoadModule proxy_ftp_module modules/mod_proxy_ftp.so
 LoadModule proxy_http_module modules/mod_proxy_http.so
-#MOD MARC
 #LoadModule proxy_fcgi_module modules/mod_proxy_fcgi.so
 #LoadModule proxy_scgi_module modules/mod_proxy_scgi.so
 #LoadModule proxy_uwsgi_module modules/mod_proxy_uwsgi.so
@@ -203,7 +201,7 @@ LoadModule alias_module modules/mod_alias.so
 <IfModule unixd_module>
 #
 # If you wish httpd to run as a different user or group, you must run
-# httpd as root initially and it will switch.  
+# httpd as root initially and it will switch.
 #
 # User/Group: The name (or #number) of the user/group to run httpd as.
 # It is usually good practice to create a dedicated user and group for
@@ -244,7 +242,7 @@ ServerAdmin you@example.com
 
 #
 # Deny access to the entirety of your server's filesystem. You must
-# explicitly permit access to web content directories in other 
+# explicitly permit access to web content directories in other
 # <Directory> blocks below.
 #
 <Directory />
@@ -264,9 +262,8 @@ ServerAdmin you@example.com
 # documents. By default, all requests are taken from this directory, but
 # symbolic links and aliases may be used to point to other locations.
 #
-DocumentRoot "/home/appuser/citizen/frontend/dist/browser"
-# mod marc
-<Directory "/home/appuser/citizen/frontend/dist/browser">
+DocumentRoot "/usr/local/apache2/htdocs"
+<Directory "/usr/local/apache2/htdocs">
     #
     # Possible values for the Options directive are "None", "All",
     # or any combination of:
@@ -303,8 +300,8 @@ DocumentRoot "/home/appuser/citizen/frontend/dist/browser"
 </IfModule>
 
 #
-# The following lines prevent .htaccess and .htpasswd files from being 
-# viewed by Web clients. 
+# The following lines prevent .htaccess and .htpasswd files from being
+# viewed by Web clients.
 #
 <Files ".ht*">
     Require all denied
@@ -357,8 +354,8 @@ LogLevel warn
 
 <IfModule alias_module>
     #
-    # Redirect: Allows you to tell clients about documents that used to 
-    # exist in your server's namespace, but do not anymore. The client 
+    # Redirect: Allows you to tell clients about documents that used to
+    # exist in your server's namespace, but do not anymore. The client
     # will make a new request for the document at its new location.
     # Example:
     # Redirect permanent /foo http://www.example.com/bar
@@ -375,7 +372,7 @@ LogLevel warn
     # the filesystem path.
 
     #
-    # ScriptAlias: This controls which directories contain server scripts. 
+    # ScriptAlias: This controls which directories contain server scripts.
     # ScriptAliases are essentially the same as Aliases, except that
     # documents in the target directory are treated as applications and
     # run by the server when requested rather than as documents sent to the
@@ -487,10 +484,10 @@ LogLevel warn
 #MaxRanges unlimited
 
 #
-# EnableMMAP and EnableSendfile: On systems that support it, 
+# EnableMMAP and EnableSendfile: On systems that support it,
 # memory-mapping or the sendfile syscall may be used to deliver
 # files.  This usually improves server performance, but must
-# be turned off when serving from networked-mounted 
+# be turned off when serving from networked-mounted
 # filesystems or if support for these functions is otherwise
 # broken on your system.
 # Defaults: EnableMMAP On, EnableSendfile Off
@@ -500,9 +497,9 @@ LogLevel warn
 
 # Supplemental configuration
 #
-# The configuration files in the conf/extra/ directory can be 
-# included to add extra features or to modify the default configuration of 
-# the server, or you may simply copy their contents here and change as 
+# The configuration files in the conf/extra/ directory can be
+# included to add extra features or to modify the default configuration of
+# the server, or you may simply copy their contents here and change as
 # necessary.
 
 # Server-pool management (MPM specific)
@@ -552,38 +549,20 @@ SSLRandomSeed startup builtin
 SSLRandomSeed connect builtin
 </IfModule>
 
-
-#MOD MARC ->
-
+# SELON install_app.sh
 <VirtualHost *:80>
-    # La suite de la configuration ne concerne plus les fichiers statiques
-    # mais passe simplement les requêtes à un des 3 services
+	<Location />
+        ProxyPass  http://citizen-front:4000/ retry=0
+        ProxyPassReverse  http://citizen-front:4000/
+   	</Location>
 
-    # Chemin de GeoNature-citizen (frontend)
-    #<Location />
-    #  ProxyPass http://citizen-front:4000/ retry=0
-    #  ProxyPassReverse  http://citizen-front:4000/
-    #</Location>
-
-
-    # Chemin de GeoNature-citizen (API)
-    <Location /citizen/api>
-      ProxyPass http://citizen-back:5002/api retry=0
-      ProxyPassReverse  http://citizen-back:5002/api
+	# API Url
+	<Location /api>
+        ProxyPass  http://citizen-back:5002/api retry=0
+        ProxyPassReverse  http://citizen-back:5002/api
     </Location>
 
-
-    # La suite de la configuration ne concerne plus les fichiers statiques
-    # mais passe simplement les requêtes à un des 3 services
-
-
-    # Chemin de l'interface web de taxhub
-    # Chemin de taxhub
-    <Location /taxhub>
-    ProxyPass  http://taxhub:5000/ retry=0
-    ProxyPassReverse  http://taxhub:5000/
-    </Location>
-</VirtualHost>
-
-
-#END MOD MARC
+	# Error logs
+	ErrorLog /var/log/apache2-citizen-error.log
+	CustomLog /var/log/apachecitizen.log combined
+</VirtualHost>

docker-compose.override.yml

@@ -28,11 +28,17 @@ services:
       - ./patches/settings.ini:/home/appuser/citizen/config/settings.ini
       - ./patches/frontend/src/conf:/home/appuser/citizen/frontend/src/conf
       - ./patches/frontend/src/assets:/home/appuser/citizen/frontend/src/assets
-      - ./dist/browser:/home/appuser/citizen/frontend/dist/browser
+      - ./patches/frontend/server.ts:/home/appuser/citizen/frontend/server.ts
+      - ./dist:/home/appuser/citizen/frontend/dist
+      # re files installed by npm install
+      - ./node_modules:/home/appuser/citizen/frontend/node_modules
     ports:
       - "4000:4000"
       - "4200:4200"
     command: npm run serve:ssr
+    environment:
+      # avoid goodle analytics question
+      - "NG_CLI_ANALYTICS=false"
   citizen-back:
     build:
       dockerfile: ./Dockerfile-back
@@ -67,9 +73,7 @@ services:
   apache:
     build:
       context: ./apache
+      dockerfile: ./Dockerfile
     image: registry.gitlab.com/champs-libres/geonature-citizen/apache
     ports:
       - "8080:80"
-    volumes:
-      - ./dist/browser:/home/appuser/citizen/frontend/dist/browser
-      - ./apache/my-httpd.conf /usr/local/apache2/conf/httpd.conf

docker-compose.yml

@@ -3,4 +3,4 @@ services:
   citizen:
     build: .
     ports:
-      - "8080:80"
+      - "8888:80"

patches/frontend/server.ts

@@ -0,0 +1,101 @@
+import 'zone.js/dist/zone-node';
+import { enableProdMode } from '@angular/core';
+// Express Engine
+import { ngExpressEngine } from '@nguniversal/express-engine';
+// Import module map for lazy loading
+import { provideModuleMap } from '@nguniversal/module-map-ngfactory-loader';
+
+import * as express from 'express';
+import { join } from 'path';
+import { readFileSync } from 'fs';
+
+// Faster server renders w/ Prod mode (dev mode never needed)
+enableProdMode();
+
+// Express server
+const app = express();
+
+const PORT = process.env.PORT || 4000;
+const DIST_FOLDER = join(process.cwd(), 'dist/browser');
+
+const supportedLocales = ['en', 'fr'];
+const DEFAULT_LOCALE = 'fr';
+const MockBrowser = require('mock-browser').mocks.MockBrowser;
+const mock = new MockBrowser();
+const domino = require('domino');
+const template = readFileSync(
+    join(DIST_FOLDER, DEFAULT_LOCALE, 'index.html')
+).toString();
+const win = domino.createWindow(template);
+win.Object = Object;
+win.Math = Math;
+win.screen = { deviceXDPI: 1 };
+global['window'] = win;
+global['document'] = win.document;
+global['navigator'] = mock.getNavigator();
+global['branch'] = null;
+global['object'] = win.object;
+global['HTMLElement'] = win.HTMLElement;
+global['HTMLAnchorElement'] = win.HTMLAnchorElement;
+global['DOMTokenList'] = win.DOMTokenList;
+global['Node'] = win.Node;
+global['Text'] = win.Text;
+global['localStorage'] = win.localStorage = mock.getLocalStorage();
+global['L'] = require('leaflet');
+
+// * NOTE :: leave this as require() since this file is built Dynamically from webpack
+const {
+    AppServerModuleNgFactory,
+    LAZY_MODULE_MAP,
+} = require('./dist/server/main');
+
+// Our Universal express-engine (found @ https://github.com/angular/universal/tree/master/modules/express-engine)
+app.engine(
+    'html',
+    ngExpressEngine({
+        bootstrap: AppServerModuleNgFactory,
+        providers: [provideModuleMap(LAZY_MODULE_MAP)],
+    })
+);
+
+app.set('view engine', 'html');
+app.set('views', DIST_FOLDER);
+
+// Example Express Rest API endpoints
+// app.get('/api/**', (req, res) => { });
+// Serve static files from /browser
+app.get(
+    '*.*',
+    express.static(DIST_FOLDER, {
+        maxAge: '1y',
+    })
+);
+
+// All regular routes use the Universal engine
+app.get('*', (req, res) => {
+    const matches = req.url.match(/^\/([a-z]{2}(?:-[A-Z]{2})?)\//);
+    // check if the requested url has a correct format '/locale' and matches any of the supportedLocales
+    const locale =
+        matches && supportedLocales.indexOf(matches[1]) !== -1
+            ? matches[1]
+            : DEFAULT_LOCALE;
+
+    let ip = req.headers['x-forwarded-for'] || req.connection.remoteAddress;
+    if (ip.substr(0, 7) === '::ffff:') {
+        ip = ip.substr(7);
+    }
+    // res.render("index", { req });
+    res.render(`${locale}/index`, {
+        req: req,
+        url: req.url.replace(`/${locale}/`, '/'),
+        providers: [
+            { provide: 'language', useFactory: () => locale, deps: [] },
+            { provide: 'ip', useFactory: () => ip, deps: [] },
+        ],
+    });
+});
+
+// Start up the Node server
+app.listen(PORT, '0.0.0.0', () => {
+    console.log(`BLOP Node Express server listening on http://localhost:${PORT}`);
+});

patches/frontend/src/conf/app.config.ts

@@ -1,6 +1,6 @@
 export const AppConfig = {
     appName: "GeoNature-citizen",
-    API_ENDPOINT:"http://localhost:8080/citizen/api",
+    API_ENDPOINT:"http://localhost:8080/api",
     API_TAXHUB:"http://localhost:8080/taxhub/api/",
     FRONTEND:{
         PROD_MOD:true,

patches/settings.ini

@@ -7,7 +7,7 @@ my_local=fr_FR.UTF-8
 my_url=http://localhost:8080/
 
 url_application=http://localhost:8080/        # Url For the frontend
-api_endpoint=http://localhost:8080/citizen/api        # Url for the geonature api don't forget /api
+api_endpoint=http://localhost:8080/api        # Url for the geonature api don't forget /api
 api_port=5002
 api_taxhub=http://localhost:8080/taxhub/api/             # Url for the taxhub api