在ec2上托管的django nuxt应用的Nginix配置

时间:2020-02-25 09:02:44

标签: django docker nginx amazon-ec2

我有一个dockerized应用程序,可以在主机上的开发模式下正常工作。我试图弄清楚如何使用启动实例时创建的默认IP地址将应用托管在ec2上。

我的文件夹结构如下。

backend
|---projectname
|---Dockerfile
|---requirements.txt 
|---wait-for-it.sh

config/nginx
|---app.conf

frontend
|---nuxt folders 
|---Dockerfile

这是我当前正在使用的docker compose文件

docker-compose.yml

version: '3.4'

services:
db:
    restart: always
    image: postgres
    volumes:
    - pgdata:/var/lib/postgresql/data  
    env_file: .env

    ports:
    - "5432:5432"
    expose:
    - 5432  

redis:
    restart: always
    image: redis
    volumes:
    - redisdata:/data


django:
    build:
    context: ./backend
    env_file: .env

    command: >
    sh -c  "./wait-for-it.sh db:5432 && 
            cd autobets && python manage.py collectstatic --noinput &&
            gunicorn --workers=2 --bind=0.0.0.0:8000 autobets.wsgi:application" 
    ports:
    - "8000:8000"
    volumes:
    - ./backend:/app
    depends_on:
    - db
    restart: on-failure


nuxt:
    build:
    context: ./frontend
    environment:
    - API_URI=http://django:8000/api

    command: bash -c "npm install && npm run dev"
    volumes:
    - ./frontend:/app
    ports:
    - "3000:3000"
    depends_on:
    - django
    - redis

volumes:
  pgdata:
  redisdata:

config / nginx / app.config

upstream django {
ip_hash;
server django:8000;
}

upstream nuxt {
ip_hash;
server nuxt:3000;
}

server {
location ~ /(api|admin|static)/ {
    proxy_pass http://django;
    proxy_set_header Host $http_host;
    proxy_set_header X-Forwarded-Host $host;
}
location / {
    proxy_pass http://nuxt;
    proxy_set_header Host $http_host;
    proxy_set_header X-Forwarded-Host $host;
}
listen 8000;
server_name localhost;
}

说我的ec2域名指针是否为 ec2-52-204-122-132.compute-1.amazonaws.com 如何在我的应用程序中设置nginx以接受与应用程序前端的http连接?

在后端localhost:8000 / admin上是我的管理页面,我也想使用ec2域名来访问它。

更改配置的最佳方法是什么,以便在添加域名指针后推送我的应用程序时,我可以访问ec2上托管的应用程序?

我一直在阅读文档,但是找不到在ec2上运行的dockerized django vue类型应用程序的任何有用信息。

1 个答案:

答案 0 :(得分:1)

首先,您需要确保连接到框的安全组已打开,以便NGinx侦听的端口上的传入连接

对于要放入NGinx配置的每个容器,您需要找到它们的用法:

docker inspect -f '{{range .NetworkSettings.Networks}}{{.IPAddress}}{{end}}' container_name_or_id

NGinx不在容器内,docker编写为nginx.conf

upstream django {
    ip_hash;
    server <container IP>:8000;     # <-- Change this, with container IP
}

upstream nuxt {
    ip_hash;
    server <container IP>:3000;     # <-- Change this, with container IP
}

server {
    location ~ /(api|admin|static)/ {
        proxy_pass @django               # <-- Change this, with container IP
        proxy_pass <container IP>:8000;  # <-- OR Change this, with container IP
        proxy_set_header Host $http_host;
        proxy_set_header X-Forwarded-Host $host;
    }

    location / {
        proxy_pass @nuxt                # <-- Change this, add port
        proxy_pass <container IP>:3000  # <-- OR Change this, add port
        proxy_set_header Host $http_host;
        proxy_set_header X-Forwarded-Host $host;
    }

    listen 8000;    # <-- Change port number, django already use this host port
    server_name localhost ec2-52-204-122-132.compute-1.amazonaws.com;   # <-- change this line, add EC2 public domain
}

docker-compose.yml

version: '3.4'

services:
    db:
        restart: always
        image: postgres
        volumes:
            - pgdata:/var/lib/postgresql/data
        env_file: .env

        ports:
            - "5432:5432"
        expose:
            - 5432
        networks:           # <-- Add this
            - random_name   # <-- Add this

    redis:
        restart: always
        image: redis
        volumes:
            - redisdata:/data
        networks:           # <-- Add this
            - random_name   # <-- Add this

    django:
        build:
        context: ./backend
        env_file: .env

        command: >
            sh -c  "./wait-for-it.sh db:5432 &&
                    cd autobets && python manage.py collectstatic --noinput &&
                    gunicorn --workers=2 --bind=0.0.0.0:8000 autobets.wsgi:application"
        ports:
            - "8000:8000"
        volumes:
            - ./backend:/app
        depends_on:
            - db
        restart: on-failure
        networks:           # <-- Add this
            - random_name   # <-- Add this


    nuxt:
        build:
        context: ./frontend
        environment:
            - API_URI=http://django:8000/api # <-- Wrong
            # From you Javascript on the client point of view,
            # you will request the public server, not the internal name of
            # you backend inside a container, that the public will never see
            - API_URI=http://ec2-52-204-122-132.compute-1.amazonaws.com/api # <-- Right
        command: bash -c "npm install && npm run dev"
        volumes:
            - ./frontend:/app
        ports:
            - "3000:3000"
        depends_on:
            - django    # <-- will become useless if change API_URI=
            - redis     # <-- bad design
        networks:           # <-- Add this
            - random_name   # <-- Add this

volumes:
  pgdata:
  redisdata:
networks:           # <-- Add this
  - random_name:    # <-- Add this wanto make sure container can communicate

AWS上的安全组应在用于侦听NGinx的端口上打开,django已使用主机8000,因此请在另一个端口上使用

从应用程序体系结构POV中,您的后端应使用Redis而不是前端来进行缓存。复杂性或后端响应缓存应缓存在控制器上某处的后端上。您的客户应仅缓存状态资产。但是您在这里是为了使您能够在服务器上工作,而不是说archi。