The HTTP API associated with the custom domain name cannot be invoked via fetch.

The HTTP API associated with Lambda was successfully connected to Custom domain. So I connected to the xxx.mydomain.com/vi/direct path. It was then called normally when opened in Chrome tab. However, the error "Failed to load resource: {myApiUrl} net::ERR_NAME_NOT_RESOLVED" occurs when trying to invoke via fetch in the React project. What else do you need?

const callDirectUrlAPI = async() => {
    const header = new Headers();
    try {
        const result = await fetch("api.****.com/vi/test/direct",{
            method : "GET",
        })
        console.log(await result.text())
    } catch (error) {
        console.log(error)     
    }
}

The above code is the function I used to call the API.