我正在开发一个应用程序,其中我有一个react前端和一个javaspring后端。我有一个简单的API调用,我想返回一个新地址。我已经通过使用一个单独的容器来执行curl命令验证了这一点
docker container run --rm -it --net multichain-network byrnedo/alpine-curl http://multichain-api:8080/api/blockchain/address/create
现在我已经使用
docker-compose
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);
})
}
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
当我的代码试图进行调用时,这是在dev控制台上产生的错误;
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$1 @ react-dom.development.js:16660
batchedUpdates @ react-dom.development.js:2131
dispatchEvent @ react-dom.development.js:4556
interactiveUpdates$1 @ 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)
总之,我不确定这是一个反应,码头或浏览器的问题。查看我的后端应用程序的日志,当前端进行呼叫时,没有记录任何活动,因此它就像没有被击中一样。
对此有任何见解都会很好
更新
我在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).
