1

Im trying to make a request from one application to another. So i created some headers which are required by my application and filled them in for the Ajax Request. Here is my code: 

$.ajax({
    method: 'GET',
    url: 'http://my-domain.com/apps/filters/get-filters',
    beforeSend: function(request){
        request.setRequestHeader("X-Webshop-Domain", window.location.host);
        request.setRequestHeader("X-Language", $('html').attr('lang'));
        request.setRequestHeader("X-Request-Protocol", window.location.protocol);
        request.setRequestHeader("X-Api-Version", '2');
    },
    headers: {
        "X-Webshop-Domain": window.location.host,
        "X-Language": $('html').attr('lang'),
        "X-Request-Protocol": window.location.protocol,
        "X-Api-Version": '2',
    },
    data: {}, success: function ( response )
    {

    }
});

Now when i load a page, this method is called but no response given. It gives me the "Header not allowed" issue. But when i check in my network tab (developer tools Chrome) i see my request, i see some headers but none of those. Does anybody has a idea how this is possible or what im doing wrong?

Donny van V
  • 921
  • 1
  • 10
  • 22

1 Answers1

1

In case of CORS (cross domain requests), only basic headers are allowed. You will need to add the headers you wish to send to the server's response header:

Access-Control-Allow-Headers: X-Webshop-Domain, ...

Here's a related question you may find useful: Ajax Request header field Key is not allowed by Access-Control-Allow-Headers

mingos
  • 23,778
  • 12
  • 70
  • 107