ajax cross origin request doesn't work in safari but works in chrome and firefox – Shopify

I’m making a shopify app that uses script tags and I need to make an ajax call to our server to get the information needed about the shop. Everything was working great until my colleague made me notice that it wasn’t working at all on his iphone. It’s also not working in safari on mac but it works in chrome.

I noticed that the status of the request is always “0” in safari and I tried to make a request to the test shop I’m doing my tests instead of our server and got a 200 status. So now I’m pretty sure it’s a cross origin problem.

From what I found it should be the headers that I need to change on the requested page but I already had “Access-Control-Allow-Origin: *” and I tried all the suggestion I could find and nothing works.

currently this is what I have on the requested page, I’m using laravel:

header('Access-Control-Allow-Origin: *');
header("Access-Control-Allow-Headers: X-API-KEY, Origin, X-Requested-With, Content-Type, Accept, Access-Control-Request-Method");
header("Access-Control-Allow-Methods: GET, POST, OPTIONS, PUT, DELETE");

$shop = Shop::where("domain", request('shop'))->first();

echo json_encode(
[ 
    'logo' => $shop->logo, 
    'text' => $shop->customizable_text, 
    'version' => $shop['plan'] 
]);

and this is the function I’m currently using to make the call in javascript(I was using jquery at first but I thought it was the problem so I tried with only javascript):

function ajaxRequest(url, parameters, callback){
const req = new XMLHttpRequest();

req.onreadystatechange = function(event) {
    // XMLHttpRequest.DONE === 4
    if (this.readyState === XMLHttpRequest.DONE) {
        if (this.status === 200) {
            callback(this.responseText);
        } else {
            console.log("Status: %d (%s)", this.status, this.statusText);
        }
    }
};

if(parameters.keys.length){
    url = url + "?"
    for(var i = 0; i < parameters.param.length; i++){
        if(i == 0){
            url = url + parameters.keys[i] + "=" + parameters.param[i]
        }
        else{
            url = url + "&" + parameters.keys[i] + "=" + parameters.param[i];
        }
    }
}

req.open('GET', url, true);
req.send(null);
}

everything works like it should in chrome and firefox, it’s just safari. Any idea what I should do to fix this?