I need to do a getJSON()
request, but how do I pass authorisation and custom headers?
I am getting issues that the request header is taking the name, but NOT the values. The URL is being shown through a manual request in fiddler to being inserted in as options instead of GET/Url.
Here is an example of what we are trying to do that works fine in fiddler; how can I replicate this with the AJAX function?
GET /Service.svc/logins/gdd53535342/houses/vxcbdfsdg/people/dsgsdggd?format=json HTTP/1.1 User-Agent: Fiddler Authorization: Basic rgbg423535fa23y4436 X-PartnerKey: df3fgeg-g5g6-b55b-f3d2-dsgg353523 Host: 154.34.53.54:2757
JavaScript code:
xhr = new XMLHttpRequest(); $(document).ready(function() { $.ajax({ url: 'http://localhost:437/service.svc/logins/jeffrey/house/fas6347/devices?format=json', type: 'GET', datatype: 'json', success: function() { alert("Success"); }, error: function() { alert('Failed!'); }, beforeSend: setHeader }); }); function setHeader(xhr) { xhr.setRequestHeader('Authorization', 'Basic faskd52352rwfsdfs'); xhr.setRequestHeader('X-PartnerKey', '3252352-sdgds-sdgd-dsgs-sgs332fs3f'); }
Fiddler Normal Request Headers:
GET /service.svc/logins/jeffrey/house/fas6347/devices?format=json HTTP/1.1 User-Agent: Fiddler Authorization: Basic faskd52352rwfsdfs X-PartnerKey: 3252352-sdgds-sdgd-dsgs-sgs332fs3f Host: localhost:437
Fiddler Through Ajax()
Request Headers:
OPTIONS service.svc/logins/jeffrey/house/fas6347/devices?format=json HTTP/1.1 Host: localhost:437 User-Agent: Mozilla/5.0 (Windows; U; Windows NT 6.1; en-US; rv:1.9.2.6) Gecko/20100625 Firefox/3.6.6 Accept: text/html,application/xhtml+xml,application/xml;q=0.9,*/*;q=0.8 Accept-Language: en-us,en;q=0.5 Accept-Encoding: gzip,deflate Accept-Charset: ISO-8859-1,utf-8;q=0.7,*;q=0.7 Keep-Alive: 115 Proxy-Connection: keep-alive Origin: http://ipv4.fiddler:61975 Access-Control-Request-Method: GET Access-Control-Request-Headers: authorization,x-partnerkey
getJSON( url, [data], [callback] ) method loads JSON data from the server using a GET HTTP request. The method returns XMLHttpRequest object.
The getJSON() method is used to get JSON data using an AJAX HTTP GET request.
It is a callback function that executes on the successful server request. It also has three parameters that are data, status, and xhr in which data contains the data returned from the server, status represents the request status like "success", "error", etc., and the xhr contains the XMLHttpRequest object.
I agree with sunetos that you'll have to use the $.ajax function in order to pass request headers. In order to do that, you'll have to write a function for the beforeSend event handler, which is one of the $.ajax() options. Here's a quick sample on how to do that:
<html> <head> <script src="http://code.jquery.com/jquery-1.4.2.min.js"></script> <script type="text/javascript"> $(document).ready(function() { $.ajax({ url: 'service.svc/Request', type: 'GET', dataType: 'json', success: function() { alert('hello!'); }, error: function() { alert('boo!'); }, beforeSend: setHeader }); }); function setHeader(xhr) { xhr.setRequestHeader('securityCode', 'Foo'); xhr.setRequestHeader('passkey', 'Bar'); } </script> </head> <body> <h1>Some Text</h1> </body> </html>
If you run the code above and watch the traffic in a tool like Fiddler, you'll see two requests headers passed in:
The setHeader function could also be inline in the $.ajax options, but I wanted to call it out.
Hope this helps!
I think you could set the headers and still use getJSON() like this:
$.ajaxSetup({ headers : { 'Authorization' : 'Basic faskd52352rwfsdfs', 'X-PartnerKey' : '3252352-sdgds-sdgd-dsgs-sgs332fs3f' } }); $.getJSON('http://localhost:437/service.svc/logins/jeffrey/house/fas6347/devices?format=json', function(json) { alert("Success"); });
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With