Angular配置使用相同的后端API-Platform on docker-compose



我通常使用API-Platform与React-Next.js前端和API-Platform分发的docker-compose配方。

这个设置只使用一个服务器——Caddy——来服务前端和后端,它工作得很好。

对于一个新项目,我试图复制相同的设置,但使用Angular前端,但我似乎缺少特定的Angular服务配置来使其工作。

运行docker-compose builddocker-compose up都工作,但当试图打开http://localhost时,我在Docker日志上得到以下错误:

caddy_1 | {"level":"error","ts":1655627402.8252528,"logger";http.log.error","msg";dial tcp 172.19.0.4:4200: connect:连接被拒绝";请求"; {"remote_ip";172.19.0.1";remote_port";;64320";proto";HTTP/2.0";method";GET";主机";;localhost";;uri";;;;;英特尔Mac OS X 10.15;rv:102.0) Gecko/20100101 Firefox/102.0"],"Accept"; ["text/html,application/xhtml+xml,application/xml;q=0.9,image/avif,image/webp,/;q=0.8"],"Accept-Language"; ["fr-FR,en;q=0.7,en;q=0.3"],"Accept-Encoding"; ["gzip, deflate,br"],"Upgrade-Insecure-Requests"1","Sec-Fetch-Dest":["document","Sec-Fetch-Site":["none","Te":["trailers","Cookie"[],"Sec-Fetch-Mode":["navigate","Sec-Fetch-User":"? 1"},"tls":{"resumed"假的,"version": 772年,"cipher_suite": 4865年,"proto":"h2","server_name":"localhost"}},"d"status" uration": 0.001917417: 502年,"err_id":"gz2ubcw01","err_trace":"reverseproxy。"statusError (reverseproxy.go: 1196);}

完整的代码可以在这个存储库中获得。

在Next.js中,以下代码被添加到next.config.js:

module.exports = {
serverRuntimeConfig: {
NEXT_PUBLIC_ENTRYPOINT: process.env.NEXT_PUBLIC_ENTRYPOINT || "https://localhost",
},
};

所以,我似乎缺少了让它工作的等效Angular服务器配置,而且我对Angular一点也不精通。

docker-compose.yml上,环境变量NEXT_PUBLIC_ENTRYPOINT定义如下:

pwa:
build:
context: ./pwa
target: api_platform_pwa_prod
environment:
API_PLATFORM_CLIENT_GENERATOR_ENTRYPOINT: http://caddy
NEXT_PUBLIC_ENTRYPOINT: http://caddy

Dockerfileat./pwa如下:

ARG NODE_VERSION=16
FROM node:${NODE_VERSION}-alpine AS api_platform_pwa_common
EXPOSE 4200
WORKDIR /usr/src/pwa
COPY package*.json ./
RUN npm install -g @angular/cli @angular-devkit/build-angular && npm install
COPY . ./
VOLUME /usr/src/pwa/node_modules
FROM api_platform_pwa_common AS api_platform_pwa_dev
ENV API_PLATFORM_CLIENT_GENERATOR_OUTPUT .
CMD ["npm", "run", "start"]
FROM api_platform_pwa_common AS api_platform_pwa_prod
ENV NODE_ENV production
ARG NEXT_PUBLIC_ENTRYPOINT
RUN set -eux; 
npm run build
CMD ["npm", "run", "start"]

尝试将其添加到您的ng服务中--host 0.0.0.0