jquery - JSON Post with Customized HTTPHeader Field

Question

I have inherited some code that will eventually be part of an API call. Based on the existing code, the call is a post to retrieve JSON code with an access_token. While this would normally be simple and like every other API out there, this code requires that there be a customized httpheader field for the client secret.

I was able to make this work in Objective C with URLRequest, etc. but now that I am creating the call for a web component, I have been roadblocked.

I am using a pretty standard jquery post

        $.post('https://url.com', 
        {access_token:'XXXXXXXXXXXXXXXXXXX',
         function(data){
           console.info(data);
         }, 'json');

With a HTTP-EQUIV in the header. But the post never retrieves data and the server itself doesn't recognized that any call was made (even an incomplete one).

I may have to scrap this code and start over, but if anyone has encountered this problem before, please offer any insight.

Answer 1

What you posted has a syntax error, but it makes no difference as you cannot pass HTTP headers via $.post().

Provided you're on jQuery version >= 1.5, switch to $.ajax() and pass the headers (docs) option. (If you're on an older version of jQuery, I will show you how to do it via the beforeSend option.)

$.ajax({
    url: 'https://url.com',
    type: 'post',
    data: {
        access_token: 'XXXXXXXXXXXXXXXXXXX'
    },
    headers: {
        Header_Name_One: 'Header Value One',   //If your header name has spaces or any other char not appropriate
        "Header Name Two": 'Header Value Two'  //for object property name, use quoted notation shown in second
    },
    dataType: 'json',
    success: function (data) {
        console.info(data);
    }
});