Контейнер Angular Frontend Docker не отправляет / не получает данные от узла express Бэкэнд Docker Контейнер

Question

поэтому я должен docker контейнеры ...

У меня есть приложение внешнего интерфейса, написанное на Angular.

С proxy.conf. json Холдинг:

/api": {
    "target": "http://127.0.0.1:3000",
    "secure": false
}

Я также добавил в environment.prod.ts:

export const environment = {
  production: true,
  api: 'http://127.0.0.1:3000',
};

Наконец, мой бэкэнд написан в Node.js (Express).

В моем app.js:

...
app.use(function(req, res, next) {
    res.header("Access-Control-Allow-Origin", "*");
    res.header("Access-Control-Allow-Headers", "Origin, X-Requested-With, Content-Type, Accept");
    next()
});
...

Когда я создаю свои приложения и добавляю фронтенд к Nginx local с правильно настроенным файлом конфигурации и PM2, запущенный бэкендом, мое приложение работает без проблем.

Итак, следуя инструкциям и документам, я создал контейнер для моего внешнего интерфейса.

Dockerfile:

FROM nginx
COPY dist /usr/share/nginx/html

и контейнер для моего бэкэнда:

# Install the app dependencies in a full Node docker image
FROM node:10

WORKDIR "/app"
# Install OS updates 
RUN apt-get update \
 && apt-get dist-upgrade -y \
 && apt-get clean \
 && echo 'Finished installing dependencies'
# Copy package.json and package-lock.json
COPY package*.json ./
# Install app dependencies
RUN npm install --production
# Copy the dependencies into a Slim Node docker image
FROM node:10-slim

WORKDIR "/app"
# Install OS updates 
RUN apt-get update \
 && apt-get dist-upgrade -y \
 && apt-get clean \
 && echo 'Finished installing dependencies'
# Install app dependencies
COPY --from=0 /app/node_modules /app/node_modules
COPY . /app
ENV NODE_ENV production
ENV PORT 3000
USER node
EXPOSE 3000
CMD ["npm", "start"]

Так что, как вы уже догадались, я запустил оба контейнера на своем ноутбуке (сразу после завершения сборки docker), я могу получить доступ к каждому из них, но когда я пытаюсь войти в систему, у меня появляется ошибка POST ... 404 ( Не найдено).

Если я запускаю фронтенд локально, а бэкэнд из контейнера, он работает как шарм ....

Я много гуглил и не могу найти ответ.

Спасибо за ваше время и помощь, ура.

Редактировать

В соответствии с запросом мои Docker команды запуска:

docker run -d -p 3000:3000 myUserName/cis-backend
docker run -d -p 4200:80 myUserName/cis-frontend

Answer 1

После многих часов разочарования я наконец понял это. Да, одна из моих проблем заключалась в том, что я никогда не связывал свои контейнеры, что я делал, используя простой файл docker composer. Но главная проблема заключалась в том, что ни в одном из руководств, которые я читал в Интернете, не говорится, что я должен обновить файл default.conf в образе nginx контейнера.

Так что для следующего человека, который борется, как я, вот простой шаг за шагом: в вашем docker. Композитном имени ваш бэкэнд определенное c имя. В моем случае я назвал это backend. Я рекомендую создать простой docker контейнер для внешнего интерфейса, чтобы вы могли запустить в него c (docker exe c -it containerId bash), чтобы получить необходимую информацию, в противном случае, возможно, Google google default.conf nginx docker изображение поставляется с ... Если вы создали контейнер быстрого интерфейса, просто чтобы получить файл, расположенный по адресу:

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

Установите vim или что-то еще, что вы будете sh .. Простой код I used:

apt-get update
apt-get install vim

Найдите и откройте файл default.conf и скопируйте его куда-нибудь. Создайте файл Nginx -custom.conf в той же папке, где вы создали свой файл Docker для внешнего интерфейса. Скопируйте точно такую ​​же информацию, которую вы нашли в файле default.conf, и добавьте следующее в папку {..}

...
location /api/ {
             proxy_pass http://nameOfTheBackendContainer:portTheBackendIsRunninG;
#   Example: proxy_pass http://backend:3000
             proxy_http_version 1.1;
        }
...

. В файле docker добавьте следующую команду копирования:

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

Теперь в вашем коде внешнего интерфейса (обратите внимание на его angular), если вы использовали файл proxy.conf. json для вашего API, вам нужно изменить URL-адрес API. В моем случае это было изменено с:

"target": "http://localhost:3000",

на

"target": "http://backend:3000",

Я надеюсь, что это поможет кому-то, кто плохо знаком с этим и борется так же, как я.

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

Если кому-то нужна дополнительная помощь или лучшее объяснение, не стесняйтесь сообщать мне.

Answer 2

127.0.0.1 внутри контейнера внешнего интерфейса ссылается на себя. Что объясняет, почему он не подключается

Попробуйте запустить, выполнив следующие шаги

Это запустит внутренний контейнер и установит имя cis-backend

docker run -d -p 3000:3000 --name cis-backend myUserName/cis-backend

Запустите контейнер внешнего цис-интерфейса и свяжите его с внутренним контейнером

docker run -d -p 4200:80 --link cis-backend:cis-backend myUserName/cis-frontend

Syntax for link:
--link <container-name>:<alias>

This will add alias in the /etc/hosts file in the container

В конфигурации API вместо 127.0.0.1 используйте имя alias (cis- backend), настроенный для первого (целевого) контейнера.

Использование links является устаревшей функцией, и рекомендуется использовать Docker compose для мультиконтейнерных приложений.