Angular-CLI代理不能在Docker中工作

我有一个docker-compose文件,包含我需要的所有项目。

这个docker-compose有一个nginx服务器,mysql,phpmyadmin和php。 在它的顶部,我最近添加了一个angular形容器。 一切工作正常,如果我去localhost:4200,我在angular应用程序,如果我去本地主机:80,我在Laravel后端。

现在我需要对我的后端API做一个简单的经典请求。 我build立了一个代理angular度看起来像这样:

{ "/api/*": { "target":"http://localhost:80", "secure":false, "changeOrigin":true, "pathRewrite": {"^/api" : ""}, "logLevel":"debug" } } 

这是我根据这个主题复制的configuration。 但是,当我尝试拨打电话时,Chrome浏览器正在说http:// localhost:4200 / api / test不存在(错误404),这是正常的。 另一方面,angular度服务器说
HPM] Error occurred while trying to proxy request /test from localhost:4200 to http://localhost:80 (ECONNREFUSED) (https://nodejs.org/api/errors.html#errors_common_system_errors)

我猜这是来自docker,但我不知道如何解决这个问题。

[编辑]

 version: '2' services: web_server: restart: always image: nginx:latest ports: - "80:80" volumes: - /projects/laravel/:/var/www/ - /docker/sites-enabled-nginx:/etc/nginx/sites-enabled/ - /docker/nginx.conf:/etc/nginx/nginx.conf links: - php:php php: restart: always build: /docker/php/ container_name: "php" volumes: - /projects/laravel/:/var/www/ - db:db db: restart: always image: mysql volumes: - /Users/Irindul/mysql:/var/lib/mysql ports: - "3306:3306" container_name: "mysql" environment: - MYSQL_DATABASE=homestead - MYSQL_USER=homestead - MYSQL_PASSWORD=secret - MYSQL_ROOT_PASSWORD=root myadmin: restart: always image: phpmyadmin/phpmyadmin links: - db:db ports: - "8080:80" angular: restart: always build: /docker/angular container_name: angular volumes: - /projects/angular/package.json:/usr/src/app/package.json - /projects/angular:/usr/src/app/ ports: - "4200:4200" 

这里是PHP和Angular的Dockerfiles:

PHP:

 FROM php:7-fpm RUN docker-php-ext-install pdo pdo_mysql WORKDIR /var/www 

Angular:

 #Latest Node FROM node #Creating working folder RUN mkdir -p /usr/src/app #Update pwd WORKDIR /usr/src/app #Run npm RUN npm install EXPOSE 4200 CMD ["npm", "start"] 

package.json:

 { "name": "client", "version": "0.0.0", "license": "MIT", "scripts": { "ng": "ng", "start": "ng serve -H 0.0.0.0 --proxy-config proxy.config.json", "build": "ng build", "test": "ng test", "lint": "ng lint", "e2e": "ng e2e" }, "private": true, "dependencies": { "@angular/animations": "^4.2.4", "@angular/common": "^4.2.4", "@angular/compiler": "^4.2.4", "@angular/core": "^4.2.4", "@angular/forms": "^4.2.4", "@angular/http": "^4.2.4", "@angular/platform-browser": "^4.2.4", "@angular/platform-browser-dynamic": "^4.2.4", "@angular/router": "^4.2.4", "core-js": "^2.4.1", "rxjs": "^5.4.2", "zone.js": "^0.8.14" }, "devDependencies": { "@angular/cli": "1.3.2", "@angular/compiler-cli": "^4.2.4", "@angular/language-service": "^4.2.4", "@types/jasmine": "~2.5.53", "@types/jasminewd2": "~2.0.2", "@types/node": "~6.0.60", "codelyzer": "~3.1.1", "jasmine-core": "~2.6.2", "jasmine-spec-reporter": "~4.1.0", "karma": "~1.7.0", "karma-chrome-launcher": "~2.1.1", "karma-cli": "~1.0.1", "karma-coverage-istanbul-reporter": "^1.2.1", "karma-jasmine": "~1.1.0", "karma-jasmine-html-reporter": "^0.2.2", "protractor": "~5.1.2", "ts-node": "~3.2.0", "tslint": "~5.3.2", "typescript": "~2.3.3" } } 

你的问题是,你没有复制package.json并且当没有package.json时,npm install不会执行任何操作

改变你的angular度文件到下面

 #Latest Node FROM node #Creating working folder RUN mkdir -p /usr/src/app -p /usr/src/node_modules ENV NODE_PATH=/usr/src/node_modules WORKDIR /usr/src/app COPY package.json ./package.json RUN npm install EXPOSE 4200 CMD ["npm", "start"] 

这会将您的node_nodules安装在$NODE_PATH ,该文件是/usr/src/node_modules

改变你的angular度服务在撰写如下

  angular: restart: always build: /docker/angular container_name: angular volumes: - /projects/angular:/usr/src/app/ ports: - "4200:4200" 

package.json的额外条目是不需要的。 现在,即使您要从本地文件夹挂载覆盖/usr/src/app/node_modules ,但我们已经将节点模块更改为在/usr/src/node_modules

我通过从docker中删除Angular并用一个简单的npm start手动运行来解决这个问题。