I am struggling with the persistent issue of receiving the (settings.js:76 Cross-Origin Read Blocking (CORB) blocked cross-origin response) error whenever I use the fetch method to retrieve JSON data from an API. Below is the snippet of code that I am currently working with:
function workUpdate() {
let data = new FormData();
let miles = $("radius").value / 1000;
let zip = "";
let cookies = document.cookie.split(";");
for (let i = 0; i < cookies.length; i++) {
let key = cookies[i].split("=");
if (key[0].trim() == "zip") {
zip = key[1];
}
}
if (zip == "") {
$("radius-error").innerHTML = "Please provide your zip code in the personal information tab."
} else {
let url = "https://www.zipcodeapi.com/rest/TrAEIfdiFRU4FNxY94su2FXgrXbCRud9mnfyWdubJSKM5Py7x0g5LjTTd46NXIo8/radius.json/" + zip + "/" + miles + "/mile";
fetch(url, {mode:'no-cors'})
.then(checkStatus)
.then(JSON.parse)
.then(handleWorkResponse)
.catch(console.log);
}
}
function handleWorkResponse(response) {
let locations = response[0]["zip_code"] + "-";
for (let i = 1; i < response.length; i++) {
locations += "-" + response[i]["zip_code"];
}
let data = new FormData();
data.append("locations", locations);
let url = "php/workupdate.php";
fetch(url, {method: "POST", body: data, mode:'cors', credentials:'include'})
.then(checkStatus)
.then(function() {
location.reload();
})
.catch(console.log);
}