Authentication of Geonetwork using API

Question

I am accessing the metadata from the geonetwork using the code shown below but the metadata is not retrieving from the geonetwork and throwing the error 403 forbidden as CORS error, but in the I had given

xhr.setRequestHeader('Access-Control-Allow-Origin', '*'); 

also but there is no use, getting same error.

This is my code:

const apiUrl = 'http://localhost:8080/geonetwork/srv/api/0.1/records?from=1&hitsPerPage=10000';

let layerObjsArr = [];

var xhr = new XMLHttpRequest();
xhr.open('GET', apiUrl);
var username = 'admin';
var password = 'admin';
var credentials = username + ':' + password;

xhr.setRequestHeader('Authorization', 'Basic ' + Base64.encode(credentials));
xhr.setRequestHeader('Access-Control-Allow-Origin', '*');
xhr.setRequestHeader('Access-Control-Allow-Methods', 'GET, POST, PUT, DELETE');
xhr.withCredentials = false;
xhr.setRequestHeader("accept", "application/xml");

xhr.onload = function () {
    if (xhr.status === 200) {

    let xmlDoc = xhr.responseXML;

    var x = xmlDoc.getElementsByTagName("dcat:Dataset");

    for (let i = 0; i < x.length; i++) {
    let titl = x[i].getElementsByTagName("dct:title")[0].innerHTML;
    let abs = x[i].getElementsByTagName("dct:abstract")[0].innerHTML;
    let img = "";
    if (x[i].getElementsByTagName("foaf:thumbnail")[0] != undefined) {
        img = x[i].getElementsByTagName("foaf:thumbnail")[0].attributes[0].value;
    }
    let uid = x[i].getElementsByTagName("dct:identifier")[0].innerHTML;

    let layerObj = {
        title: titl,
        abstract: abs,
        thumbnail: img,
        uuid: uid,
        layer: x[i]
    }

    layerObjsArr.push(layerObj)
    }

    setLayerDetails(layerObjsArr);

    }
    else {
        console.log("^^^^^XHR Failed:" + apiUrl)
    }
};
xhr.send();

})

This is how I tried to get metadata but getting the 403 forbidden error