Api-Version header is not sent correctly

Dear friends I have a weird issue I try to connect to an API and when I try to do the API requests in postman or insomnia everything is okay. When I use the same code on my website and even on localhost the leads request doesn't work and tells me that api-version is not defined.

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script>
    var settings = {
        "async": true,
        "crossDomain": true,
        "url": "https://affiliate-api.tradingcrm.com:4477/token",
        "method": "POST",
        "data": "{ userName: \"alpt\", password: \"[email protected]\" }"
    }

    $.ajax(settings).done(function (response) {
        var settings2 = {
            "async": true,
            "crossDomain": true,
            "url": "https://affiliate-api.tradingcrm.com:4477/accounts/lead",
            "method": "POST",
            "headers": {
                "Authorization": "Bearer " + response.Token,
                "Api-Version": "3",
                "Content-Type": "application/json"
            },
            "data": "{firstName:\"test\",lastName:\"test2\",email:\"[email protected]\"}"
        }
        
        $.ajax(settings2).done(function (response2) {
            console.log(response2.accountId);
        });
    });
</script>

enter image description here

728x90

1 Answers Api-Version header is not sent correctly

Its CORS problem, the API server missing header Access-Control-Allow-Headers so you cannot set custom request header for example "Api-Version": "3", solution use CORS proxy or retrieve the data from your server or ask your provider to add it.

The different with Postman is postman do not ask server API it just simply send the headers, while Browser because different Domain it will asking by doing OPTIONS request with following headers before Post request made.

Access-Control-Request-Headers: api-version,authorization,content-type

Then the Server API need to response with headers

Access-Control-Allow-Headers: api-version,authorization,content-type

CORS Proxy test:

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script>
  var settings = {
    "async": true,
    "crossDomain": true,
    "url": "https://affiliate-api.tradingcrm.com:4477/token",
    "method": "POST",
    "data": "{ userName: \"alpt\", password: \"[email protected]\" }"
  }

  $.ajax(settings).done(function(response) {
    console.log('requesting using CORS Proxy.....');
    var settings2 = {
      "async": true,
      "crossDomain": true,
      "url": "https://cors-anywhere.herokuapp.com/https://affiliate-api.tradingcrm.com:4477/accounts/lead",
      "method": "POST",
      "headers": {
        "Authorization": "Bearer " + response.Token,
        "Api-Version": "3",
        "Content-Type": "application/json"
      },
      "data": "{firstName:\"test\",lastName:\"test2\",email:\"[email protected]\"}"
    }

    $.ajax(settings2)
    .done(function(response2) {
      console.log(response2.accountId);
    })
    .fail(function(jqXHR, textStatus) {
      console.log(textStatus);
      console.log(jqXHR.responseText);
    });
  })

</script>

6 days ago