From a196ba2c08bd16479134ab542f2560b75f19424f Mon Sep 17 00:00:00 2001 From: Fabian Mastenbroek Date: Wed, 15 Jul 2020 15:45:02 +0200 Subject: Make frontend independent of API This change makes the frontend independent of the API by removing the static file serving logic from the API server. Instead, we can serve the frontend as static HTML over CDNs. --- frontend/Dockerfile | 19 +++++++++++++++++++ frontend/nginx.conf | 32 ++++++++++++++++++++++++++++++++ frontend/src/api/socket.js | 8 +++----- frontend/yarn.lock | 2 +- 4 files changed, 55 insertions(+), 6 deletions(-) create mode 100644 frontend/Dockerfile create mode 100644 frontend/nginx.conf (limited to 'frontend') diff --git a/frontend/Dockerfile b/frontend/Dockerfile new file mode 100644 index 00000000..36e3c20b --- /dev/null +++ b/frontend/Dockerfile @@ -0,0 +1,19 @@ +FROM node:14 +MAINTAINER OpenDC Maintainers + +ARG REACT_APP_OAUTH_CLIENT_ID + +# Copy OpenDC directory +COPY ./ /opendc + +# Build frontend +RUN cd /opendc/ \ + && rm -rf ./build \ + && yarn \ + && export REACT_APP_OAUTH_CLIENT_ID=$REACT_APP_OAUTH_CLIENT_ID \ + && yarn build + +# Setup nginx to serve the frontend +FROM nginx:1.19 +COPY --from=0 /opendc/build /usr/share/nginx/html +COPY nginx.conf /etc/nginx/conf.d/default.conf diff --git a/frontend/nginx.conf b/frontend/nginx.conf new file mode 100644 index 00000000..ed7e5cfe --- /dev/null +++ b/frontend/nginx.conf @@ -0,0 +1,32 @@ +server { + listen 80; + server_name opendc.org; + + location / { + root /usr/share/nginx/html; + index index.html index.htm; + try_files $uri $uri/ /index.html; + } + + location /socket.io { + proxy_http_version 1.1; + + proxy_buffering off; + proxy_set_header Upgrade $http_upgrade; + proxy_set_header Connection "Upgrade"; + proxy_pass http://api:8081/socket.io; + } + + location /tokensignin { + proxy_pass http://api:8081/tokensignin; + } + + location /api { + proxy_pass http://api:8081/api; + } + + error_page 500 502 503 504 /50x.html; + location = /50x.html { + root /usr/share/nginx/html; + } +} diff --git a/frontend/src/api/socket.js b/frontend/src/api/socket.js index 93ce8fa8..759c119e 100644 --- a/frontend/src/api/socket.js +++ b/frontend/src/api/socket.js @@ -6,11 +6,9 @@ let requestIdCounter = 0 const callbacks = {} export function setupSocketConnection(onConnect) { - let port = window.location.port - if (process.env.NODE_ENV !== 'production') { - port = 8081 - } - socket = io.connect(window.location.protocol + '//' + window.location.hostname + ':' + port) + const apiUrl = process.env.REACT_APP_API_URL || window.location.hostname + ':' + window.location.port; + + socket = io.connect(window.location.protocol + '//' + apiUrl); socket.on('connect', onConnect) socket.on('response', onSocketResponse) } diff --git a/frontend/yarn.lock b/frontend/yarn.lock index 00c6e441..2859e4e0 100644 --- a/frontend/yarn.lock +++ b/frontend/yarn.lock @@ -11527,7 +11527,7 @@ uuid@^3.0.1, uuid@^3.3.2: resolved "https://registry.yarnpkg.com/uuid/-/uuid-3.4.0.tgz#b23e4358afa8a202fe7a100af1f5f883f02007ee" integrity sha512-HjSDRw6gZE5JMggctHBcjVak08+KEVhSIiDzFnT9S9aegmp85S/bReBVTb4QTFaRNptJ9kuYaNhnbNEOkbKb/A== -uuidv4@^6.1.1: +uuidv4@~6.1.1: version "6.1.1" resolved "https://registry.yarnpkg.com/uuidv4/-/uuidv4-6.1.1.tgz#6565b4f2be7d6f841c14106f420fdb701eae5c81" integrity sha512-ZplGb1SHFMVH3l7PUQl2Uwo+FpJQV6IPOoU+MjjbqrNYQolqbGwv+/sn9F+AGMsMOgGz3r9JN3ztGUi0VzMxmw== -- cgit v1.2.3 From 5d528f6b1902d372eb2ef594bc96712ad74ac361 Mon Sep 17 00:00:00 2001 From: Fabian Mastenbroek Date: Thu, 16 Jul 2020 22:04:35 +0200 Subject: Add prototype of web experiment runner This change adds a bridge between the frontend and the new simulator implementation via MongoDB. --- frontend/src/shapes/index.js | 4 +++- 1 file changed, 3 insertions(+), 1 deletion(-) (limited to 'frontend') diff --git a/frontend/src/shapes/index.js b/frontend/src/shapes/index.js index 32914f25..8296055a 100644 --- a/frontend/src/shapes/index.js +++ b/frontend/src/shapes/index.js @@ -111,7 +111,9 @@ Shapes.Scenario = PropTypes.shape({ _id: PropTypes.string.isRequired, portfolioId: PropTypes.string.isRequired, name: PropTypes.string.isRequired, - simulationState: PropTypes.string.isRequired, + simulation: PropTypes.shape({ + state: PropTypes.string.isRequired, + }).isRequired, trace: PropTypes.shape({ traceId: PropTypes.string.isRequired, trace: Shapes.Trace, -- cgit v1.2.3 From 2a5f50e591f5e9c1da5db2f2011c779a88121675 Mon Sep 17 00:00:00 2001 From: Georgios Andreadis Date: Mon, 20 Jul 2020 12:41:37 +0200 Subject: Update proxy --- frontend/package.json | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) (limited to 'frontend') diff --git a/frontend/package.json b/frontend/package.json index f5ade772..174b2f39 100644 --- a/frontend/package.json +++ b/frontend/package.json @@ -16,7 +16,7 @@ "author": "Georgios Andreadis (https://gandreadis.com/)", "license": "MIT", "private": true, - "proxy": "http://localhost:8081", + "proxy": "http://localhost:8082", "dependencies": { "approximate-number": "~2.0.0", "classnames": "~2.2.5", -- cgit v1.2.3