Я могу свернуть другой контейнер docker внутри docker compose, но не извлекать в коде

#node.js #docker #docker-compose #create-react-app

#node.js #docker #docker-compose #create-react-app

Вопрос:

Я не могу выполнить выборку из server container в frontend container , хотя я могу получить curl ответ изнутри frontend container .

У меня есть docker-compose, настроенный с интерфейсом и серверным контейнером. Я хочу получить ответ сервера из интерфейса, но я получаю ошибку GET http://server:5000/api/panels net::ERR_NAME_NOT_RESOLVED . Я получаю правильный ответ, если выполняю следующую команду из контейнера внешнего интерфейса curl http://server:5000/api/panels

Сервер Dockerfile

 FROM node:11
ADD . /code
WORKDIR /code
COPY package*.json ./

RUN npm install
COPY . .

EXPOSE 5000
CMD [ "node", "server" ]
  

Интерфейс Dockerfile

 FROM node:11
ADD . /frontend
WORKDIR /frontend
COPY package*.json ./

RUN npm install
COPY . .

EXPOSE 3000
CMD ["npm","start"]
  

docker-compose.yml

 version: '3'

services:
  server:
    build: .

  frontend:
    depends_on:
      - server
    build: ./frontend
    ports:
      - "3030:3000"
  

api-вызов

 this.callApi()
      .then((res: ISolarPanels) => {
        this.setState({ solarPanels: res })
      })
      .catch((err) => console.warn('server is offline?', err))

 private callApi = async () => {
    const response = await fetch(process.env.REACT_APP_URL '/api/panels')
    const body = await response.json()
    if (response.status !== 200) {
      throw Error(body.message)
    }
    return body
  }
  

package.json (я использую dev скрипт для локальной разработки и start для docker

 {
  "name": "frontend",
  "version": "0.1.0",
  "private": true,
  "dependencies": {
    "@types/d3": "^5.0.1",
    "d3": "^5.7.0",
    "prettier": "^1.13.5",
    "react": "^16.4.1",
    "react-dom": "^16.4.1",
    "react-scripts-ts": "2.16.0",
    "tslint-eslint-rules": "^5.3.1"
  },
  "scripts": {
    "lint": "node_modules/.bin/tslint -c tslint.json 'src/**/{*.ts,*.tsx}'",
    "dev": "REACT_APP_URL=http://localhost:3000 react-scripts-ts start",
    "start": "REACT_APP_URL=http://server:5000 react-scripts-ts start",
    "build": "react-scripts-ts build",
    "test": "react-scripts-ts test --env=jsdom",
    "eject": "react-scripts-ts eject"
  },
  "proxy": "http://localhost:5000/",
  "devDependencies": {
    "@types/node": "^10.3.3",
    "@types/react": "^16.3.17",
    "@types/react-dom": "^16.0.6",
    "typescript": "^2.9.2"
  }
}
  

Комментарии:

1. какой у вас URL-адрес хоста?

2. прямо сейчас, это единственный localhost. Интерфейс localhost:3030

3. Ошибка может возникнуть из-за многих проблем. Обычно это указывает на то, что доменное имя не может быть разрешено. Это также может произойти из-за ограничений вашего брандмауэра.

4. Не могли бы вы, пожалуйста, попробовать это, нажав 0.0.0.0 вместо localhost?

5. Я получаю ту же ошибку из интерфейса на 0.0.0.0:3030 и localhost:3030 .

Ответ №1:

Для быстрого исправления вы можете разрешить CORS на своем сервере. здесь

И в вашем веб-приложении вы можете использовать: 0.0.0.0:5000/api для указания на сервер.

Кроме того, вам нужно будет привязать свой порт в server службе в файле docker-compose.yml.

   server:
    build: .
    ports:
      - "5000:5000"
  

Ответ №2:

Подводя итог тому, что пошло не так и как это было исправлено. Запрос, конечно, был отправлен из браузера, а не из контейнера внешнего интерфейса, поэтому необходимо было открыть порт сервера и включить CORS на стороне сервера.