coming across with Cors issue after logged in

here is my axios get request

async getIpAddress ({commit}) {
    const { data: { ip } } = await axios.get("https://www.cloudflare.com/cdn-cgi/trace", {responseType: "text", transformResponse: data =>
        Object.fromEntries(data.trim().split("\n").map(line => line.split("=")))
    });
    console.log(ip);
    commit('setIp', ip)

if request.user.is_anonymous: working fine smoothly console.log is

[HMR] Waiting for update signal from WDS...   client-entry.js?d267:36 
[Quasar] Running SPA.                         auth.js?e140:216
84.54.84.225                                  client?db9c:48 
[WDS] Hot Module Replacement enabled.         client?db9c:52 
[WDS] Live Reloading enabled.                 backend.js:2237  
vue-devtools  Detected Vue v2.6.11

but after logged in I start struggling with cors

Access to XMLHttpRequest at 'https://www.cloudflare.com/cdn-cgi/trace' from origin 'http://localhost:8080' has been blocked by CORS policy: Request header field authorization is not allowed by Access-Control-Allow-Headers in preflight response.
xhr.js?e38e:160 GET https://www.cloudflare.com/cdn-cgi/trace net::ERR_FAILED

please help me out

Solution

I preferred to use this one!!!

async getIpAddress ({commit}) {
    let response = await fetch("https://ipapi.co/json/");
    let data = await response.json();
    commit('setIp', data.ip) 
}

it worked well for my case