[英]I can curl another docker container inside docker compose but not fetch in code
I can't fetch from server container
to frontend container
even though I am able to get curl
response from inside frontend container
. 我无法获取
server container
到frontend container
,即使我能够得到curl
从内响应frontend container
。
I have a docker-compose set up with a frontend and server container. 我有一个docker-compose设置了前端和服务器容器。 I want to fetch server response from frontend, but i get the error
GET http://server:5000/api/panels net::ERR_NAME_NOT_RESOLVED
. 我想从前端获取服务器响应,但出现错误
GET http://server:5000/api/panels net::ERR_NAME_NOT_RESOLVED
。 I get the correct response if i execute the following command from inside the frontend container curl http://server:5000/api/panels
如果我从前端容器
curl http://server:5000/api/panels
内部执行以下命令,则会得到正确的响应
Dockerfile server Dockerfile服务器
FROM node:11
ADD . /code
WORKDIR /code
COPY package*.json ./
RUN npm install
COPY . .
EXPOSE 5000
CMD [ "node", "server" ]
Dockerfile frontend Dockerfile前端
FROM node:11
ADD . /frontend
WORKDIR /frontend
COPY package*.json ./
RUN npm install
COPY . .
EXPOSE 3000
CMD ["npm","start"]
docker-compose.yml docker-compose.yml
version: '3'
services:
server:
build: .
frontend:
depends_on:
- server
build: ./frontend
ports:
- "3030:3000"
api-call api调用
this.callApi()
.then((res: ISolarPanels) => {
this.setState({ solarPanels: res })
})
.catch((err) => console.warn('server is offline?', err))
private callApi = async () => {
const response = await fetch(process.env.REACT_APP_URL+'/api/panels')
const body = await response.json()\
if (response.status !== 200) {
throw Error(body.message)
}
return body
}
package.json (i use dev
script for local development and start
for docker package.json(我使用
dev
脚本进行本地开发并为docker start
{
"name": "frontend",
"version": "0.1.0",
"private": true,
"dependencies": {
"@types/d3": "^5.0.1",
"d3": "^5.7.0",
"prettier": "^1.13.5",
"react": "^16.4.1",
"react-dom": "^16.4.1",
"react-scripts-ts": "2.16.0",
"tslint-eslint-rules": "^5.3.1"
},
"scripts": {
"lint": "node_modules/.bin/tslint -c tslint.json 'src/**/{*.ts,*.tsx}'",
"dev": "REACT_APP_URL=http://localhost:3000 react-scripts-ts start",
"start": "REACT_APP_URL=http://server:5000 react-scripts-ts start",
"build": "react-scripts-ts build",
"test": "react-scripts-ts test --env=jsdom",
"eject": "react-scripts-ts eject"
},
"proxy": "http://localhost:5000/",
"devDependencies": {
"@types/node": "^10.3.3",
"@types/react": "^16.3.17",
"@types/react-dom": "^16.0.6",
"typescript": "^2.9.2"
}
}
For a quick fix, you can allow CORS
on your server. 为了快速修复,您可以在服务器上允许
CORS
。 here 这里
And in your web application you can use: 0.0.0.0:5000/api
for pointing to server. 在您的Web应用程序中,您可以使用:
0.0.0.0:5000/api
: 0.0.0.0:5000/api
指向服务器。
Also, you would need to bind your port in server
service in docker-compose.yml file. 另外,您需要在docker-compose.yml文件中的
server
服务中绑定端口。
server:
build: .
ports:
- "5000:5000"
To sum up what went wrong and how it was fixed . 总结出哪里出了问题以及如何解决 。 The request was of-course sendt from the browser, and not the frontend container, therefore the server port needed to be exposed and CORS enabled from the serverside.
当然,该请求是从浏览器而不是前端容器发送的,因此需要公开服务器端口,并从服务器端启用CORS。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.