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

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

Angular with nginx failing to communicate with backend(Golang)

问题

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

我的NGINX + Angular Dockerfile:

  1. FROM node:12-alpine as builder
  2. WORKDIR /usr/src/app
  3. COPY . .
  4. RUN npm install --silent
  5. RUN npm run ng build --prod
  6. FROM nginx:latest
  7. COPY --from=builder /usr/src/app/dist/FrontEnd /var/www
  8. COPY ./default.conf /etc/nginx/nginx.conf
  9. EXPOSE 80
  10. CMD ["nginx", "-g", "daemon off;"]

我的Golang Dockerfile:

  1. FROM golang:latest
  2. ENV GO111MODULE=on
  3. RUN mkdir /app
  4. WORKDIR /app
  5. COPY go.mod .
  6. COPY go.sum .
  7. RUN go mod download
  8. COPY . .
  9. RUN go build main.go
  10. EXPOSE 8000
  11. CMD ["./main"]

我的Docker-compose:

  1. version: '3.7'
  2. services:
  3. postgres:
  4. image: "postgres:latest"
  5. restart: always
  6. volumes:
  7. - ./init.sql:/docker-entrypoint-initdb.d/init.sql
  8. - data:/var/lib/postgresql/data
  9. ports:
  10. - "5432:5432"
  11. environment:
  12. - POSTGRES_DB=Project
  13. - POSTGRES_USER=postgres
  14. - POSTGRES_PASSWORD=password
  15. networks:
  16. - mynet
  17. #Back-end
  18. golang:
  19. build:
  20. context: .
  21. dockerfile: Dockerfile
  22. container_name: golang
  23. links:
  24. - postgres
  25. ports:
  26. - "8000:8000"
  27. networks:
  28. - mynet
  29. #Front-end Angular Application
  30. angular:
  31. links:
  32. - golang
  33. build:
  34. context: ./FrontEnd
  35. dockerfile: Dockerfile
  36. environment:
  37. - host=golang
  38. ports:
  39. - "4200:80"
  40. networks:
  41. - mynet
  42. volumes:
  43. data:
  44. networks:
  45. mynet:
  46. driver: bridge

我的nginx default.conf:

  1. worker_processes 4;
  2. events {
  3. worker_connections 1024;
  4. }
  5. http {
  6. server {
  7. listen 80;
  8. root /var/www;
  9. index index.html index.htm;
  10. include /etc/nginx/mime.types;
  11. location / {
  12. try_files $uri $uri/ /index.html;
  13. }
  14. location /users {
  15. proxy_pass http://golang:8000;
  16. proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
  17. proxy_set_header Host $http_host;
  18. }
  19. }
  20. }

这是当我尝试发送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

  1. FROM node:12-alpine as builder
  2. WORKDIR /usr/src/app
  3. COPY . .
  4. RUN npm install --silent
  5. RUN npm run ng build --prod
  6. FROM nginx:latest
  7. COPY --from=builder /usr/src/app/dist/FrontEnd /var/www
  8. COPY ./default.conf /etc/nginx/nginx.conf
  9. EXPOSE 80
  10. CMD ["nginx", "-g", "daemon off;"]

My Golang Dockerfile

  1. FROM golang:latest
  2. ENV GO111MODULE=on
  3. RUN mkdir /app
  4. WORKDIR /app
  5. COPY go.mod .
  6. COPY go.sum .
  7. RUN go mod download
  8. COPY . .
  9. RUN go build main.go
  10. EXPOSE 8000
  11. CMD [ "./main" ]

My Docker-compose

  1. version: '3.7'
  2. services:
  3. postgres:
  4. image: "postgres:latest"
  5. restart: always
  6. volumes:
  7. - ./init.sql:/docker-entrypoint-initdb.d/init.sql
  8. - data:/var/lib/postgresql/data
  9. ports:
  10. - "5432:5432"
  11. environment:
  12. - POSTGRES_DB=Project
  13. - POSTGRES_USER=postgres
  14. - POSTGRES_PASSWORD=password
  15. networks:
  16. - mynet
  17. #Back-end
  18. golang:
  19. build:
  20. context: .
  21. dockerfile: Dockerfile
  22. container_name: golang
  23. links:
  24. - postgres
  25. ports:
  26. - "8000:8000"
  27. networks:
  28. - mynet
  29. #Front-end Angular Application
  30. angular:
  31. links:
  32. - golang
  33. build:
  34. context: ./FrontEnd
  35. dockerfile: Dockerfile
  36. environment:
  37. - host=golang
  38. ports:
  39. - "4200:80"
  40. networks:
  41. - mynet
  42. volumes:
  43. data:
  44. networks:
  45. mynet:
  46. driver: bridge

My nginx default.conf

  1. worker_processes 4;
  2. events {
  3. worker_connections 1024;
  4. }
  5. http {
  6. server {
  7. listen 80;
  8. root /var/www;
  9. index index.html index.htm;
  10. include /etc/nginx/mime.types;
  11. location / {
  12. try_files $uri $uri/ /index.html;
  13. }
  14. location /users {
  15. proxy_pass http://golang:8000;
  16. proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
  17. proxy_set_header Host $http_host;
  18. }
  19. }
  20. }

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:

确定