GraphQL Ajax Get request

Question

I am trying to figure out how to write a graphQL Ajax GET request. When I type in the complete url in my browser I do get back data.

However, when I want to try to get the data via a Ajax GET method:

$.get({
  url: 'https://ltbliqkb1c.execute-api.eu-west-1.amazonaws.com/thomas/query?query=%7B%20book(id:%229789024576807%22)%20%7B%20bol%20%7B%20id%20%7D%20itunes%20%7B%20beschikbaar%20%7D%20%7D%7D',
    contentType: 'application/json',
    crossDomain:true,
     headers: {
        'Access-Control-Allow-Origin': 'https://ltbliqkb1c.execute-api.eu-west-1.amazonaws.com/',
        'Access-Control-Allow-Credentials': true
    }

}).done(function(response) {
  console.log('Data:', response.data);
});

I'm getting a:

Failed to load https://ltbliqkb1c.execute-api.eu-west-1.amazonaws.com/thomas/query?query=%7B%20book(id:%229789024576807%22)%20%7B%20bol%20%7B%20id%20%7D%20itunes%20%7B%20beschikbaar%20%7D%20%7D%7D: Request header field Access-Control-Allow-Origin is not allowed by Access-Control-Allow-Headers in preflight response.

My Graphql query:

{
  book(id: "9789024576791") {
    bol {
      id
    }
    itunes {
      beschikbaar
    }
  }
}

I've also tried the following js:

var test =  JSON.stringify('{book(id:"9789047202363"){bol{id}}}')
$.ajax({
     method: "GET",
          url: "https://ltbliqkb1c.execute-api.eu-west-1.amazonaws.com/thomas/query?"+test,
          contentType: "application/json",
          crossDomain:true,
          success: function(data) {     
               console.log('data',data);
          },
          error: function(err) {
               console.log(err);
          }
});

And with the following variable to stringify:

var test= ` book($id: String!){
              bol{
                id,
                ean,
                mobileUrl,
                desktopUrl
              }
              itunes{
                beschikbaar
                auteur
                titel
              }
            }
          }`

Answer 1

Set headers to answer as access-control-allow-origin:*