I am using restivus plugin to handle my Api Requests.
The issue I am facing is:
If Api returns 200 status code, everything works fine.
But if I send invalid Authentication Bearer Token in header or if any error returns from API, e.g 422, 401, 400 .. etc, my ajax request fails and gives this error:
CORS header ‘Access-Control-Allow-Origin’ missing
Here is my restivus confiqurations:
myApi = new Restivus({
apiPath: 'api/',
defaultHeaders: {
"Access-Control-Allow-Origin": "*",
"Access-Control-Allow-Credentials": "true",
"Access-Control-Allow-Headers": "Access-Control-Allow-Headers, Access-Control-Request-Method, Connection, Content-Language, Access-Control-Request-Headers, Origin, X-Requested-With, Content-Type, Accept-Language, Accept, Z-Key, Authorization, client-id, client-secret, client_id, client_secret",
"Content-Type": "application/json",
"Access-Control-Allow-Methods": "GET, POST, PUT, DELETE, OPTIONS"
},
enableCors: true,
useDefaultAuth: false,
prettyJson: true,
defaultOptionsEndpoint: {
action: function() {
this.response.writeHead(201, {
"Access-Control-Allow-Origin": "*",
"Access-Control-Allow-Credentials": "true",
"Access-Control-Allow-Headers": "Access-Control-Allow-Headers, Access-Control-Request-Method, Connection, Content-Language, Access-Control-Request-Headers, Origin, X-Requested-With, Content-Type, Accept-Language, Accept, Z-Key, Authorization, client-id, client-secret, client_id, client_secret",
"Content-Type": "application/json",
"Access-Control-Allow-Methods": "GET, POST, PUT, DELETE, OPTIONS"
});
this.done();
return {
status: "success",
"data": {
"message": "We love OPTIONS"
}
};
}
}
});
Does anyone know what I am missing here?
I know it's usually standard to not send headers like Access-Control-Allow-Origin on failed requests (4xx, 5xx). I've worked around this in the past by hosting an API behind a web server like Apache, then instructing the web server to always set the Access-Control-Allow-Origin response header, ignoring the status code.
(This is one option. An example of this can be found here)
I also went and looked at the Restivus documentation specifically under the defaultHeaders configuration to see if they mention this behavior. Unfortunately, they don't mention this. But they do mention that you can override the default header behavior by explicitly providing the headers in your response object.
So you could define a Response class similar to this
class Response{
constructor(statusCode, body){
this.statusCode = statusCode;
this.body = body;
this.headers = {
"Access-Control-Allow-Origin": "*"
};
}
}
Then just return a Response object anytime you are sending a response, obviously setting statusCode and body as required.
I'd try setting enableCors to false.
I took a look at the packages code, it's possible when this option is set to true, the package replaces your customised Access-Control-Allow-Headers value with the package's default value of Origin, X-Requested-With, Content-Type, Accept.
The error message doesn't quite make sense with this reasoning but, it's worth a shot.
hello this is because whenever server return server error status code, the ajax return wont return the response like its return ok (200) status response you have to catch the request error to handle the error
function makeRequest(endpoint, body){
$.ajax({
url: 'http://localhost:3000/' + endpoint,
type: "POST",
dataType: "JSON",
contentType: "application/json; charset=utf-8",
data: body,
success: function(resp){
return resp
}
}).then((resp)=>{
//handle success
}, err =>{
//handle error
});
}