Docker组成连接后端和前端

Question

问题：使用Docker compose(Nestjs和Nextjs(将我的后端和前端连接在一起。需要它才能在AWS使用unic集群。本地工作方式也不一样。。。

但所有工作都是在分离的docker compose中进行的(在AWS在线和本地创建后端，在创建的端点使用我的前端(，但在一起。。。我不知道如何解决它。我尝试了互联网上的多种解决方案。

使用前端的docker主机连接：

const fetcher = (url: string) => fetch(url).then((res)=>res.json())
useSWR('http://host.docker.internal:3000/grandetabela', fetcher, {
onSuccess:(data,key,config)=>{
console.log(data)
}
})

这导致错误：GET http://host.docker.internal:3000/grandetabela net::ERR_NAME_NOT_RESOLVED，或者如果我尝试本地主机，它会出现CORS问题。

nextjs中的内部api也是，但我没有得到CORS问题：

//
try {
const data = await axios.get('http://host.docker.internal:3000/grandetabela') 
.then((resp:any)=>{
return resp
})
res.status(200).json(data)
} catch (error) {
console.error(error)
res.status(502).json({error:'error on sever request'})
}

如果尝试使用localhost作为选项，则会导致AxiosError的另一个问题：请求失败，如果我尝试使用另一个来自internet的api，我可以正常获得响应。

有一些想法我试着看我的码头工人写。。。我试着用ips。。。我可以在docker内部ping，但我不知道获取访问主机：例如3000来咨询我的端点。

version: '3.1'
services:
db:
image: postgres
# restart: always
container_name: 'pgsql'
ports:
- "5432:5432"
environment:
POSTGRES_USER: pgadmin
POSTGRES_PASSWORD: pgpalavra
POSTGRES_DB: mydatabase
# networks:
#   mynetwork:
#     ipv4_address: 172.20.20.1
adminer:
image: adminer
# restart: always
ports:
- "8080:8080"
# networks:
#   mynetwork:
#     ipv4_address: 172.20.70.1
node-ytalo-backend:
image: ytalojacs/nestjsbasic_1-0
ports:
- "3000:3000"
command: >
sh -c "npm run build 
npm run start:prod"
environment:
POSTGRES_USER: pgadmin
POSTGRES_PASSWORD: pgpalavra
POSTGRES_DB: mydatabase
POSTGRES_HOST: db
# networks:
#   mynetwork:
#     ipv4_address: 172.20.50.1
prophet:
image: ytalojacs/prophetforecast-1_0
ports:
- "3001:3001"
# networks:
#   mynetwork:
#     ipv4_address: 172.20.100.1
front-end:
depends_on:
- node-ytalo-backend
image: ytalojacs/frontendjsprophet
environment:
PORT: 3010
command: >
sh -c "npm run build 
npm run start"
ports:
- "3010:3010"
links: 
- "node-ytalo-backend:myback.org"
# networks:
#   mynetwork:
#     ipv4_address: 172.20.128.1
# networks:
#   mynetwork:
#     ipam:
#       config:
#         - subnet: 172.20.0.0/16

当我在docker(docker exec bash(中使用host.docker.internal whith'curl'时，所有的工作也都按预期进行。我可以从后台获得响应。。。

我错过了什么吗。env？

Answer 1

你有一个与我转发相同SO答案的少数人类似/相同的问题。

但我在这里引用：

我不是MERN的专家(我们主要运行Angular和.Net(，但我必须警告你一件事。我们在一开始设置时遇到了一个问题，我们在容器中本地工作，但在部署服务器上没有，因为我们忘记了web应用程序的基本内容。

应用程序在您的浏览器中运行，而如果您在其他地方部署应用程序堆栈，则服务的REST(API、DB等(不会。因此，在应用程序中引用IP/DNS/Llocalhost是不起作用的，因为那里什么都没有。一个包含WEB应用程序的容器只为您的浏览器(客户端(文件提供服务，然后JS和逻辑在浏览器中执行，而不是在容器中执行。

我怀疑这可能会影响您连接到后端的能力。

要解决此问题，您有两个选项。

• 创建一个HTTP代理作为附加服务，然后FE调用该代理(设置域和路由(，例如Nginx、Traefik。。。然后该代理可以使用服务名称引用后端，因为它与API位于同一环境中
• 直接从容器中暴露HTTP端口，然后FE可以调用remoteServerIP:exposedPort，您将直接连接到容器的接口。(注意：我不建议实际使用这种方式，仅用于测试不带任何代理的直接连接(

更新2022-10-05

添加了实用服务器上的nginx配置，说明如何从容器内运行的nginxs向同一网络上的其他容器进行请求调用。

Nginx配置：

server_tokens off;
# ----------------------------------------------------------------------------------------------------
upstream local-docker-verdaccio {
server verdaccio:4873; #verdaccio is docker compose's service name and port 4873 is port on which container is listening internally
}
# ----------------------------------------------------------------------------------------------------
# ----------------------------------------------------------------------------------------------------
# si.company.verdaccio
server {
listen 443 http2 ssl;
server_name verdaccio.company.org;
# ----------------------------------------------------------------------------------------------------
add_header Strict-Transport-Security "max-age=31536000" always;
proxy_set_header Host $http_host;
proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
proxy_set_header X-Forwarded-Port $server_port;
proxy_set_header X-Forwarded-Proto $scheme;
proxy_set_header X-Real-IP $remote_addr;
ssl_certificate /etc/tls/si.company.verdaccio-chain.crt;
ssl_certificate_key /etc/tls/si.company.verdaccio-unencrypted.key;
ssl_ciphers ECDHE-ECDSA-AES128-GCM-SHA256:ECDHE-RSA-AES128-GCM-SHA256:ECDHE-ECDSA-AES256-GCM-SHA384:ECDHE-RSA-AES256-GCM-SHA384:ECDHE-ECDSA-CHACHA20-POLY1305:ECDHE-RSA-CHACHA20-POLY1305:DHE-RSA-AES128-GCM-SHA256:DHE-RSA-AES256-GCM-SHA384;
ssl_prefer_server_ciphers off;
ssl_protocols TLSv1.2 TLSv1.3;
# ----------------------------------------------------------------------------------------------------
location / {
proxy_pass http://local-docker-verdaccio/;
proxy_redirect off;
}
}
server {
listen 80;
server_name verdaccio.company.org;
return 301 https://verdaccio.company.org$request_uri;
}
# ----------------------------------------------------------------------------------------------------

以及相应的docker-compose.yml文件。

version: "3.7"
services:
proxy:
container_name: proxy
image: nginx:alpine
ports:
- "443:443"
restart: always
volumes:
- 5fb31181-8e07-4304-9276-9da8c3a581c9:/etc/nginx/conf.d:ro
- /etc/tls/:/etc/tls:ro
verdaccio:
container_name: verdaccio
depends_on:
- proxy
expose:
- "4873"
image: verdaccio/verdaccio:4
restart: always
volumes:
- d820f373-d868-40ec-bb6b-08a99efddc06:/verdaccio
- 542b4ca1-aefe-43a8-8fb3-804b46049bab:/verdaccio/conf
- ab018ca9-38b8-4dad-bbe5-bd8c41edff77:/verdaccio/storage
volumes:
542b4ca1-aefe-43a8-8fb3-804b46049bab:
external: true
5fb31181-8e07-4304-9276-9da8c3a581c9:
external: true
ab018ca9-38b8-4dad-bbe5-bd8c41edff77:
external: true
d820f373-d868-40ec-bb6b-08a99efddc06:
external: true