如何在docker容器中使用nginx提供静态文件？

Question

我正在使用boot2docker,因为我正在运行Mac OSX.我无法弄清楚如何使用在docker容器中运行的nginx来提供静态文件(它还包含静态资产,如我的html和js).

我有四个docker容器用这个docker-compose.yml旋转:

web:
   build: ./public
   links: 
     - nodeapi1:nodeapi1
   ports:
     - "80:80"

nodeapi1:
   build: ./api
   links:
     - redis
     - db
   ports:
     - "5000:5000"
   volumes:
     - ./api:/data

redis:
   image: redis:latest
   ports:
     - "6379:6379"

db:
   image: postgres:latest
   environment:
     POSTGRES_USER: root
   ports:
     - "5432:5432"

这是我的nginx.conf:

worker_processes auto;

daemon off;

events {
  worker_connections 1024;
}

http {
  server_tokens off;
  upstream node-app {
    ip_hash;
    server 192.168.59.103:5000;
  }
  server {
    listen 80;
    index index.html;
    root /var/www;

    location ~* \.(js|css|png|jpg|jpeg|gif|ico)$ {
      expires 1d;
    }

    location / {
      proxy_set_header Upgrade $http_upgrade;
      proxy_set_header Connection "upgrade";
      proxy_set_header Host $host;
      proxy_set_header X-Real-IP $remote_addr;
      proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
      proxy_set_header X-NginX-Proxy true;

      proxy_http_version 1.1;
      proxy_pass http://node-app;
      proxy_cache_bypass $http_upgrade;
    }

  }
}

我Dockerfile我的网页版本(其中包含我的nginx.conf和静态资产):

# Pull nginx base image
FROM nginx:latest

# Expost port 80
EXPOSE 80

# Copy custom configuration file from the current directory
COPY nginx.conf /etc/nginx/nginx.conf

# Copy static assets into var/www
COPY ./dist /var/www
COPY ./node_modules /var/www/node_modules

# Start up nginx server
CMD ["nginx"]

./dist文件夹的内容是bundle.js文件和index.html文件.文件布局是:

public
  -- Dockerfile
  -- nginx.conf
  -- dist (directory)
    -- bundle.js
    -- index.html
  -- node_modules
    ...various node modules

它正确地将请求发送到我的节点服务器(这也是一个docker容器,这就是我的上游服务器指向boot2docker ip的原因),但我只是试图检索我的静态资产404.

我迷失了下一步.如果我能提供任何信息,请告诉我.

Answer 1

您的问题与docker无关,但与您的nginx配置无关.

在您的nginx配置文件中,您定义/var/www/为文档根目录(我猜是为您的静态文件提供服务).但是在下面你指示nginx作为所有请求的节点应用程序的反向代理.

因此,如果您调用/index.htmlURL,nginx甚至不会检查内容,/var/www并将该查询转发给nodejs.

通常,您希望使用URL约定来区分静态内容请求和动态内容请求.例如,所有以请求开头的请求/static/都将由nginx提供,而其他任何请求都将转发到节点.然后nginx配置文件将是:

worker_processes auto;

daemon off;

events {
  worker_connections 1024;
}

http {
  server_tokens off;
  upstream node-app {
    ip_hash;
    server 192.168.59.103:5000;
  }
  server {
    listen 80;

    location ~* \.(js|css|png|jpg|jpeg|gif|ico)$ {
      expires 1d;
    }

    location /static/ {
      alias /var/www/;
      index index.html;
    }

    location / {
      proxy_set_header Upgrade $http_upgrade;
      proxy_set_header Connection "upgrade";
      proxy_set_header Host $host;
      proxy_set_header X-Real-IP $remote_addr;
      proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
      proxy_set_header X-NginX-Proxy true;

      proxy_http_version 1.1;
      proxy_pass http://node-app;
      proxy_cache_bypass $http_upgrade;
    }

  }
}