X-Requested-With is not allowed by Access-Control-Allow-Headers

X-Requested-With is not allowed by Access-Control-Allow-Headers

I am developing one system. In that system there is one add item to cart functionality. In that functionality, I am using Jquery $.ajax used. But online server I have facing this error -

"XMLHttpRequest cannot load domain name/add_to_cart.php?item_id=3&hotel_id=2. Request header field X-Requested-With is not allowed by Access-Control-Allow-Headers."

Can any help me how to solve this error.

I am using this jquery code


  1. $(document).on('click', '.ordering_btn', function(){
  2.     var item_id = $(this).data('value');
  3.     var hotel_id = "<?php echo $hotel_id; ?>";

  5.     $.ajax({
  6.       type: 'GET',

  8.       url: 'add_to_cart.php?item_id='+item_id+'&hotel_id='+hotel_id+'',

  10.       contentType: 'text/plain',

  12.       xhrFields: {
  13.         withCredentials: false
  14.       },

  16.       headers: {
  17.         "Access-Control-Allow-Headers": "X-Requested-With",
  18.         "X-Requested-With": "XMLHttpRequest"        
  19.       },

  21.       success: function(data) {
  22.         $('#cart_msg').css('display', 'none');
  23.         $('#cart_item').html(data);
  24.         console.log(data);
  25.       },

  27.       error: function() {
  28.       }
  29.     });
  30. });