对接后NGINX代理通道不工作(MERN|多克|NGINX)

jhkqcmku  于 2022-11-02  发布在  Nginx
关注(0)|答案(1)|浏览(105)

首先,我对Docker,NGINX还很陌生,我正在尝试将我的MERN应用程序容器化。我的目标是将前端(react),后端(nodejs)和nginx对接,并使用对接合成来运行它们。到目前为止,我已经对接了它们,所有的东西都运行得没有任何错误。但是我不能访问后端,我使用了代理传递,这是显示404。
在我的Nginx中,localhost(“/”)是我的react应用程序,“/apipoint”是我通过代理传递设置的后端。但是在浏览器中,我不能通过“localhost/apipoint”访问任何东西。虽然我可以通过“localhost:PORT”访问后端
我的文件夹结构

├── Backend
│   ├── Dockerfile
│  
├── Frontend
│   │
│   └── Dockerfile
│   │
│   └── default.conf
│
└── docker-compose.yml

默认.conf(nginx)

server {
    listen 80 default_server;
    listen [::]:80 default_server;

    server_name _;

location /apipoint {
        proxy_set_header Host $host;
        proxy_set_header X-Real-IP $remote_addr;
        proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
        proxy_set_header X-Forwarded-Proto $scheme;

        proxy_pass http://nodejsserver:8082;
    }
location / {
        root /var/www/html;
    }
}

停靠文件(前端)


# pull the Node.js Docker image

FROM node:alpine as builder

# create the directory inside the container

WORKDIR ./Frontend

# copy the package.json files from local machine to the workdir in container

COPY package*.json ./

# run npm install in our local machine

RUN npm install --force

# copy the generated modules and all other files to the container

COPY . ./

# the command that starts our app

RUN npm run build

# stage 2

FROM nginx

# WORKDIR /usr/share/nginx/html

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

# Copies static resources from builder stage  --from=builder

COPY --from=builder ./Frontend/build /var/www/html

EXPOSE 80

RUN chown nginx.nginx /var/www/html/ -R

停靠文件(后端)


# pull the Node.js Docker image

FROM node:alpine

# create the directory inside the container

WORKDIR ./Backend

# copy the package.json files from local machine to the workdir in container

COPY package*.json ./

# run npm install in our local machine

RUN npm install --force

# copy the generated modules and all other files to the container

COPY . .

# our app is running on port 5000 within the container, so need to expose it

EXPOSE 8082

# the command that starts our app

CMD ["node", "server.js"]

Docker-compose.yml

version: "3.8"
services:
    nodeserver:
        build:
            context: ./Backend
        container_name: nodejsserver
        hostname: nodejsserver
        networks:
            - app-network
        ports:
            - "8082:8082"
    frontend:
        build:
            context: ./Frontend
        container_name: nginx
        hostname: nginx
        networks:
           - app-network
        ports:
           - "80:80"
 networks:
     app-network: 
         external: true

我的docker-compose文件有什么问题吗?或者nginx配置有什么问题吗?或者我在其他地方做错了什么?我真的很感激任何类型的建议和解决方案。

  • 谢谢-谢谢
4dbbbstv

4dbbbstv1#

浏览您的Docker文件,会跳出一些Docker端的概念项(没有特定的顺序)。
在这两个Dockerfile中,您都有以下行


# run npm install in our local machine

RUN npm install --force

# copy the generated modules and all other files to the container

COPY . .

Dockerfile中的RUN命令未运行(在本例中安装npm依赖项)-它在您所需的映像中运行该命令。完成上述第一步后,在您的本地计算机上没有新内容可供COPY使用(只是目录中已经存在的任何东西)。也还没有“容器”--Dockerfile用于构建一个映像,从该映像中可以生成容器。
在同一个Dockerfile中,让我们看一下下面这行

COPY package*.json ./

我想你的意思是

COPY package.json /

在您的docker-compose.yml文件中,您的两个服务都有hostname-您可以删除它们。由于您的服务在同一个网络上一起运行,它们可以通过各自的服务名访问对方。添加主机名只会使事情变得混乱。
既然你说你对Docker和nginx还很陌生,我建议你通过创建一个不同的nginx docker服务来简化你的设置(这样你的docker-compose文件中总共会有3个服务:前端、后端和nginx代理)。
我会避免尝试创作多层Dockerfiles(您的前端)--每个Docker映像/服务一个层/功能。这将更容易隔离/调试哪个方面(docker与nginx)给您带来麻烦。
在对接的nginx代理方面--你可以使用官方的图像或者像jwilder's popular proxy这样的方便的图像,这样可以稍微简化nginx的接口。

相关问题