Edit: I just realized this is a duplicate of Recommended solution for AJAX, CORS, Chrome & HTTP error codes (401,403,404,500), and he tried the idea I propose at the end. But I can't tell if he succeeded (dud user?), and no one else has posted a solution or even a comment, so I think it's worth fishing for new answers.
Problem:
- I send a properly-executed (edit: IMproperly-executed. End of story...) CORS request.
- The server receives the request and attempts to process it.
- The server returns an error response, for example a
422 Unprocessable Entity
, along with JSON information about the errors. The idea is that my app could receive this error information and handle it appropriately in the UI. - The browser blocks my error handler from getting the response content, or even getting the status code.
Showing that the browser received the 401
status code but treated it as a CORS security error:
The response object, showing that my code cannot access the response data (data: ""
, status: 0
):
How have other people handled this limitation? My best guess right now is to hijack an HTTP "success" code (2XX
) as an error code, and then include the error information in the response. This prevents me from using the ajax error handlers in a normal way, but I'm handling this as a global ajax filter anyway, so this filter would capture the deviant success code and trigger the error handlers instead.