Dockeried настройки для Node и Reactjs

Question

Я хочу запустить два docker контейнера: один - это сервер узла ( backend ), а другой реагирует js кодом ( внешний интерфейс ).

Мой узел содержит API, как показано ниже:

app.get('/build', function (req, res) {
    ...
    ...
});

app.listen(3001);
console.log("Listening to PORT 3001");

Я использую этот API в своем коде реакции следующим образом:

componentDidMount() {

axios.get('http://localhost:3001/build', { headers: {"x-access-token": this.state.token}
      })
           .then(response => {
              const builds = response.data.message;
              //console.log("builds",builds);
              this.setState({ builds: builds,done: true });
           });
}

Но когда я запускаю 2 разных контейнера Docker, выставив 3001 для внутреннего контейнера и выставив 3000 для внешнего интерфейса контейнера и доступа http://aws-ip: 3000 (aws -ip publi c IP моего AWS экземпляра, где я запускаю два docker контейнера), сделанный запрос:

http://localhost:3001/build, из-за которого я не могу подключиться к интерфейсу API узла docker container.

Какие изменения я должен внести в существующую настройку, чтобы мое реагирующее приложение могло получать данные с сервера узлов, который работает на том же экземпляре AWS?

Answer 1

Как вы и сказали, приложение внешнего интерфейса, доступное в браузере, не может получить доступ к вашему API через http://localhost:3001. Вместо этого ваше приложение реакции должно получить доступ к API через http://[ec2-instance-elastic-ip]:3001. Ваше приложение реакции должно храниться в его коде. Ваша группа безопасности экземпляра ec2 должна разрешать входящий трафик c через порт 3001.

. Для решения проблемы достаточно выполнить вышеуказанные настройки.

, но вот несколько дополнительных советов.

• назначьте elasti c IP вашему экземпляру. В противном случае, публикуемый c IP-адрес экземпляра изменится, если вы остановите / запустите экземпляр.
• настройка доменного имени для вашего API для гибкости, простоты запоминания, повторного развертывания в любом месте и указания доменного имени на новый адрес. (множество способов сделать это, например, настроить балансировщик нагрузки, настроить CloudFront с источником ec2)
• настроить SSL для большей безопасности (много способов сделать это, например, настроить балансировщик нагрузки, настроить CloudFront с происхождением ec2)
• Поскольку ваше приложение реакции является веб-сайтом * * c, вы можете легко настроить веб-сайт c s3

Надеюсь, это поможет.

Answer 2

Вы можете следовать его учебнику. Я думаю, что вы можете достичь этого с помощью docker -compose: https://docs.docker.com/compose/

Пример: https://dev.to/numtostr/running-react-and-node-js-in-one-shot-with-docker-3o09

и вот как я использование

version: '3'
services:
    awsService:
        build:
            context: ./awsService
            dockerfile: Dockerfile.dev
        volumes:
            - ./awsService/src:/app/src
        ports:
            - "3000:3000"
    keymaster:
        build:
            context: ./keymaster
            dockerfile: Dockerfile.dev
        volumes: 
            - /app/node_modules
            - ./keymaster:/app
        ports:
            - "8080:8080"
    postgres:
        image: postgres:12.1
        ports:
            - "5432:5432"
        environment:
            POSTGRES_PASSWORD: mypassword
        volumes:
            - ./postgresql/data:/var/lib/postgresql/data
    service:
        build:
            context: ./service
            dockerfile: Dockerfile.dev
        volumes:
            - /app/node_modules
            - ./service/config:/app/config
            - ./service/src:/app/src
        ports:
            - "3001:3000"
    ui:
        build: 
            context: ./ui
            dockerfile: Dockerfile.dev
        volumes: 
            - /app/node_modules
            - ./ui:/app
        ports: 
            - "8081:8080"

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

Надеюсь, это поможет.