Angular与nginx无法与后端(Golang)通信。

huangapple go评论91阅读模式
英文:

Angular with nginx failing to communicate with backend(Golang)

问题

我正在使用nginx来提供angular(index.html)的服务,这方面运行得很好。问题是当我尝试与后端通信时,我一直收到错误。

我的NGINX + Angular Dockerfile:

FROM node:12-alpine as builder
WORKDIR /usr/src/app
COPY . .
RUN npm install --silent
RUN npm run ng build --prod

FROM nginx:latest

COPY --from=builder /usr/src/app/dist/FrontEnd /var/www
COPY ./default.conf /etc/nginx/nginx.conf

EXPOSE 80

CMD ["nginx", "-g", "daemon off;"]

我的Golang Dockerfile:

FROM golang:latest

ENV GO111MODULE=on
RUN mkdir /app
WORKDIR /app

COPY go.mod .
COPY go.sum .
RUN go mod download

COPY . .

RUN go build main.go

EXPOSE 8000

CMD ["./main"]

我的Docker-compose:

version: '3.7'
services:
    postgres:
      image: "postgres:latest"
      restart: always
      volumes:
        - ./init.sql:/docker-entrypoint-initdb.d/init.sql
        - data:/var/lib/postgresql/data
      ports:
        - "5432:5432"
      environment:
        - POSTGRES_DB=Project
        - POSTGRES_USER=postgres
        - POSTGRES_PASSWORD=password
      networks:
        - mynet

    #Back-end
    golang:
      build:
        context: .
        dockerfile: Dockerfile
      container_name: golang
      links:
        - postgres  
      ports:
        - "8000:8000"
      networks:
        - mynet
    
    #Front-end Angular Application
    angular:
      links:
        - golang
      build:
        context: ./FrontEnd
        dockerfile: Dockerfile
      environment:
        - host=golang
      ports:
        - "4200:80"
      networks:
        - mynet

volumes:
  data:

networks:
  mynet:
    driver: bridge

我的nginx default.conf:

worker_processes 4;

events {
    worker_connections  1024;
}

http {
    server {
        listen 80;
        root   /var/www;
        index  index.html index.htm;
        include /etc/nginx/mime.types;

        location / {
            try_files $uri $uri/ /index.html;
        }

        location /users {
            proxy_pass http://golang:8000;
            proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
            proxy_set_header Host $http_host;
        }
    }
}

这是当我尝试发送API调用到golang时的结果:点击查看

我已经困在这个问题上几天了,时间不多了。请帮忙!提前感谢。

英文:

I'm using nginx to serve angular(index.html) and that works fine. The issue is that I keep getting error when trying to communicate with my backend.

My NGINX + Angular Dockerfile

FROM node:12-alpine as builder
WORKDIR /usr/src/app
COPY . .
RUN npm install --silent
RUN npm run ng build --prod

FROM nginx:latest

COPY --from=builder /usr/src/app/dist/FrontEnd /var/www
COPY ./default.conf /etc/nginx/nginx.conf

EXPOSE 80

CMD ["nginx", "-g", "daemon off;"]

My Golang Dockerfile

FROM golang:latest

ENV GO111MODULE=on
RUN mkdir /app
WORKDIR /app

COPY go.mod .
COPY go.sum .
RUN go mod download

COPY . .

RUN go build main.go

EXPOSE 8000

CMD [ "./main" ]

My Docker-compose

version: '3.7'
services:
    postgres:
      image: "postgres:latest"
      restart: always
      volumes:
        - ./init.sql:/docker-entrypoint-initdb.d/init.sql
        - data:/var/lib/postgresql/data
      ports:
        - "5432:5432"
      environment:
        - POSTGRES_DB=Project
        - POSTGRES_USER=postgres
        - POSTGRES_PASSWORD=password
      networks:
        - mynet

    #Back-end
    golang:
      build:
        context: .
        dockerfile: Dockerfile
      container_name: golang
      links:
        - postgres  
      ports:
        - "8000:8000"
      networks:
        - mynet
    
    #Front-end Angular Application
    angular:
      links:
        - golang
      build:
        context: ./FrontEnd
        dockerfile: Dockerfile
      environment:
        - host=golang
      ports:
        - "4200:80"
      networks:
        - mynet

volumes:
  data:

networks:
  mynet:
    driver: bridge

My nginx default.conf

worker_processes 4;

events {
    worker_connections  1024;
}

http {
    server {
        listen 80;
        root   /var/www;
        index  index.html index.htm;
        include /etc/nginx/mime.types;

        location / {
            try_files $uri $uri/ /index.html;
        }

        location /users {
            proxy_pass http://golang:8000;
            proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
            proxy_set_header Host $http_host;
        }
    }
}

This is the result of when I try to send api call to golang
[1]: https://i.stack.imgur.com/XQuhf.png

I've been stuck on this issue for several days now and is running low on time. Please help!
Thanks in advance.

答案1

得分: 0

golang:8000 只能在 Docker 网络中访问。你可以通过在浏览器中访问 http://35.238.xx.xx:4200/users/xxx 来检查你的 Golang API,并在你的 Angular 代码中使用相对 URL,例如 "/users/xxx"

英文:

golang:8000 is only reachable in docker network. You could check your golang API by visiting http://35.238.xx.xx:4200/users/xxx in browser, and use relative url like "/users/xxx" in your angular code.

huangapple
  • 本文由 发表于 2021年10月21日 15:05:55
  • 转载请务必保留本文链接:https://go.coder-hub.com/69657371.html
匿名

发表评论

匿名网友

:?: :razz: :sad: :evil: :!: :smile: :oops: :grin: :eek: :shock: :???: :cool: :lol: :mad: :twisted: :roll: :wink: :idea: :arrow: :neutral: :cry: :mrgreen:

确定