Compare commits
4 Commits
17f624e7e6
...
43a2dfefc7
Author | SHA1 | Date |
---|---|---|
Jason Zhu | 43a2dfefc7 | |
Jason Zhu | 72a0a57842 | |
Jason Zhu | 155195ddda | |
Jason Zhu | 1d3263c598 |
|
@ -0,0 +1,17 @@
|
||||||
|
# e.g. 3: Create an Ningx Reverse Proxy With Docker
|
||||||
|
|
||||||
|
[How To Run Multiple Docker Containers Under One URL](https://codingwithmanny.medium.com/create-an-nginx-reverse-proxy-with-docker-a1c0aa9078f1)
|
||||||
|
|
||||||
|
## Backend only
|
||||||
|
|
||||||
|
How to test it:
|
||||||
|
1. Comment all other containers
|
||||||
|
2. Run `docker compose build` & `docker compose up`
|
||||||
|
3. Test by `curl localhost:5000`, should return `{"version":"1.0.0"}`
|
||||||
|
|
||||||
|
## Frontend only
|
||||||
|
|
||||||
|
How to test it:
|
||||||
|
1. Comment all other containers
|
||||||
|
2. Run `docker compose build` & `docker compose up`
|
||||||
|
3. Test by `curl localhost`, should return a html file (as `/eg3/frontend/index.html`)
|
|
@ -0,0 +1,5 @@
|
||||||
|
FROM node:10.15.3-alpine
|
||||||
|
WORKDIR /home/node/
|
||||||
|
RUN npm install express --save
|
||||||
|
COPY index.js .
|
||||||
|
CMD [ "node", "index.js"]
|
|
@ -0,0 +1,7 @@
|
||||||
|
const express = require('express');
|
||||||
|
const app = express();
|
||||||
|
const port = 5000;
|
||||||
|
const version = '1.0.0';
|
||||||
|
|
||||||
|
app.get('/', (req, res) => res.send({ version }));
|
||||||
|
app.listen(port, () => console.log(`Listening on port ${port}`));
|
|
@ -0,0 +1,29 @@
|
||||||
|
version: '3.8'
|
||||||
|
|
||||||
|
services:
|
||||||
|
# proxy:
|
||||||
|
# container_name: proxy
|
||||||
|
# build:
|
||||||
|
# context: ./proxy
|
||||||
|
# dockerfile: Dockerfile
|
||||||
|
# ports:
|
||||||
|
# - "80:80"
|
||||||
|
# depends_on:
|
||||||
|
# - frontend
|
||||||
|
# - backend
|
||||||
|
|
||||||
|
frontend:
|
||||||
|
container_name: frontend
|
||||||
|
build:
|
||||||
|
context: ./frontend
|
||||||
|
dockerfile: Dockerfile
|
||||||
|
ports:
|
||||||
|
- "80:80" # Uncomment this line if you want to run the frontend container only
|
||||||
|
|
||||||
|
# backend:
|
||||||
|
# container_name: backend
|
||||||
|
# build:
|
||||||
|
# context: ./backend
|
||||||
|
# dockerfile: Dockerfile
|
||||||
|
# ports:
|
||||||
|
# - "5000:5000" # Uncomment this line if you want to run the backend container only
|
|
@ -0,0 +1,3 @@
|
||||||
|
FROM nginx:stable-alpine
|
||||||
|
WORKDIR /usr/share/nginx/html
|
||||||
|
COPY index.html .
|
|
@ -0,0 +1,27 @@
|
||||||
|
<!DOCTYPE html>
|
||||||
|
<html>
|
||||||
|
<head>
|
||||||
|
<title>Frontend</title>
|
||||||
|
<script>
|
||||||
|
window.onload = function () {
|
||||||
|
fetch('/api', { method: 'get'}).then((response) => {
|
||||||
|
const json = response.json();
|
||||||
|
if (response.ok) {
|
||||||
|
return json;
|
||||||
|
}
|
||||||
|
return Promise.reject(new Error('Something went wrong.'));
|
||||||
|
})
|
||||||
|
.then((response) => {
|
||||||
|
document.getElementById('version').innerHTML = JSON.stringify(response);
|
||||||
|
}).catch((error) => {
|
||||||
|
document.getElementById('error').innerHTML = error && error.message || 'Something else went wrong.';
|
||||||
|
});
|
||||||
|
};
|
||||||
|
</script>
|
||||||
|
</head>
|
||||||
|
<body>
|
||||||
|
<h1>My Application Version</h1>
|
||||||
|
<p id="version"></p>
|
||||||
|
<p id="error"></p>
|
||||||
|
</body>
|
||||||
|
</html>
|
|
@ -0,0 +1,9 @@
|
||||||
|
FROM nginx:stable-alpine
|
||||||
|
COPY default.conf /etc/nginx/conf.d
|
||||||
|
|
||||||
|
EXPOSE 80/tcp
|
||||||
|
EXPOSE 443/tcp
|
||||||
|
|
||||||
|
CMD [ "/bin/sh", "-c", "exec nginx -g 'daemon off;';"]
|
||||||
|
|
||||||
|
WORKDIR /usr/share/nginx/html
|
|
@ -0,0 +1,46 @@
|
||||||
|
server {
|
||||||
|
listen 80;
|
||||||
|
server_name localhost;
|
||||||
|
|
||||||
|
location / {
|
||||||
|
root /usr/share/nginx/html;
|
||||||
|
index index.html index.htm;
|
||||||
|
proxy_pass http://frontend;
|
||||||
|
}
|
||||||
|
|
||||||
|
location /api {
|
||||||
|
proxy_pass http://backend:5000/;
|
||||||
|
}
|
||||||
|
|
||||||
|
#error_page 404 /404.html;
|
||||||
|
|
||||||
|
# redirect server error pages to the static page /50x.html
|
||||||
|
#
|
||||||
|
error_page 500 502 503 504 /50x.html;
|
||||||
|
location = /50x.html {
|
||||||
|
root /usr/share/nginx/html;
|
||||||
|
}
|
||||||
|
|
||||||
|
# proxy the PHP scripts to Apache listening on 127.0.0.1:80
|
||||||
|
#
|
||||||
|
#location ~ \.php$ {
|
||||||
|
# proxy_pass http://127.0.0.1;
|
||||||
|
#}
|
||||||
|
|
||||||
|
# pass the PHP scripts to FastCGI server listening on 127.0.0.1:9000
|
||||||
|
#
|
||||||
|
#location ~ \.php$ {
|
||||||
|
# root html;
|
||||||
|
# fastcgi_pass 127.0.0.1:9000;
|
||||||
|
# fastcgi_index index.php;
|
||||||
|
# fastcgi_param SCRIPT_FILENAME /scripts$fastcgi_script_name;
|
||||||
|
# include fastcgi_params;
|
||||||
|
#}
|
||||||
|
|
||||||
|
# deny access to .htaccess files, if Apache's document root
|
||||||
|
# concurs with nginx's one
|
||||||
|
#
|
||||||
|
#location ~ /\.ht {
|
||||||
|
# deny all;
|
||||||
|
#}
|
||||||
|
}
|
Loading…
Reference in New Issue