无法执行从一张 docker 图像到另一张图像的 API 请求

Question

我正在开发一个有反应前端和 java spring 后端的应用程序。我有一个简单的 API 调用，我想 return 一个新地址。我已经通过使用单独的容器执行 curl 命令 docker container run --rm -it --net multichain-network byrnedo/alpine-curl http://multichain-api:8080/api/blockchain/address/create 验证了这项工作。此调用 return 是预期的结果。

现在我已经使用 docker-compose 创建了我的 docker 环境，它们都已启动并且运行并且可以互相 ping

version: "3.7"

networks:
  multichain-network:
    driver: bridge
    ipam:
      driver: default
      config:
        - subnet: 172.18.0.0/16
    name: multichain-network

services:
  multichain-api:
    build:
      context: ./blockchain
    networks:
      - multichain-network
    ports:
      - "8080:8080"
    volumes:
      - type: bind
        source: ${PWD}/blockchain/target
        target: /target
    container_name: multichain-api

  frontend:
    build:
      context: ./frontend
    networks:
      - multichain-network
    ports:
      - "3000:3000"
    volumes:
      - type: bind
        source: ${PWD}/frontend
        target: /frontend
    container_name: frontend

我对反应还很陌生，所以我想知道它是否可以在我的代码中完成，所以这里是调用的代码片段；

getNewAddress = () => {
    console.log("Button clicked");
    axios.get('http://multichain-api:8080/api/blockchain/address/create')
        .then(function (response) {
            console.log("getting new address");
            this.setState({newAddress: response.data});
            console.log(this.state.newAddress);
        })
        .catch(function (error) {
            console.log(error);
        })
}

你会注意到在调用中我是直接调用容器名称而不是IP地址。我这样做是因为它们都是同一个网络的一部分，当我使用它工作的容器名称从前端 ping 后端容器时；

docker exec frontend ping multichain-api
PING multichain-api (172.18.0.4): 56 data bytes
64 bytes from 172.18.0.4: seq=0 ttl=64 time=0.295 ms
64 bytes from 172.18.0.4: seq=1 ttl=64 time=0.158 ms
64 bytes from 172.18.0.4: seq=2 ttl=64 time=0.253 ms

当我的代码尝试进行调用时，这是在开发控制台上产生的错误；

VM2194:1 GET http://multichain-api:8080/api/blockchain/address/create 0 ()
(anonymous) @ VM2194:1
dispatchXhrRequest @ xhr.js:178
xhrAdapter @ xhr.js:12
dispatchRequest @ dispatchRequest.js:59
Promise.then (async)
request @ Axios.js:51
Axios.(anonymous function) @ Axios.js:61
wrap @ bind.js:9
Container._this.getNewAddress @ Container.js:12
apply @ _apply.js:15
baseInvoke @ _baseInvoke.js:21
apply @ _apply.js:16
(anonymous) @ _overRest.js:32
(anonymous) @ Button.js:74
callCallback @ react-dom.development.js:100
invokeGuardedCallbackDev @ react-dom.development.js:138
invokeGuardedCallback @ react-dom.development.js:187
invokeGuardedCallbackAndCatchFirstError @ react-dom.development.js:201
executeDispatch @ react-dom.development.js:461
executeDispatchesInOrder @ react-dom.development.js:483
executeDispatchesAndRelease @ react-dom.development.js:581
executeDispatchesAndReleaseTopLevel @ react-dom.development.js:592
forEachAccumulated @ react-dom.development.js:562
runEventsInBatch @ react-dom.development.js:723
runExtractedEventsInBatch @ react-dom.development.js:732
handleTopLevel @ react-dom.development.js:4477
batchedUpdates @ react-dom.development.js:16660
batchedUpdates @ react-dom.development.js:2131
dispatchEvent @ react-dom.development.js:4556
interactiveUpdates @ react-dom.development.js:16715
interactiveUpdates @ react-dom.development.js:2150
dispatchInteractiveEvent @ react-dom.development.js:4533
Container.js:19 Error: Network Error
    at createError (createError.js:16)
    at XMLHttpRequest.handleError (xhr.js:87)

请注意，我使用的浏览器是 Chromium 版本 68.0.3440.106。总而言之，我不确定这是 React、docker 还是浏览器问题。查看我的后端应用程序的日志，当前端发出调用时，没有 activity 记录，所以就好像它甚至没有被击中一样。

任何对此的见解都会很棒

更新

我在 Firefox 上尝试了这个测试，看看它是否是浏览器问题，开发控制台应该有一条额外的信息；

Cross-Origin Request Blocked: The Same Origin Policy disallows reading the remote resource at http://multichain-api:8080/api/blockchain/test. (Reason: CORS request did not succeed).

Answer 1

您遇到的是 cors 问题，而不是 docker 问题。它说发出请求的服务器的源域（ frontend - react ）和服务器的源域（ backend - multichain-api ）不同，你可以找到cors系统arch here

要在后端服务器中解决此问题，您应该让您的服务器接受来自不同域的请求。

无法执行从一张 docker 图像到另一张图像的 API 请求

Can't perform API request from one docker image to another

docker

reactjs

docker-compose

docker-container