如何在javascript / jquery中提出ajax请求

Question

I am new to JavaScript and jQuery. I want to send an image to RTTI server. I have done the same task in native ios like below.

NSData *checkData = [NSData dataWithBytes:[self getImageFileBuffer]length:self.imageFileBufferSize];
NSString *extractionURLString = [[NSUserDefaults standardUserDefaults] valueForKey:@"serverAddress"];
NSURL *checkExtractionServerURL = [NSURL URLWithString:[NSString stringWithFormat:@"%@/mobilesdk/api/CheckDeposit",extractionURLString]];<br/>
NSMutableURLRequest  *urlRequest = [NSMutableURLRequest requestWithURL:checkExtractionServerURL cachePolicy:NSURLRequestReloadRevalidatingCacheData timeoutInterval:30];
[urlRequest setHTTPMethod:@"PUT"];
[urlRequest setValue:@"application/json" forHTTPHeaderField:@"Accept"];
[urlRequest setValue:@"image/tiff" forHTTPHeaderField:@"Content-Type"];
[urlRequest setHTTPBody:checkData];<br/>
NSURLConnection *checkConn = [[NSURLConnection alloc] initWithRequest:urlRequest delegate:self startImmediately:NO];
[checkConn scheduleInRunLoop:[NSRunLoop mainRunLoop] forMode:NSRunLoopCommonModes];
[checkConn start];

I have to do the above task in JavaScript/jQuery. I tried a lot but didn't get the solution. My JavaScript code is below.

var xhr4 = new XMLHttpRequest();
xhr4.open("POST", URL4, true);
xhr4.setRequestHeader('Content-Type', 'image/tiff');
xhr4.setRequestHeader('Accept','application/json');
xhr4.setRequestHeader('Content-Length',imageObjectData.length);
xhr4.onload = function (e4) {
    alert(e4.target.responseText);
};
xhr4.send(imageObjectData);

Please anybody help me.
Thanks in advance.

Answer 1

Use onreadystatechange instead of onload like,

var xhr4 = new XMLHttpRequest();
xhr4.open("POST", URL4, true);
xhr4.setRequestHeader('Content-Type', 'image/tiff'); 
xhr4.setRequestHeader('Accept','application/json');
xhr4.setRequestHeader('Content-Length',imageObjectData.length);
xhr4.onreadystatechange = function () { // use onreadystatechange 
     alert(xh4.responseText); // use xh4.responseText
};
xhr4.send(imageObjectData);

Answer 2

Use beforeSend to set header in jquery Ajax.

$.ajax({
        beforeSend: function(xhrObj){
                xhrObj.setRequestHeader("Content-Type","image/tiff");
                xhrObj.setRequestHeader("Accept","application/json");
        }
        type: "PUT",
        url: URL4,
        processData: false,
        data: jsonData,
        dataType: "json",
        success: function(json){
               // do something with response `json`...
        }
});