Hey drhectapus, It’s likely that your request with jQuery was considered a “simple request” and didn’t trigger a “CORS preflight.”
Now that you are using axios, the request may have a property that caused the issue. CORS is a sort of defense mechanism in the browser and on the server to prevent unauthorized requests to domains other than your current one.
What you will want to do is to be explicit in your API request by using the options available to you through axios. This will ensure that you maintain a “simple request.”
For example, one cause for CORS preflight according to the MDN docs: https://developer.mozilla.org/en-US/docs/Web/HTTP/Access_control_CORS
OR if the Content-Type header has a value other than the following:
So you would change your axios call to make sure you have one of those content types. You have to modify your axios call to a format that allows you to pass in an “options” object like this:
See if that does the trick. Otherwise you will need to analyze your request and compare its properties against the criteria in the MDN article to figure out how you’ve triggered the CORS preflight.
A quick note about the server side. It’s common to prohibit these types of requests for security reasons and you can see why - PUT and DELETE by unathenticated/unauthorized users. On the server side, you can allow CORS by adding this to the header response object: ‘Access-Control-Allow-Origin’: ‘*’
Hope this helps!