2017-11-11 285 views
1

我正在嘗試使用jwilder/nginx-proxy作爲我的angular2應用程序的反向代理,該應用程序被分解爲3個容器(角度,快速和數據庫)。Docker-compose和nginx代理

我已經嘗試了不同的配置,以代理請求,以我的應用程序上的端口80,但是當我嘗試運行搬運工,撰寫我得到:

ERROR: for angular Cannot start service angular: driver failed programming 
external connectivity on endpoint example_angular_1 
(335ce6d0c775b7837eb436fff97bbb56bfdcaece22d51049e1eb4bf5ce45553c): Bind for 
0.0.0.0:80 failed: port is already allocated 

雖然該消息是很清楚,上有衝突端口80,我找不到解決它的方法,當我將角容器設置爲在端口4200上工作時,它工作得很好,但是每次我想要訪問該頁面時都必須在URL中指定端口號。我現在用的是反向代理,因爲它是不是會在我的環境中運行的唯一的應用程序

下面是我泊塢窗,compose.yml

version: '3' 

services: 
    nginx-proxy: 
     image: jwilder/nginx-proxy 
     container_name: nginx-proxy 
     ports: - "80:80" 
     volumes: - /var/run/docker.sock:/tmp/docker.sock:ro 

    angular: 
     build: client 
     ports: - "80" 
     environment: 
      - VIRTUAL_HOST=example.com 
      - VIRTUAL_PORT=80 
     restart: always 

    express: 
     build: server 
     ports: - "3000:3000" 
     links: - database 
     restart: always 

    database: 
     image: mongo 
     ports: - "27017:27017" 
     restart: always 

networks: 
    default: 
    external: 
    name: nginx-proxy 

而且Dockerfile的角度容器

FROM node:8-alpine as builder 

COPY package.json package-lock.json ./ 

RUN npm set progress=false && npm config set depth 0 && npm cache clean --force 

RUN npm i && mkdir /ng-app && cp -R ./node_modules ./ng-app 

WORKDIR /ng-app 

COPY . . 

RUN $(npm bin)/ng build --prod --build-optimizer 

FROM nginx:1.13.3-alpine 

COPY nginx/default.conf /etc/nginx/conf.d/ 

RUN rm -rf /usr/share/nginx/html/* 

COPY --from=builder /ng-app/dist /usr/share/nginx/html 

CMD ["nginx", "-g", "daemon off;"] 

EXPOSE 80 
+0

爲什麼使用2個nginx?只需將角色nginx中的代理通行規則放在表達式中即可實現所需的全部功能。 – Stefano

+0

1是一個反向代理,第二個是承載angular2應用程序本身。 express容器是angular的後端,我希望儘可能使模塊儘可能模塊化,以便組件可以自行重用。我不想讓角容器知道其他應用程序,如果這是有道理的。 – DKMudrechenko

回答

0

問題是,您試圖在主機上打開端口80兩次。一次用於nginx-proxy,一次用於角度。從角度移除「端口80」。

+0

我試過刪除***端口: - 「80」***之前的角度配置部分。 '''docker-compose'''啓動時沒有錯誤,但是我沒有看到關於啓動角容器的消息旁邊的綠色*** done ***,而且當我看到端口80上沒有任何東西在監聽時測試。 – DKMudrechenko

+0

這是因爲你在localhost上傳遞代理。嘗試在'angular:80'上設置代理傳遞,或者爲角形容器使用不同的端口。 – Stefano

0

如果你想使用nginx作爲反向代理,你需要使用80端口來訪問它。然後修改nginx配置重定向到角容器和端口(例如81)。試試這個:「proxy_pass http://angular:81」。這應該工作。

1

瀏覽器將與您設置的虛擬端口上的容器對話。 也許你可以通過api端點將請求指向後端