I'm currently developing an Angular single-page application. One of the challenges I encountered involves the $http.get request shown below:
$http.get("http://localhost:8888/Treatments.php")
.then(function (response) {
$scope.treatments = response.data.records;
})
.catch(function (response) {
console.log("Error: " + response.status);
});
Under normal circumstances, this code works perfectly. However, things take a turn after authenticating a user using the Auth0 service. Once a user successfully logs in, any subsequent $http.get requests trigger the following error in the console:
XMLHttpRequest cannot load http://localhost:8888/Treatments.php. Request header field Authorization is not allowed by Access-Control-Allow-Headers in preflight response.
Why is this happening and what steps can be taken to address this unexpected behavior?