Error making request in Ajax

Question

I am sending a request by ajax to my REST server and am getting back:

Access to Xmlhttprequest at 'http://localhost:8081/datasnap/Rest/Tcadastros/Group/' from origin 'null' has been blocked by CORS policy: Response to preflight request doesn’t pass access control check: It does not have HTTP ok status.

Along with:

OPTIONS http://localhost:8081/datasnap/Rest/Tcadastros/Group/ 500 (Internal Server Error)

Can someone give me a little light on how to fix it? I understand that the problem is probably in the source header (Access-Control-Allow-Origin) but I don’t know how to pass it or if the problem is in the client side or server side.

My ajax is like this:

$(document).on('click', "#modalgravar", function(){


        var Ecdgrupo = $("#Cdgrupoedit").val();
        var Egrupo = $("#grupoedit").val();
        var eData = {"Cdgrupo": Ecdgrupo, "Grupos": Egrupo};
        var eURL = "http://localhost:8081/datasnap/rest/TCadastros/Grupo/"


    alert(JSON.stringify(eData));

        $.ajax({
        type:"PUT",
        url: eURL,
        crossDomain : true,
        data: JSON.stringify(eData),
        contentType:"application/json",
         headers:{'Access-Control-Allow-Origin': '*'},


                success: function(){
                    alert("Editado!");
                },
                error: function(){
                    alert("ERRO:  O grupo não foi editado!");
                 },

              });   
           });  

When I try to make the call in Internet Explorer it works perfectly, just like using Postman. But on Chrome and firefox it gives me these errors.

Answer 1

The mistake specifically when they contain null:

from origin 'null' has been blocked by CORS policy

Indicates that you are trying to access via protocol file:// probably (definitely?!), then for this to be allowed (if that is the intention) crossDomain:true will not work, this has to be solved in the back-end of your "REST", you can even solve some situations in HTML even, but I will not go into these details.

The error 500 (Internal Server Error) indicates error on the server side, not in your Ajax, because when the source domain is different from the domain accessed in Ajax it will try to access the URL via OPTIONS to check if there are the settings for CROSS-ORIGIN (CORS), if you have configured in your back end the route with options and released with the headers (obviously you do not need all, only the ones you need to send in the HTTP request):

Access-Control-Allow-Credentials
Access-Control-Allow-Headers
Access-Control-Allow-Methods
Access-Control-Allow-Origin
Access-Control-Expose-Headers
Access-Control-Max-Age

But as in your back-end/Rest should not even exist this, your BACK-END application emits error, because the route with OPTIONS is not configured, or this badly configured, or has some error in the script, for being anything, clearly all this is due usage error your