我正在研究一个简单的项目，该项目由docker网络（桥）中的两个docker容器组成。从主机（通过端口转发到前端）调用后端时，后端超时的问题

设置：

docker network create --driver bridge my-network

1. Java Spring后端在/randomQuote端点下提供来自数据库的随机报价

docker run -it --rm --name backend --network my-network backend:1.0

1. 用于显示收到的报价的Javascript前端

docker run -it --rm --name frontend --network my-network -p 8081:8081 frontend:1.0

用于请求数据的前端代码（点击按钮）：

const requestQuote = async() => {
    let response = await fetch(apiUrl + getRandomQuoteEndpoint)
    if(handleErrors(response)){
        quote = await response.json()
        displayQuote()
    }
}

我为apiUrl尝试了多种版本，例如：

http://backend:8080
http://172.18.0.2:8080
backend:8080
172.18.0.2:8080

后端界面：

@RequestMapping("/")
public interface QuotesRestController {

    @CrossOrigin()
    @GetMapping("/randomQuote")
    public ResponseEntity<Quote> getRandomQuote();
}

主机http://localhost:8081/上的frontend内容正确显示，但是请求报价时我收到的是GET http://172.18.0.2:8080/randomQuote net::ERR_CONNECTION_TIMED_OUT。

curl来自前端，正确地返回了引号，因此问题仅在我进行端口转发并尝试在主机上显示时出现。

我怀疑这是因为对backend：8080 / randomQuote的调用是由主机的浏览器发出的，该浏览器不在docker网络中，因此无法访问后端。

我的配置/代码有问题吗？还是我应该使用其他方法？