Problems with the CORDS api distancematrix

I made in service that sticks to the api distancematrix of google in the browser I returned the JSON and I even show the data on screen but Android studio gives me the following error Access to XMLHttpRequest at 'https://maps.googleapis.com/maps/api/distancematrix/json?


OptenerDistanciaTiempo(lat, lng, latDestino, lngDestino,){
  let KEY = "XXXXXXXXXXXXXXXXXXXXXXXXXX";
  let latitudInicial = +lat;
  let longitudInicial = +lng;
  let latitudFinal = +latDestino;
  let longituddFinal = +lngDestino;
  let url = URL_MATRIX + latitudInicial + "," + longitudInicial + "&destinations=" + latitudFinal + "," + longituddFinal + "&key=" + KEY; 
  var xhr = new XMLHttpRequest();
  xhr.open('GET', 'URL_MATRIX + latitudInicial + "," + longitudInicial + "&destinations=" + latitudFinal + "," + longituddFinal + "&key=" + KEY');
  
  return this.http.get(url )
                  .map( resp=>{
                    this.destinity = resp['destination_addresses'];
                    this.homeTravel = resp['origin_addresses'];
                    let arreglo =  resp['rows'];
                    let arregloDatos = arreglo[0].elements;
                    let Dist = arregloDatos[0].distance;
                    let Tim = arregloDatos[0].duration;
                    this.travelDistance = Dist['value'];
                    this.timeDistance = Tim['text'];
                  })
}

This returns me in the browser

{
   "destination_addresses" : [ "400 mts al este del palí, San José, Ipis, Costa Rica" ],
   "origin_addresses" : [ "Vía 211, San José, Costa Rica" ],
   "rows" : [
      {
         "elements" : [
            {
               "distance" : {
                  "text" : "5,9 mi",
                  "value" : 9498
               },
               "duration" : {
                  "text" : "20 min",
                  "value" : 1191
               },
               "status" : "OK"
            }
         ]
      }
   ],
   "status" : "OK"
}

If anyone can help me, I would appreciate it