title: jQuery AJAX call results in error status 403
body: <p>I'm making a query to a web service using jQuery AJAX. My query looks like this:</p>
  
  <pre><code>var serviceEndpoint = 'http://example.com/object/details?version=1.1';
  $.ajax({
    type: 'GET', 
    url: serviceEndpoint,
    dataType: 'jsonp',
    contentType: 'jsonp',
    headers: { 'api-key':'myKey' },
    success: onSuccess,
    error: onFailure
  });
  </code></pre>
  
  <p>When I execute this, I get a status error of 403. I do not understand why my call results in having the status code 403. I'm in control of the security on my service and it is marked as wide-open. I know the key is valid, because I'm using it in another call, which works. Here is the call that works:</p>
  
  <pre><code>var endpoint = 'http://example.com/object/data/item?version=1.1';
  $.ajax({ 
    type: 'POST', 
    url: endpoint, 
    cache: 'false',
    contentType:'application/json',
    headers: {
      'api-key':'myKey',
      'Content-Type':'application/json'
    },
    data: JSON.stringify({
      id: 5,
      count:true
    }),
    success: onDataSuccess,
    error: onDataFailure
  });
  </code></pre>
  
  <p>I know these are two different endpoints. But I'm 100% convinced this is not a server-side authentication or permission error. Once again, everything is wide open on the server-side. Which implies that I'm making some mistake on my client-side request.</p>
  
  <p>I feel I should communicate that this request is being made during development. So, I'm running this from <a href="http://localhost:3000" rel="noreferrer">http://localhost:3000</a>. For that reason, I immediately assumed it was a CORS issue. But everything looks correct. The fact that my POST request works, but my GET doesn't has me absolutely frustrated. Am I missing something? What could it be?</p>